From 74bd0f328e209efa75b984f8b8d8fd5ae6d65c6a Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 09:24:20 +0800
Subject: [PATCH 01/33] no message

Former-commit-id: ccc85bbb37276320246c4d7c1f362904b84430d5
Former-commit-id: 829dfc50bdac1be42031fe8d3a4a815f79535315
Former-commit-id: 04da360f1110e9033f5571ea1901f8f1d89a5db7
---
 .../-header-right/components/-theme.vue       | 48 +++++++++----------
 1 file changed, 23 insertions(+), 25 deletions(-)

diff --git a/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue b/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
index b838edb6..d7802460 100644
--- a/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
+++ b/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
@@ -5,22 +5,16 @@
         <d2-icon name="diamond"/>
       </el-button>
     </el-tooltip>
-    <el-dialog title="主题" :visible.sync="dialogVisible">
-      <el-table :data="tableData">
-        <el-table-column prop="name" label="主题名称" width="100"></el-table-column>
-        <el-table-column
-          label="预览"
-          width="220">
-          <template slot-scope="scope">
-            <div
-              class="theme-preview"
-              :style="{'backgroundImage': `url(${ scope.row.preview })`}">
-            </div>
-          </template>
+    <el-dialog title="主题" width="500px" :visible.sync="dialogVisible">
+      <el-table v-bind="table">
+        <el-table-column prop="name" align="center" width="100"/>
+        <el-table-column label="预览" width="220">
+          <div slot-scope="scope" class="theme-preview" :style="{'backgroundImage': `url(${ scope.row.preview })`}"></div>
         </el-table-column>
-        <el-table-column
-          prop="address"
-          label="地址">
+        <el-table-column prop="address" align="center">
+          <template slot-scope="scope">
+            <el-button type="primary">使用</el-button>
+          </template>
         </el-table-column>
       </el-table>
     </el-dialog>
@@ -32,16 +26,20 @@ export default {
   data () {
     return {
       dialogVisible: false,
-      tableData: [
-        {
-          name: 'd2admin',
-          preview: '/static/image/theme-preview/d2admin@2x.png'
-        },
-        {
-          name: 'star',
-          preview: '/static/image/theme-preview/star@2x.png'
-        }
-      ]
+      table: {
+        data: [
+          {
+            name: 'd2admin',
+            preview: '/static/image/theme-preview/d2admin@2x.png'
+          },
+          {
+            name: 'star',
+            preview: '/static/image/theme-preview/star@2x.png'
+          }
+        ],
+        showHeader: false,
+        border: true
+      }
     }
   }
 }

From bb50ad2b63d1c6f576799e5e871dd822b0fb120b Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 09:42:38 +0800
Subject: [PATCH 02/33] no message

Former-commit-id: 36430ec3572727c263defaef7f08b4baf9cd79b8
Former-commit-id: 501e3c9de8d231b96a5e447dd9d9c5271d024cb5
Former-commit-id: d45a3e8ae5176a800a1c28897cb1908ebce89731
---
 docs/zh/guide/change-log.md                  |   1 +
 src/assets/style/theme/d2admin/index.scss    | 129 +++++++++++++++++++
 src/components/core/d2-layout-main/index.vue |   4 +
 src/main.js                                  |   5 +-
 4 files changed, 135 insertions(+), 4 deletions(-)
 create mode 100644 src/assets/style/theme/d2admin/index.scss

diff --git a/docs/zh/guide/change-log.md b/docs/zh/guide/change-log.md
index 8af971e0..e5571582 100644
--- a/docs/zh/guide/change-log.md
+++ b/docs/zh/guide/change-log.md
@@ -11,6 +11,7 @@
 * [ 修复 ] 首次加载 loading 样式类名和程序内类名冲突，新的加载类名使用 `d2-app-loading` 前缀
 * [ 修改 ] 所有类似 `dd-` 的样式前缀(包括自动注册图标的id前缀)统一改为 `d2-`
 * [ 修复 ] 修复 `highlight` 组件和 `markdown` 组件的样式冲突
+* [ 修改 ] 内置组件名称统一改为 `d2-` 前缀，统一使用横线连接 (kebab-case) 风格
 
 ## v1.0.0
 
diff --git a/src/assets/style/theme/d2admin/index.scss b/src/assets/style/theme/d2admin/index.scss
new file mode 100644
index 00000000..d5e2ab9e
--- /dev/null
+++ b/src/assets/style/theme/d2admin/index.scss
@@ -0,0 +1,129 @@
+@import '../theme.scss';
+
+$theme-name: 'd2admin';
+$theme-bg-color: #EFF4F8;
+// $theme-bg-image: '/static/image/bg/star.jpg';
+$theme-container-full-border-color: #d8dfea;
+
+.theme-#{$theme-name} {
+  .theme {
+    background-color: $theme-bg-color;
+    background-size: cover;
+    background-position: center;
+  }
+  // 菜单项目
+  @mixin theme-menu-hover-style {
+    background-color: #eff4f8;
+  }
+  .el-submenu__title:hover {
+    @include theme-menu-hover-style;
+  }
+  .el-menu-item:hover {
+    @include theme-menu-hover-style;
+  }
+  .el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
+    @include theme-menu-hover-style;
+  }
+  .el-menu--horizontal .el-menu .el-submenu__title:hover {
+    @include theme-menu-hover-style;
+  }
+  // [组件] d2-container-full
+  .d2-container-full {
+    .d2-container-full__header {
+      border-bottom: 1px solid $theme-container-full-border-color;
+    }
+    .d2-container-full__footer {
+      border-top: 1px solid $theme-container-full-border-color;
+    }
+  }
+  // 顶栏
+  .el-header {
+    // 切换按钮
+    .toggle-aside-btn {
+      i {
+        color: #FFF;
+        &:hover {
+          color: #FFF;
+        }
+      }
+    }
+    // 顶栏菜单
+    .el-menu {
+      .el-menu-item {
+        transition: border-top-color 0s;
+        color: #FFF;
+        &:hover {
+          background-color: rgba(#FFF, .3);
+        }
+        &:focus {
+          background-color: rgba(#FFF, .3);
+        }
+        &.is-active {
+          background-color: rgba(#000, .3);
+        }
+      }
+      .el-submenu {
+        .el-submenu__title {
+          transition: border-top-color 0s;
+          color: #FFF;
+          &:hover {
+            background-color: rgba(#FFF, .3);
+          }
+          &:focus {
+            background-color: rgba(#FFF, .3);
+          }
+          .el-submenu__icon-arrow {
+            color: #FFF;
+          }
+        }
+      }
+    }
+    // 顶栏右侧
+    .d2-header-right {
+      .btn-text {
+        color: #FFF;
+        &:hover {
+          background-color: rgba(#FFF, .1);
+        }
+      }
+    }
+  }
+  // [布局] 顶栏下面
+  .el-container {
+    // 侧边栏
+    .el-aside {
+      // [菜单] 正常状态
+      .el-menu {
+        .el-menu-item {
+          color: #FFF;
+          &:hover {
+            background-color: rgba(#FFF, .3);
+          }
+          &:focus {
+            background-color: rgba(#FFF, .3);
+          }
+          i {
+            color: #FFF;
+          }
+          &.is-active {
+            background-color: rgba(#000, .3);
+          }
+        }
+      }
+      .el-submenu {
+        .el-submenu__title {
+          color: #FFF;
+          &:hover {
+            background-color: rgba(#FFF, .3);
+          }
+          i {
+            color: #FFF;
+          }
+          .el-submenu__icon-arrow {
+            color: #FFF;
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/components/core/d2-layout-main/index.vue b/src/components/core/d2-layout-main/index.vue
index c4b081ab..817346a2 100644
--- a/src/components/core/d2-layout-main/index.vue
+++ b/src/components/core/d2-layout-main/index.vue
@@ -44,11 +44,15 @@ export default {
       // [侧边栏宽度] 折叠状态
       asideWidthCollapse: '65px'
     }
+  },
+  mounted () {
+    document.body.className = 'theme-star'
   }
 }
 </script>
 
 <style lang="scss">
 // 主题
+@import '~@/assets/style/theme/d2admin/index.scss';
 @import '~@/assets/style/theme/star/index.scss';
 </style>
diff --git a/src/main.js b/src/main.js
index 2b862006..0135ca41 100755
--- a/src/main.js
+++ b/src/main.js
@@ -57,8 +57,5 @@ new Vue({
   i18n,
   router,
   template: '<App/>',
-  components: { App },
-  mounted () {
-    document.body.className = 'theme-star'
-  }
+  components: { App }
 })

From 3bcd8c51e439796605c8ea86ec04c65097ed15c4 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 10:00:02 +0800
Subject: [PATCH 03/33] no message

Former-commit-id: 75387e28983051ce24404b9295d64e9d2a8a96f9
Former-commit-id: 6db2187d27f42fb3b6baf48519dde7f20e85406d
Former-commit-id: 699d4b032b5cd67314a1de5181527af206f74ac1
---
 src/assets/style/theme/star/index.scss | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/assets/style/theme/star/index.scss b/src/assets/style/theme/star/index.scss
index ade5965a..e349c479 100644
--- a/src/assets/style/theme/star/index.scss
+++ b/src/assets/style/theme/star/index.scss
@@ -3,7 +3,7 @@
 $theme-name: 'star';
 $theme-bg-color: #EFF4F8;
 $theme-bg-image: '/static/image/bg/star.jpg';
-$theme-container-full-border-color: #d8dfea;
+$theme-container-border-color: #d8dfea;
 
 .theme-#{$theme-name} {
   .theme {
@@ -31,10 +31,10 @@ $theme-container-full-border-color: #d8dfea;
   // [组件] d2-container-full
   .d2-container-full {
     .d2-container-full__header {
-      border-bottom: 1px solid $theme-container-full-border-color;
+      border-bottom: 1px solid $theme-container-border-color;
     }
     .d2-container-full__footer {
-      border-top: 1px solid $theme-container-full-border-color;
+      border-top: 1px solid $theme-container-border-color;
     }
   }
   // 顶栏

From 444214d448757d7ad1b30ebd0b66fbae825e1311 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 10:41:42 +0800
Subject: [PATCH 04/33] no message

Former-commit-id: 5e50d6b200ff2da546a94c7261335d163877685d
Former-commit-id: 72b2a0609e3cc724fe20b706ca42bf0930b33fd9
Former-commit-id: 359c3c40ba7e34c90c2b8293482ebe73fdb9fd56
---
 src/assets/style/theme/star/index.scss       | 97 +++++++++++++-------
 src/assets/style/theme/theme.scss            |  2 +-
 src/components/core/d2-container/index.vue   |  2 +-
 src/components/core/d2-layout-main/index.vue |  2 +-
 4 files changed, 68 insertions(+), 35 deletions(-)

diff --git a/src/assets/style/theme/star/index.scss b/src/assets/style/theme/star/index.scss
index e349c479..7b8f0b89 100644
--- a/src/assets/style/theme/star/index.scss
+++ b/src/assets/style/theme/star/index.scss
@@ -1,12 +1,36 @@
 @import '../theme.scss';
 
+// 主题名称
 $theme-name: 'star';
+// 主题背景颜色
 $theme-bg-color: #EFF4F8;
+// 主题背景图片
 $theme-bg-image: '/static/image/bg/star.jpg';
-$theme-container-border-color: #d8dfea;
+// container组件的边框
+$theme-container-border: 1px solid #d8dfea;
+// 顶栏和侧边栏中展开的菜单 hover 状态下的文字和图标颜色
+$theme-menu-item-color-hover: #FFF;
+// 顶栏和侧边栏中展开的菜单 hover 状态下的背景颜色
+$theme-menu-item-background-color-hover: #187181;
+// 顶栏上的文字颜色
+$theme-header-text-color: #FFF;
+// 顶栏上的项目在 hover 时的背景颜色
+$theme-header-item-background-color-hover: rgba(#FFF, .3);
+// 顶栏上的项目在 focus 时的背景颜色
+$theme-header-item-background-color-focus: rgba(#FFF, .3);
+// 顶栏上的项目在 active 时的背景颜色
+$theme-header-item-background-color-active: rgba(#000, .3);
+// 侧边栏上的文字颜色
+$theme-aside-text-color: #FFF;
+// 侧边栏上的项目在 hover 时的背景颜色
+$theme-aside-item-background-color-hover: rgba(#FFF, .3);
+// 顶栏上的项目在 focus 时的背景颜色
+$theme-aside-item-background-color-focus: rgba(#FFF, .3);
+// 侧边栏上的项目在 active 时的背景颜色
+$theme-aside-item-background-color-active: rgba(#000, .3);
 
 .theme-#{$theme-name} {
-  .theme {
+  .layout-main {
     background-color: $theme-bg-color;
     background-image: url($theme-bg-image);
     background-size: cover;
@@ -14,7 +38,11 @@ $theme-container-border-color: #d8dfea;
   }
   // 菜单项目
   @mixin theme-menu-hover-style {
-    background-color: #eff4f8;
+    color: $theme-menu-item-color-hover;
+    i {
+      color: $theme-menu-item-color-hover;
+    }
+    background-color: $theme-menu-item-background-color-hover;
   }
   .el-submenu__title:hover {
     @include theme-menu-hover-style;
@@ -28,23 +56,28 @@ $theme-container-border-color: #d8dfea;
   .el-menu--horizontal .el-menu .el-submenu__title:hover {
     @include theme-menu-hover-style;
   }
+
   // [组件] d2-container-full
   .d2-container-full {
     .d2-container-full__header {
-      border-bottom: 1px solid $theme-container-border-color;
+      border-bottom: $theme-container-border;
     }
     .d2-container-full__footer {
-      border-top: 1px solid $theme-container-border-color;
+      border-top: $theme-container-border;
     }
   }
+  // [组件] d2-container-card
+  .d2-container-card {
+    border: $theme-container-border;
+  }
   // 顶栏
   .el-header {
     // 切换按钮
     .toggle-aside-btn {
       i {
-        color: #FFF;
+        color: $theme-header-text-color;
         &:hover {
-          color: #FFF;
+          color: $theme-header-text-color;
         }
       }
     }
@@ -52,29 +85,29 @@ $theme-container-border-color: #d8dfea;
     .el-menu {
       .el-menu-item {
         transition: border-top-color 0s;
-        color: #FFF;
+        color: $theme-header-text-color;
         &:hover {
-          background-color: rgba(#FFF, .3);
+          background-color: $theme-header-item-background-color-hover;
         }
         &:focus {
-          background-color: rgba(#FFF, .3);
+          background-color: $theme-header-item-background-color-focus;
         }
         &.is-active {
-          background-color: rgba(#000, .3);
+          background-color: $theme-header-item-background-color-active;
         }
       }
       .el-submenu {
         .el-submenu__title {
           transition: border-top-color 0s;
-          color: #FFF;
+          color: $theme-header-text-color;
+          .el-submenu__icon-arrow {
+            color: $theme-header-text-color;
+          }
           &:hover {
-            background-color: rgba(#FFF, .3);
+            background-color: $theme-header-item-background-color-hover;
           }
           &:focus {
-            background-color: rgba(#FFF, .3);
-          }
-          .el-submenu__icon-arrow {
-            color: #FFF;
+            background-color: $theme-header-item-background-color-focus;
           }
         }
       }
@@ -82,9 +115,9 @@ $theme-container-border-color: #d8dfea;
     // 顶栏右侧
     .d2-header-right {
       .btn-text {
-        color: #FFF;
+        color: $theme-header-text-color;
         &:hover {
-          background-color: rgba(#FFF, .1);
+          background-color: $theme-header-item-background-color-hover;
         }
       }
     }
@@ -96,32 +129,32 @@ $theme-container-border-color: #d8dfea;
       // [菜单] 正常状态
       .el-menu {
         .el-menu-item {
-          color: #FFF;
+          color: $theme-aside-text-color;
+          i {
+            color: $theme-aside-text-color;
+          }
           &:hover {
-            background-color: rgba(#FFF, .3);
+            background-color: $theme-aside-item-background-color-hover;
           }
           &:focus {
-            background-color: rgba(#FFF, .3);
-          }
-          i {
-            color: #FFF;
+            background-color: $theme-aside-item-background-color-focus;
           }
           &.is-active {
-            background-color: rgba(#000, .3);
+            background-color: $theme-aside-item-background-color-active;
           }
         }
       }
       .el-submenu {
         .el-submenu__title {
-          color: #FFF;
-          &:hover {
-            background-color: rgba(#FFF, .3);
-          }
+          color: $theme-aside-text-color;
           i {
-            color: #FFF;
+            color: $theme-aside-text-color;
           }
           .el-submenu__icon-arrow {
-            color: #FFF;
+            color: $theme-aside-text-color;
+          }
+          &:hover {
+            background-color: $theme-aside-item-background-color-hover;
           }
         }
       }
diff --git a/src/assets/style/theme/theme.scss b/src/assets/style/theme/theme.scss
index 3f1af9ed..7d46d1aa 100644
--- a/src/assets/style/theme/theme.scss
+++ b/src/assets/style/theme/theme.scss
@@ -1,7 +1,7 @@
 @import '~@/assets/style/public.scss';
 
 // 主题公用
-.theme {
+.layout-main {
   height: 100vh;
   width: 100vw;
   // [布局] 顶栏
diff --git a/src/components/core/d2-container/index.vue b/src/components/core/d2-container/index.vue
index 71bb2f08..55a7e549 100644
--- a/src/components/core/d2-container/index.vue
+++ b/src/components/core/d2-container/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container-component" :class="{responsive}">
     <!-- [card] 卡片容器 -->
-    <el-card v-if="type === 'card'" class="d2-mr d2-mb">
+    <el-card v-if="type === 'card'" class="d2-container-card d2-mr d2-mb">
       <slot v-if="$slots.header" name="header" slot="header"/>
       <slot/>
     </el-card>
diff --git a/src/components/core/d2-layout-main/index.vue b/src/components/core/d2-layout-main/index.vue
index 817346a2..7094e98c 100644
--- a/src/components/core/d2-layout-main/index.vue
+++ b/src/components/core/d2-layout-main/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-container class="layout-main theme">
+  <el-container class="layout-main">
     <!-- 顶栏 -->
     <el-header>
       <div class="logo-group" :style="{width: collapse ? asideWidthCollapse : asideWidth}">

From fc1b729294192716d2b52f00479cb06c9311b4b9 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 10:56:34 +0800
Subject: [PATCH 05/33] no message

Former-commit-id: f9b75cdafb5fad0b179a6c0f08cb879a7fd12dd3
Former-commit-id: 3b126bcb4f5547a63cb75fe9f0a25c3b41fc56e6
Former-commit-id: 5c161fbfdac589557a05f84585ea3def43480bce
---
 src/assets/style/theme/star/index.scss                     | 7 +++++--
 .../components/-header-right/components/-full-screen.vue   | 2 +-
 .../components/-header-right/components/-theme.vue         | 2 +-
 3 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/assets/style/theme/star/index.scss b/src/assets/style/theme/star/index.scss
index 7b8f0b89..9ab30d61 100644
--- a/src/assets/style/theme/star/index.scss
+++ b/src/assets/style/theme/star/index.scss
@@ -30,6 +30,7 @@ $theme-aside-item-background-color-focus: rgba(#FFF, .3);
 $theme-aside-item-background-color-active: rgba(#000, .3);
 
 .theme-#{$theme-name} {
+
   .layout-main {
     background-color: $theme-bg-color;
     background-image: url($theme-bg-image);
@@ -116,8 +117,10 @@ $theme-aside-item-background-color-active: rgba(#000, .3);
     .d2-header-right {
       .btn-text {
         color: $theme-header-text-color;
-        &:hover {
-          background-color: $theme-header-item-background-color-hover;
+        &.can-hover {
+          &:hover {
+            background-color: $theme-header-item-background-color-hover;
+          }
         }
       }
     }
diff --git a/src/components/core/d2-layout-main/components/-header-right/components/-full-screen.vue b/src/components/core/d2-layout-main/components/-header-right/components/-full-screen.vue
index 587073e1..7f877d71 100644
--- a/src/components/core/d2-layout-main/components/-header-right/components/-full-screen.vue
+++ b/src/components/core/d2-layout-main/components/-header-right/components/-full-screen.vue
@@ -3,7 +3,7 @@
     effect="dark"
     :content="isFullScreen ? '退出全屏' : '全屏'"
     placement="bottom">
-    <el-button class="d2-mr btn-text" type="text" @click="toggleFullScreen">
+    <el-button class="d2-mr btn-text can-hover" type="text" @click="toggleFullScreen">
       <d2-icon v-if="isFullScreen" name="compress"/>
       <d2-icon v-else name="arrows-alt"/>
     </el-button>
diff --git a/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue b/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
index d7802460..fb5e9ec7 100644
--- a/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
+++ b/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <el-tooltip effect="dark" content="theme" placement="bottom">
-      <el-button class="d2-ml-0 d2-mr btn-text" type="text" @click="dialogVisible = true">
+      <el-button class="d2-ml-0 d2-mr btn-text can-hover" type="text" @click="dialogVisible = true">
         <d2-icon name="diamond"/>
       </el-button>
     </el-tooltip>

From 989f3c2c1c5b61500ea460679f5c89c2b42f3768 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 11:04:57 +0800
Subject: [PATCH 06/33] no message

Former-commit-id: 71a2e00e945b70550680f08dc132c2771a22eef0
Former-commit-id: e21e24b29a8b1d8e79fbd405d78b4d7f7a9ac533
Former-commit-id: 9c65556e3db5789c7d599936681d805ea77db694
---
 src/assets/style/theme/d2admin/index.scss | 106 +++++++++++++++-------
 src/assets/style/theme/star/index.scss    |   6 +-
 2 files changed, 77 insertions(+), 35 deletions(-)

diff --git a/src/assets/style/theme/d2admin/index.scss b/src/assets/style/theme/d2admin/index.scss
index d5e2ab9e..940e082e 100644
--- a/src/assets/style/theme/d2admin/index.scss
+++ b/src/assets/style/theme/d2admin/index.scss
@@ -1,19 +1,52 @@
 @import '../theme.scss';
 
+// 主题名称
 $theme-name: 'd2admin';
+// 主题背景颜色
 $theme-bg-color: #EFF4F8;
+// 主题背景图片
 // $theme-bg-image: '/static/image/bg/star.jpg';
-$theme-container-full-border-color: #d8dfea;
+// container组件的边框
+$theme-container-border: 1px solid #d8dfea;
+
+// 顶栏和侧边栏中展开的菜单 hover 状态下的文字和图标颜色
+$theme-menu-item-color-hover: #293849;
+// 顶栏和侧边栏中展开的菜单 hover 状态下的背景颜色
+$theme-menu-item-background-color-hover: #F4F6F8;
+
+// 顶栏上的文字颜色
+$theme-header-text-color: #30312D;
+// 顶栏上的项目在 hover 时的背景颜色
+$theme-header-item-background-color-hover: rgba(#000, .03);
+// 顶栏上的项目在 focus 时的背景颜色
+$theme-header-item-background-color-focus: rgba(#000, .03);
+// 顶栏上的项目在 active 时的背景颜色
+$theme-header-item-background-color-active: rgba(#000, .05);
+
+// 侧边栏上的文字颜色
+$theme-aside-text-color: #30312D;
+// 侧边栏上的项目在 hover 时的背景颜色
+$theme-aside-item-background-color-hover: rgba(#000, .03);
+// 顶栏上的项目在 focus 时的背景颜色
+$theme-aside-item-background-color-focus: rgba(#000, .03);
+// 侧边栏上的项目在 active 时的背景颜色
+$theme-aside-item-background-color-active: rgba(#000, .05);
 
 .theme-#{$theme-name} {
-  .theme {
+
+  .layout-main {
     background-color: $theme-bg-color;
+    // background-image: url($theme-bg-image);
     background-size: cover;
     background-position: center;
   }
   // 菜单项目
   @mixin theme-menu-hover-style {
-    background-color: #eff4f8;
+    color: $theme-menu-item-color-hover;
+    i {
+      color: $theme-menu-item-color-hover;
+    }
+    background-color: $theme-menu-item-background-color-hover;
   }
   .el-submenu__title:hover {
     @include theme-menu-hover-style;
@@ -27,23 +60,28 @@ $theme-container-full-border-color: #d8dfea;
   .el-menu--horizontal .el-menu .el-submenu__title:hover {
     @include theme-menu-hover-style;
   }
+
   // [组件] d2-container-full
   .d2-container-full {
     .d2-container-full__header {
-      border-bottom: 1px solid $theme-container-full-border-color;
+      border-bottom: $theme-container-border;
     }
     .d2-container-full__footer {
-      border-top: 1px solid $theme-container-full-border-color;
+      border-top: $theme-container-border;
     }
   }
+  // [组件] d2-container-card
+  .d2-container-card {
+    border: $theme-container-border;
+  }
   // 顶栏
   .el-header {
     // 切换按钮
     .toggle-aside-btn {
       i {
-        color: #FFF;
+        color: $theme-header-text-color;
         &:hover {
-          color: #FFF;
+          color: $theme-header-text-color;
         }
       }
     }
@@ -51,29 +89,29 @@ $theme-container-full-border-color: #d8dfea;
     .el-menu {
       .el-menu-item {
         transition: border-top-color 0s;
-        color: #FFF;
+        color: $theme-header-text-color;
         &:hover {
-          background-color: rgba(#FFF, .3);
+          background-color: $theme-header-item-background-color-hover;
         }
         &:focus {
-          background-color: rgba(#FFF, .3);
+          background-color: $theme-header-item-background-color-focus;
         }
         &.is-active {
-          background-color: rgba(#000, .3);
+          background-color: $theme-header-item-background-color-active;
         }
       }
       .el-submenu {
         .el-submenu__title {
           transition: border-top-color 0s;
-          color: #FFF;
+          color: $theme-header-text-color;
+          .el-submenu__icon-arrow {
+            color: $theme-header-text-color;
+          }
           &:hover {
-            background-color: rgba(#FFF, .3);
+            background-color: $theme-header-item-background-color-hover;
           }
           &:focus {
-            background-color: rgba(#FFF, .3);
-          }
-          .el-submenu__icon-arrow {
-            color: #FFF;
+            background-color: $theme-header-item-background-color-focus;
           }
         }
       }
@@ -81,9 +119,11 @@ $theme-container-full-border-color: #d8dfea;
     // 顶栏右侧
     .d2-header-right {
       .btn-text {
-        color: #FFF;
-        &:hover {
-          background-color: rgba(#FFF, .1);
+        color: $theme-header-text-color;
+        &.can-hover {
+          &:hover {
+            background-color: $theme-header-item-background-color-hover;
+          }
         }
       }
     }
@@ -95,32 +135,32 @@ $theme-container-full-border-color: #d8dfea;
       // [菜单] 正常状态
       .el-menu {
         .el-menu-item {
-          color: #FFF;
+          color: $theme-aside-text-color;
+          i {
+            color: $theme-aside-text-color;
+          }
           &:hover {
-            background-color: rgba(#FFF, .3);
+            background-color: $theme-aside-item-background-color-hover;
           }
           &:focus {
-            background-color: rgba(#FFF, .3);
-          }
-          i {
-            color: #FFF;
+            background-color: $theme-aside-item-background-color-focus;
           }
           &.is-active {
-            background-color: rgba(#000, .3);
+            background-color: $theme-aside-item-background-color-active;
           }
         }
       }
       .el-submenu {
         .el-submenu__title {
-          color: #FFF;
-          &:hover {
-            background-color: rgba(#FFF, .3);
-          }
+          color: $theme-aside-text-color;
           i {
-            color: #FFF;
+            color: $theme-aside-text-color;
           }
           .el-submenu__icon-arrow {
-            color: #FFF;
+            color: $theme-aside-text-color;
+          }
+          &:hover {
+            background-color: $theme-aside-item-background-color-hover;
           }
         }
       }
diff --git a/src/assets/style/theme/star/index.scss b/src/assets/style/theme/star/index.scss
index 9ab30d61..5c6cdff7 100644
--- a/src/assets/style/theme/star/index.scss
+++ b/src/assets/style/theme/star/index.scss
@@ -8,10 +8,11 @@ $theme-bg-color: #EFF4F8;
 $theme-bg-image: '/static/image/bg/star.jpg';
 // container组件的边框
 $theme-container-border: 1px solid #d8dfea;
-// 顶栏和侧边栏中展开的菜单 hover 状态下的文字和图标颜色
+
+// 顶栏和侧边栏中展开的菜单 hover 状态下
 $theme-menu-item-color-hover: #FFF;
-// 顶栏和侧边栏中展开的菜单 hover 状态下的背景颜色
 $theme-menu-item-background-color-hover: #187181;
+
 // 顶栏上的文字颜色
 $theme-header-text-color: #FFF;
 // 顶栏上的项目在 hover 时的背景颜色
@@ -20,6 +21,7 @@ $theme-header-item-background-color-hover: rgba(#FFF, .3);
 $theme-header-item-background-color-focus: rgba(#FFF, .3);
 // 顶栏上的项目在 active 时的背景颜色
 $theme-header-item-background-color-active: rgba(#000, .3);
+
 // 侧边栏上的文字颜色
 $theme-aside-text-color: #FFF;
 // 侧边栏上的项目在 hover 时的背景颜色

From 18558aff86b7b7b605f16248b672b7994257e177 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 11:09:48 +0800
Subject: [PATCH 07/33] no message

Former-commit-id: 65d278c7d1c0b6f493783061d1ada57e32ed77ee
Former-commit-id: 107ec52293fae29894fc0c95c7a03c4ad34101d6
Former-commit-id: dbf9ca1372043252b090a8744b4bd090001698c0
---
 src/assets/style/theme/star/index.scss | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/assets/style/theme/star/index.scss b/src/assets/style/theme/star/index.scss
index 5c6cdff7..7afe7760 100644
--- a/src/assets/style/theme/star/index.scss
+++ b/src/assets/style/theme/star/index.scss
@@ -15,20 +15,26 @@ $theme-menu-item-background-color-hover: #187181;
 
 // 顶栏上的文字颜色
 $theme-header-text-color: #FFF;
-// 顶栏上的项目在 hover 时的背景颜色
+// 顶栏上的项目在 hover 时
+$theme-header-item-color-hover: #FFF;
 $theme-header-item-background-color-hover: rgba(#FFF, .3);
-// 顶栏上的项目在 focus 时的背景颜色
+// 顶栏上的项目在 focus 时
+$theme-header-item-color-focus: #FFF;
 $theme-header-item-background-color-focus: rgba(#FFF, .3);
-// 顶栏上的项目在 active 时的背景颜色
+// 顶栏上的项目在 active 时
+$theme-header-item-color-active: #FFF;
 $theme-header-item-background-color-active: rgba(#000, .3);
 
 // 侧边栏上的文字颜色
 $theme-aside-text-color: #FFF;
-// 侧边栏上的项目在 hover 时的背景颜色
+// 侧边栏上的项目在 hover 时
+$theme-aside-item-color-hover: #FFF;
 $theme-aside-item-background-color-hover: rgba(#FFF, .3);
-// 顶栏上的项目在 focus 时的背景颜色
+// 侧边栏上的项目在 focus 时
+$theme-aside-item-color-focus: #FFF;
 $theme-aside-item-background-color-focus: rgba(#FFF, .3);
-// 侧边栏上的项目在 active 时的背景颜色
+// 侧边栏上的项目在 active 时
+$theme-aside-item-color-active: #FFF;
 $theme-aside-item-background-color-active: rgba(#000, .3);
 
 .theme-#{$theme-name} {

From 8503000135be3f6b233f7b9065faab5ddf7c4295 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 11:17:52 +0800
Subject: [PATCH 08/33] no message

Former-commit-id: e590ff6a8c38262d7b96e78bbbb67eb3f0056745
Former-commit-id: 229cf313a34c7317c6054d667ab681984c9ab923
Former-commit-id: 48f7759235eae7708134fa75093f812f90853ee8
---
 src/assets/style/theme/star/index.scss | 43 ++++++++++++++++++--------
 1 file changed, 30 insertions(+), 13 deletions(-)

diff --git a/src/assets/style/theme/star/index.scss b/src/assets/style/theme/star/index.scss
index 7afe7760..908390a4 100644
--- a/src/assets/style/theme/star/index.scss
+++ b/src/assets/style/theme/star/index.scss
@@ -14,7 +14,8 @@ $theme-menu-item-color-hover: #FFF;
 $theme-menu-item-background-color-hover: #187181;
 
 // 顶栏上的文字颜色
-$theme-header-text-color: #FFF;
+$theme-header-item-color: #FFF;
+$theme-header-item-background-color: transparent;
 // 顶栏上的项目在 hover 时
 $theme-header-item-color-hover: #FFF;
 $theme-header-item-background-color-hover: rgba(#FFF, .3);
@@ -26,7 +27,8 @@ $theme-header-item-color-active: #FFF;
 $theme-header-item-background-color-active: rgba(#000, .3);
 
 // 侧边栏上的文字颜色
-$theme-aside-text-color: #FFF;
+$theme-aside-item-color: #FFF;
+$theme-aside-item-background-color: transparent;
 // 侧边栏上的项目在 hover 时
 $theme-aside-item-color-hover: #FFF;
 $theme-aside-item-background-color-hover: rgba(#FFF, .3);
@@ -84,9 +86,10 @@ $theme-aside-item-background-color-active: rgba(#000, .3);
     // 切换按钮
     .toggle-aside-btn {
       i {
-        color: $theme-header-text-color;
+        color: $theme-header-item-color;
+        background-color: $theme-header-item-background-color;
         &:hover {
-          color: $theme-header-text-color;
+          color: $theme-header-item-color-hover;
         }
       }
     }
@@ -94,28 +97,35 @@ $theme-aside-item-background-color-active: rgba(#000, .3);
     .el-menu {
       .el-menu-item {
         transition: border-top-color 0s;
-        color: $theme-header-text-color;
+        color: $theme-header-item-color;
+        background-color: $theme-header-item-background-color;
         &:hover {
+          color: $theme-header-item-color-hover;
           background-color: $theme-header-item-background-color-hover;
         }
         &:focus {
+          color: $theme-header-item-color-focus;
           background-color: $theme-header-item-background-color-focus;
         }
         &.is-active {
+          color: $theme-header-item-color-active;
           background-color: $theme-header-item-background-color-active;
         }
       }
       .el-submenu {
         .el-submenu__title {
           transition: border-top-color 0s;
-          color: $theme-header-text-color;
+          color: $theme-header-item-color;
+          background-color: $theme-header-item-background-color;
           .el-submenu__icon-arrow {
-            color: $theme-header-text-color;
+            color: $theme-header-item-color;
           }
           &:hover {
+            color: $theme-header-item-color-hover;
             background-color: $theme-header-item-background-color-hover;
           }
           &:focus {
+            color: $theme-header-item-color-focus;
             background-color: $theme-header-item-background-color-focus;
           }
         }
@@ -124,9 +134,10 @@ $theme-aside-item-background-color-active: rgba(#000, .3);
     // 顶栏右侧
     .d2-header-right {
       .btn-text {
-        color: $theme-header-text-color;
+        color: $theme-header-item-color;
         &.can-hover {
           &:hover {
+            color: $theme-header-item-color-hover;
             background-color: $theme-header-item-background-color-hover;
           }
         }
@@ -140,31 +151,37 @@ $theme-aside-item-background-color-active: rgba(#000, .3);
       // [菜单] 正常状态
       .el-menu {
         .el-menu-item {
-          color: $theme-aside-text-color;
+          color: $theme-aside-item-color;
+          background-color: $theme-aside-item-background-color;
           i {
-            color: $theme-aside-text-color;
+            color: $theme-aside-item-color;
           }
           &:hover {
+            color: $theme-aside-item-color-hover;
             background-color: $theme-aside-item-background-color-hover;
           }
           &:focus {
+            color: $theme-aside-item-color-focus;
             background-color: $theme-aside-item-background-color-focus;
           }
           &.is-active {
+            color: $theme-aside-item-color-active;
             background-color: $theme-aside-item-background-color-active;
           }
         }
       }
       .el-submenu {
         .el-submenu__title {
-          color: $theme-aside-text-color;
+          color: $theme-aside-item-color;
+          background-color: $theme-aside-item-background-color;
           i {
-            color: $theme-aside-text-color;
+            color: $theme-aside-item-color;
           }
           .el-submenu__icon-arrow {
-            color: $theme-aside-text-color;
+            color: $theme-aside-item-color;
           }
           &:hover {
+            color: $theme-aside-item-color-hover;
             background-color: $theme-aside-item-background-color-hover;
           }
         }

From 250d69a8474b4a68d4b5e776789844a8c3ca87d5 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 11:19:31 +0800
Subject: [PATCH 09/33] no message

Former-commit-id: f1da129af62daafbeecba3a8e8897b3ee21d8228
Former-commit-id: a91ec1952635c29e0ec1bee92c3fafba0abeb597
Former-commit-id: 5893dcefdbe8a770fac54118995009c80e28dfcb
---
 src/assets/style/theme/star/index.scss   | 42 +-----------------------
 src/assets/style/theme/star/setting.scss | 38 +++++++++++++++++++++
 src/assets/style/theme/theme.scss        |  2 ++
 3 files changed, 41 insertions(+), 41 deletions(-)
 create mode 100644 src/assets/style/theme/star/setting.scss

diff --git a/src/assets/style/theme/star/index.scss b/src/assets/style/theme/star/index.scss
index 908390a4..d5123ab4 100644
--- a/src/assets/style/theme/star/index.scss
+++ b/src/assets/style/theme/star/index.scss
@@ -1,51 +1,11 @@
 @import '../theme.scss';
-
-// 主题名称
-$theme-name: 'star';
-// 主题背景颜色
-$theme-bg-color: #EFF4F8;
-// 主题背景图片
-$theme-bg-image: '/static/image/bg/star.jpg';
-// container组件的边框
-$theme-container-border: 1px solid #d8dfea;
-
-// 顶栏和侧边栏中展开的菜单 hover 状态下
-$theme-menu-item-color-hover: #FFF;
-$theme-menu-item-background-color-hover: #187181;
-
-// 顶栏上的文字颜色
-$theme-header-item-color: #FFF;
-$theme-header-item-background-color: transparent;
-// 顶栏上的项目在 hover 时
-$theme-header-item-color-hover: #FFF;
-$theme-header-item-background-color-hover: rgba(#FFF, .3);
-// 顶栏上的项目在 focus 时
-$theme-header-item-color-focus: #FFF;
-$theme-header-item-background-color-focus: rgba(#FFF, .3);
-// 顶栏上的项目在 active 时
-$theme-header-item-color-active: #FFF;
-$theme-header-item-background-color-active: rgba(#000, .3);
-
-// 侧边栏上的文字颜色
-$theme-aside-item-color: #FFF;
-$theme-aside-item-background-color: transparent;
-// 侧边栏上的项目在 hover 时
-$theme-aside-item-color-hover: #FFF;
-$theme-aside-item-background-color-hover: rgba(#FFF, .3);
-// 侧边栏上的项目在 focus 时
-$theme-aside-item-color-focus: #FFF;
-$theme-aside-item-background-color-focus: rgba(#FFF, .3);
-// 侧边栏上的项目在 active 时
-$theme-aside-item-color-active: #FFF;
-$theme-aside-item-background-color-active: rgba(#000, .3);
+@import './setting.scss';
 
 .theme-#{$theme-name} {
 
   .layout-main {
     background-color: $theme-bg-color;
     background-image: url($theme-bg-image);
-    background-size: cover;
-    background-position: center;
   }
   // 菜单项目
   @mixin theme-menu-hover-style {
diff --git a/src/assets/style/theme/star/setting.scss b/src/assets/style/theme/star/setting.scss
new file mode 100644
index 00000000..f1db18f7
--- /dev/null
+++ b/src/assets/style/theme/star/setting.scss
@@ -0,0 +1,38 @@
+// 主题名称
+$theme-name: 'star';
+// 主题背景颜色
+$theme-bg-color: #EFF4F8;
+// 主题背景图片
+$theme-bg-image: '/static/image/bg/star.jpg';
+// container组件的边框
+$theme-container-border: 1px solid #d8dfea;
+
+// 顶栏和侧边栏中展开的菜单 hover 状态下
+$theme-menu-item-color-hover: #FFF;
+$theme-menu-item-background-color-hover: #187181;
+
+// 顶栏上的文字颜色
+$theme-header-item-color: #FFF;
+$theme-header-item-background-color: transparent;
+// 顶栏上的项目在 hover 时
+$theme-header-item-color-hover: #FFF;
+$theme-header-item-background-color-hover: rgba(#FFF, .3);
+// 顶栏上的项目在 focus 时
+$theme-header-item-color-focus: #FFF;
+$theme-header-item-background-color-focus: rgba(#FFF, .3);
+// 顶栏上的项目在 active 时
+$theme-header-item-color-active: #FFF;
+$theme-header-item-background-color-active: rgba(#000, .3);
+
+// 侧边栏上的文字颜色
+$theme-aside-item-color: #FFF;
+$theme-aside-item-background-color: transparent;
+// 侧边栏上的项目在 hover 时
+$theme-aside-item-color-hover: #FFF;
+$theme-aside-item-background-color-hover: rgba(#FFF, .3);
+// 侧边栏上的项目在 focus 时
+$theme-aside-item-color-focus: #FFF;
+$theme-aside-item-background-color-focus: rgba(#FFF, .3);
+// 侧边栏上的项目在 active 时
+$theme-aside-item-color-active: #FFF;
+$theme-aside-item-background-color-active: rgba(#000, .3);
\ No newline at end of file
diff --git a/src/assets/style/theme/theme.scss b/src/assets/style/theme/theme.scss
index 7d46d1aa..70187876 100644
--- a/src/assets/style/theme/theme.scss
+++ b/src/assets/style/theme/theme.scss
@@ -4,6 +4,8 @@
 .layout-main {
   height: 100vh;
   width: 100vw;
+  background-size: cover;
+  background-position: center;
   // [布局] 顶栏
   .el-header {
     padding: 0px;

From 382742923984168b4a19fc69c39823dca42fdb09 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 11:22:46 +0800
Subject: [PATCH 10/33] no message

Former-commit-id: 5ee0854099dfbe9420eaccb99ae1f82e27634ca8
Former-commit-id: f0db2599de59245b20ac1db6b47ad27540c0be8b
Former-commit-id: 64fce4b976107e4dd7c268d49f339020a59cfe2b
---
 src/assets/style/theme/star/setting.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/assets/style/theme/star/setting.scss b/src/assets/style/theme/star/setting.scss
index f1db18f7..b0e71523 100644
--- a/src/assets/style/theme/star/setting.scss
+++ b/src/assets/style/theme/star/setting.scss
@@ -8,8 +8,8 @@ $theme-bg-image: '/static/image/bg/star.jpg';
 $theme-container-border: 1px solid #d8dfea;
 
 // 顶栏和侧边栏中展开的菜单 hover 状态下
-$theme-menu-item-color-hover: #FFF;
-$theme-menu-item-background-color-hover: #187181;
+$theme-menu-item-color-hover: #293849;
+$theme-menu-item-background-color-hover: #ecf5ff;
 
 // 顶栏上的文字颜色
 $theme-header-item-color: #FFF;

From f5ac995b579c83e936b94d499f4d0a4c19b16082 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 11:25:29 +0800
Subject: [PATCH 11/33] no message

Former-commit-id: 7b936ad4ae72eeb7d18d367293b7d8d5133daffb
Former-commit-id: 699e6eff6c1806270d93ad5fe88557ee7bee863b
Former-commit-id: 7c7cff6cd5bfaf744574bc5a4b1ef6bbd851b6d1
---
 src/assets/style/theme/star/setting.scss | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/assets/style/theme/star/setting.scss b/src/assets/style/theme/star/setting.scss
index b0e71523..11c9cb77 100644
--- a/src/assets/style/theme/star/setting.scss
+++ b/src/assets/style/theme/star/setting.scss
@@ -16,10 +16,10 @@ $theme-header-item-color: #FFF;
 $theme-header-item-background-color: transparent;
 // 顶栏上的项目在 hover 时
 $theme-header-item-color-hover: #FFF;
-$theme-header-item-background-color-hover: rgba(#FFF, .3);
+$theme-header-item-background-color-hover: rgba(#000, .2);
 // 顶栏上的项目在 focus 时
 $theme-header-item-color-focus: #FFF;
-$theme-header-item-background-color-focus: rgba(#FFF, .3);
+$theme-header-item-background-color-focus: rgba(#000, .2);
 // 顶栏上的项目在 active 时
 $theme-header-item-color-active: #FFF;
 $theme-header-item-background-color-active: rgba(#000, .3);
@@ -29,10 +29,10 @@ $theme-aside-item-color: #FFF;
 $theme-aside-item-background-color: transparent;
 // 侧边栏上的项目在 hover 时
 $theme-aside-item-color-hover: #FFF;
-$theme-aside-item-background-color-hover: rgba(#FFF, .3);
+$theme-aside-item-background-color-hover: rgba(#000, .2);
 // 侧边栏上的项目在 focus 时
 $theme-aside-item-color-focus: #FFF;
-$theme-aside-item-background-color-focus: rgba(#FFF, .3);
+$theme-aside-item-background-color-focus: rgba(#000, .2);
 // 侧边栏上的项目在 active 时
 $theme-aside-item-color-active: #FFF;
 $theme-aside-item-background-color-active: rgba(#000, .3);
\ No newline at end of file

From 9ce24ca9524ad5493b656672b97144996d9fc9e0 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 13:09:26 +0800
Subject: [PATCH 12/33] no message

Former-commit-id: 8e07c726f606fb02cba49502d42eb3e07ad505b7
Former-commit-id: 094f11e1326eaa23eb983100e119691e0dadb2b1
Former-commit-id: 6e430d5aee9cdaaa5c77b49861d95c826f51cc5f

From 425bfaf14d93eaac2ceca58eb42c530bcad73120 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 13:29:06 +0800
Subject: [PATCH 13/33] no message

Former-commit-id: 8e98a0b4b2edb656220d9af244c018c7378eee8e
Former-commit-id: 2b5a9bbde5dcc2789167635fb047ac5456d2905c
Former-commit-id: 5a85965e717c200bfde3d06551413035018579d7
---
 .../style/theme/{d2admin => d2}/index.scss    | 75 +++++++------------
 src/assets/style/theme/d2/setting.scss        | 38 ++++++++++
 .../-header-right/components/-theme.vue       | 14 ++++
 src/components/core/d2-layout-main/index.vue  |  5 +-
 src/store/modules/theme.js                    |  1 +
 5 files changed, 83 insertions(+), 50 deletions(-)
 rename src/assets/style/theme/{d2admin => d2}/index.scss (60%)
 create mode 100644 src/assets/style/theme/d2/setting.scss

diff --git a/src/assets/style/theme/d2admin/index.scss b/src/assets/style/theme/d2/index.scss
similarity index 60%
rename from src/assets/style/theme/d2admin/index.scss
rename to src/assets/style/theme/d2/index.scss
index 940e082e..07a192d7 100644
--- a/src/assets/style/theme/d2admin/index.scss
+++ b/src/assets/style/theme/d2/index.scss
@@ -1,44 +1,10 @@
 @import '../theme.scss';
-
-// 主题名称
-$theme-name: 'd2admin';
-// 主题背景颜色
-$theme-bg-color: #EFF4F8;
-// 主题背景图片
-// $theme-bg-image: '/static/image/bg/star.jpg';
-// container组件的边框
-$theme-container-border: 1px solid #d8dfea;
-
-// 顶栏和侧边栏中展开的菜单 hover 状态下的文字和图标颜色
-$theme-menu-item-color-hover: #293849;
-// 顶栏和侧边栏中展开的菜单 hover 状态下的背景颜色
-$theme-menu-item-background-color-hover: #F4F6F8;
-
-// 顶栏上的文字颜色
-$theme-header-text-color: #30312D;
-// 顶栏上的项目在 hover 时的背景颜色
-$theme-header-item-background-color-hover: rgba(#000, .03);
-// 顶栏上的项目在 focus 时的背景颜色
-$theme-header-item-background-color-focus: rgba(#000, .03);
-// 顶栏上的项目在 active 时的背景颜色
-$theme-header-item-background-color-active: rgba(#000, .05);
-
-// 侧边栏上的文字颜色
-$theme-aside-text-color: #30312D;
-// 侧边栏上的项目在 hover 时的背景颜色
-$theme-aside-item-background-color-hover: rgba(#000, .03);
-// 顶栏上的项目在 focus 时的背景颜色
-$theme-aside-item-background-color-focus: rgba(#000, .03);
-// 侧边栏上的项目在 active 时的背景颜色
-$theme-aside-item-background-color-active: rgba(#000, .05);
+@import './setting.scss';
 
 .theme-#{$theme-name} {
 
   .layout-main {
     background-color: $theme-bg-color;
-    // background-image: url($theme-bg-image);
-    background-size: cover;
-    background-position: center;
   }
   // 菜单项目
   @mixin theme-menu-hover-style {
@@ -63,6 +29,8 @@ $theme-aside-item-background-color-active: rgba(#000, .05);
 
   // [组件] d2-container-full
   .d2-container-full {
+    border: $theme-container-border;
+    border-bottom: none;
     .d2-container-full__header {
       border-bottom: $theme-container-border;
     }
@@ -79,9 +47,10 @@ $theme-aside-item-background-color-active: rgba(#000, .05);
     // 切换按钮
     .toggle-aside-btn {
       i {
-        color: $theme-header-text-color;
+        color: $theme-header-item-color;
+        background-color: $theme-header-item-background-color;
         &:hover {
-          color: $theme-header-text-color;
+          color: $theme-header-item-color-hover;
         }
       }
     }
@@ -89,28 +58,35 @@ $theme-aside-item-background-color-active: rgba(#000, .05);
     .el-menu {
       .el-menu-item {
         transition: border-top-color 0s;
-        color: $theme-header-text-color;
+        color: $theme-header-item-color;
+        background-color: $theme-header-item-background-color;
         &:hover {
+          color: $theme-header-item-color-hover;
           background-color: $theme-header-item-background-color-hover;
         }
         &:focus {
+          color: $theme-header-item-color-focus;
           background-color: $theme-header-item-background-color-focus;
         }
         &.is-active {
+          color: $theme-header-item-color-active;
           background-color: $theme-header-item-background-color-active;
         }
       }
       .el-submenu {
         .el-submenu__title {
           transition: border-top-color 0s;
-          color: $theme-header-text-color;
+          color: $theme-header-item-color;
+          background-color: $theme-header-item-background-color;
           .el-submenu__icon-arrow {
-            color: $theme-header-text-color;
+            color: $theme-header-item-color;
           }
           &:hover {
+            color: $theme-header-item-color-hover;
             background-color: $theme-header-item-background-color-hover;
           }
           &:focus {
+            color: $theme-header-item-color-focus;
             background-color: $theme-header-item-background-color-focus;
           }
         }
@@ -119,9 +95,10 @@ $theme-aside-item-background-color-active: rgba(#000, .05);
     // 顶栏右侧
     .d2-header-right {
       .btn-text {
-        color: $theme-header-text-color;
+        color: $theme-header-item-color;
         &.can-hover {
           &:hover {
+            color: $theme-header-item-color-hover;
             background-color: $theme-header-item-background-color-hover;
           }
         }
@@ -135,31 +112,37 @@ $theme-aside-item-background-color-active: rgba(#000, .05);
       // [菜单] 正常状态
       .el-menu {
         .el-menu-item {
-          color: $theme-aside-text-color;
+          color: $theme-aside-item-color;
+          background-color: $theme-aside-item-background-color;
           i {
-            color: $theme-aside-text-color;
+            color: $theme-aside-item-color;
           }
           &:hover {
+            color: $theme-aside-item-color-hover;
             background-color: $theme-aside-item-background-color-hover;
           }
           &:focus {
+            color: $theme-aside-item-color-focus;
             background-color: $theme-aside-item-background-color-focus;
           }
           &.is-active {
+            color: $theme-aside-item-color-active;
             background-color: $theme-aside-item-background-color-active;
           }
         }
       }
       .el-submenu {
         .el-submenu__title {
-          color: $theme-aside-text-color;
+          color: $theme-aside-item-color;
+          background-color: $theme-aside-item-background-color;
           i {
-            color: $theme-aside-text-color;
+            color: $theme-aside-item-color;
           }
           .el-submenu__icon-arrow {
-            color: $theme-aside-text-color;
+            color: $theme-aside-item-color;
           }
           &:hover {
+            color: $theme-aside-item-color-hover;
             background-color: $theme-aside-item-background-color-hover;
           }
         }
diff --git a/src/assets/style/theme/d2/setting.scss b/src/assets/style/theme/d2/setting.scss
new file mode 100644
index 00000000..a5d64528
--- /dev/null
+++ b/src/assets/style/theme/d2/setting.scss
@@ -0,0 +1,38 @@
+// 主题名称
+$theme-name: 'd2';
+// 主题背景颜色
+$theme-bg-color: $color-bg;
+// 主题背景图片
+// $theme-bg-image: '/static/image/bg/star.jpg';
+// container组件的边框
+$theme-container-border: 1px solid $color-border-1;
+
+// 顶栏和侧边栏中展开的菜单 hover 状态下
+$theme-menu-item-color-hover: #293849;
+$theme-menu-item-background-color-hover: #ecf5ff;
+
+// 顶栏上的文字颜色
+$theme-header-item-color: $color-text-normal;
+$theme-header-item-background-color: transparent;
+// 顶栏上的项目在 hover 时
+$theme-header-item-color-hover: $color-text-main;
+$theme-header-item-background-color-hover: rgba(#000, .02);
+// 顶栏上的项目在 focus 时
+$theme-header-item-color-focus: $color-text-main;
+$theme-header-item-background-color-focus: rgba(#000, .02);
+// 顶栏上的项目在 active 时
+$theme-header-item-color-active: $color-text-main;
+$theme-header-item-background-color-active: rgba(#000, .03);
+
+// 侧边栏上的文字颜色
+$theme-aside-item-color: $color-text-normal;
+$theme-aside-item-background-color: transparent;
+// 侧边栏上的项目在 hover 时
+$theme-aside-item-color-hover: $color-text-main;
+$theme-aside-item-background-color-hover: rgba(#000, .02);
+// 侧边栏上的项目在 focus 时
+$theme-aside-item-color-focus: $color-text-main;
+$theme-aside-item-background-color-focus: rgba(#000, .02);
+// 侧边栏上的项目在 active 时
+$theme-aside-item-color-active: $color-text-main;
+$theme-aside-item-background-color-active: rgba(#000, .03);
\ No newline at end of file
diff --git a/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue b/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
index fb5e9ec7..5d479958 100644
--- a/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
+++ b/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
@@ -22,6 +22,7 @@
 </template>
 
 <script>
+import { mapState, mapMutations } from 'vuex'
 export default {
   data () {
     return {
@@ -41,6 +42,19 @@ export default {
         border: true
       }
     }
+  },
+  computed: {
+    ...mapState({
+      themeName: state => state.theme.themeName
+    })
+  },
+  methods: {
+    ...mapMutations([
+      'setTheme'
+    ])
+  },
+  mounted () {
+    this.setTheme('d2')
   }
 }
 </script>
diff --git a/src/components/core/d2-layout-main/index.vue b/src/components/core/d2-layout-main/index.vue
index 7094e98c..94fd5a8f 100644
--- a/src/components/core/d2-layout-main/index.vue
+++ b/src/components/core/d2-layout-main/index.vue
@@ -44,15 +44,12 @@ export default {
       // [侧边栏宽度] 折叠状态
       asideWidthCollapse: '65px'
     }
-  },
-  mounted () {
-    document.body.className = 'theme-star'
   }
 }
 </script>
 
 <style lang="scss">
 // 主题
-@import '~@/assets/style/theme/d2admin/index.scss';
+@import '~@/assets/style/theme/d2/index.scss';
 @import '~@/assets/style/theme/star/index.scss';
 </style>
diff --git a/src/store/modules/theme.js b/src/store/modules/theme.js
index 7da93b18..5cead18b 100644
--- a/src/store/modules/theme.js
+++ b/src/store/modules/theme.js
@@ -6,6 +6,7 @@ export default {
     // 设置主题
     setTheme (state, themeName) {
       state.themeName = themeName
+      document.body.className = `theme-${state.themeName}`
     }
   }
 }

From 4ad0fa7eb3e92dfff8c45b2164187997d2173e42 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 13:30:20 +0800
Subject: [PATCH 14/33] no message

Former-commit-id: c52db2727e2fee5ed9befa64e95394fa0422854f
Former-commit-id: c04156b0bc4d9f31b33672d9c248d111ed4be636
Former-commit-id: 21029e8cb6251ebbe358d579165b4c365abfd479
---
 src/assets/style/theme/d2/index.scss   | 1 +
 src/assets/style/theme/d2/setting.scss | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/assets/style/theme/d2/index.scss b/src/assets/style/theme/d2/index.scss
index 07a192d7..cb2c0265 100644
--- a/src/assets/style/theme/d2/index.scss
+++ b/src/assets/style/theme/d2/index.scss
@@ -5,6 +5,7 @@
 
   .layout-main {
     background-color: $theme-bg-color;
+    // background-image: url($theme-bg-image);
   }
   // 菜单项目
   @mixin theme-menu-hover-style {
diff --git a/src/assets/style/theme/d2/setting.scss b/src/assets/style/theme/d2/setting.scss
index a5d64528..e9ce12b8 100644
--- a/src/assets/style/theme/d2/setting.scss
+++ b/src/assets/style/theme/d2/setting.scss
@@ -3,7 +3,7 @@ $theme-name: 'd2';
 // 主题背景颜色
 $theme-bg-color: $color-bg;
 // 主题背景图片
-// $theme-bg-image: '/static/image/bg/star.jpg';
+// $theme-bg-image: '/static/image/bg/xxx.jpg';
 // container组件的边框
 $theme-container-border: 1px solid $color-border-1;
 

From 1d675605963f9e5be82489eeddce8e1d4bae78ae Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 13:47:48 +0800
Subject: [PATCH 15/33] no message

Former-commit-id: b5a2e324ecbb5b07f0d9271fad79ffc349d7f802
Former-commit-id: 0bf7da6578411c0a3503cba0d08e349d675bca18
Former-commit-id: f7401e8a82bba4d3f3b678c46c18320bfa7ac427
---
 .../-header-right/components/-theme.vue       | 55 +--------------
 src/components/core/d2-theme-list/index.vue   | 67 +++++++++++++++++++
 src/components/core/register.js               |  3 +-
 ...EMOVED.git-id => d2@2x.png.REMOVED.git-id} |  0
 4 files changed, 72 insertions(+), 53 deletions(-)
 create mode 100644 src/components/core/d2-theme-list/index.vue
 rename static/image/theme-preview/{d2admin@2x.png.REMOVED.git-id => d2@2x.png.REMOVED.git-id} (100%)

diff --git a/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue b/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
index 5d479958..f01b7671 100644
--- a/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
+++ b/src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
@@ -5,67 +5,18 @@
         <d2-icon name="diamond"/>
       </el-button>
     </el-tooltip>
-    <el-dialog title="主题" width="500px" :visible.sync="dialogVisible">
-      <el-table v-bind="table">
-        <el-table-column prop="name" align="center" width="100"/>
-        <el-table-column label="预览" width="220">
-          <div slot-scope="scope" class="theme-preview" :style="{'backgroundImage': `url(${ scope.row.preview })`}"></div>
-        </el-table-column>
-        <el-table-column prop="address" align="center">
-          <template slot-scope="scope">
-            <el-button type="primary">使用</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
+    <el-dialog title="主题" width="600px" :visible.sync="dialogVisible">
+      <d2-theme-list/>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { mapState, mapMutations } from 'vuex'
 export default {
   data () {
     return {
-      dialogVisible: false,
-      table: {
-        data: [
-          {
-            name: 'd2admin',
-            preview: '/static/image/theme-preview/d2admin@2x.png'
-          },
-          {
-            name: 'star',
-            preview: '/static/image/theme-preview/star@2x.png'
-          }
-        ],
-        showHeader: false,
-        border: true
-      }
+      dialogVisible: false
     }
-  },
-  computed: {
-    ...mapState({
-      themeName: state => state.theme.themeName
-    })
-  },
-  methods: {
-    ...mapMutations([
-      'setTheme'
-    ])
-  },
-  mounted () {
-    this.setTheme('d2')
   }
 }
 </script>
-
-<style lang="scss" scoped>
-@import '~@/assets/style/public.scss';
-.theme-preview {
-  height: 100px;
-  width: 200px;
-  border-radius: 4px;
-  background-size: cover;
-  border: 1px solid $color-border-1;
-}
-</style>
diff --git a/src/components/core/d2-theme-list/index.vue b/src/components/core/d2-theme-list/index.vue
new file mode 100644
index 00000000..5407e72f
--- /dev/null
+++ b/src/components/core/d2-theme-list/index.vue
@@ -0,0 +1,67 @@
+<template>
+  <el-table v-bind="table">
+    <el-table-column prop="name" align="center" width="160"/>
+    <el-table-column label="预览" width="220">
+      <div slot-scope="scope" class="theme-preview" :style="{'backgroundImage': `url(${ scope.row.preview })`}"></div>
+    </el-table-column>
+    <el-table-column prop="address" align="center">
+      <template slot-scope="scope">
+        <el-button type="primary" @click="handleSelectTheme(scope.row.value)">使用</el-button>
+      </template>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+export default {
+  name: 'd2-theme-list',
+  data () {
+    return {
+      table: {
+        data: [
+          {
+            name: 'd2admin 经典',
+            value: 'd2',
+            preview: '/static/image/theme-preview/d2@2x.png'
+          },
+          {
+            name: '流星',
+            value: 'star',
+            preview: '/static/image/theme-preview/star@2x.png'
+          }
+        ],
+        showHeader: false,
+        border: true
+      }
+    }
+  },
+  mounted () {
+    this.setTheme('d2')
+  },
+  computed: {
+    ...mapState({
+      themeName: state => state.theme.themeName
+    })
+  },
+  methods: {
+    ...mapMutations([
+      'setTheme'
+    ]),
+    handleSelectTheme (themeName) {
+      this.setTheme(themeName)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '~@/assets/style/public.scss';
+.theme-preview {
+  height: 100px;
+  width: 200px;
+  border-radius: 4px;
+  background-size: cover;
+  border: 1px solid $color-border-1;
+}
+</style>
diff --git a/src/components/core/register.js b/src/components/core/register.js
index b3f19794..d5c9854b 100644
--- a/src/components/core/register.js
+++ b/src/components/core/register.js
@@ -14,5 +14,6 @@ Vue.component('d2-icon', () => import('@/components/core/d2-icon'))
 Vue.component('d2-icon-select', () => import('@/components/core/d2-icon-select/index.vue'))
 Vue.component('d2-icon-svg', () => import('@/components/core/d2-icon-svg/index.vue'))
 Vue.component('d2-markdown', () => import('@/components/core/d2-markdown'))
-Vue.component('d2-quill', () => import('@/components/core/d2-quill'))
 Vue.component('d2-mde', () => import('@/components/core/d2-mde'))
+Vue.component('d2-quill', () => import('@/components/core/d2-quill'))
+Vue.component('d2-theme-list', () => import('@/components/core/d2-theme-list'))
diff --git a/static/image/theme-preview/d2admin@2x.png.REMOVED.git-id b/static/image/theme-preview/d2@2x.png.REMOVED.git-id
similarity index 100%
rename from static/image/theme-preview/d2admin@2x.png.REMOVED.git-id
rename to static/image/theme-preview/d2@2x.png.REMOVED.git-id

From fa0a1ac5cb3e39219d7c172b81db7519aa4a1652 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 13:53:48 +0800
Subject: [PATCH 16/33] no message

Former-commit-id: d034f2b55040b82f43f4b3149cad9cfd235e407c
Former-commit-id: a38ce483556a25b80fef13acf080f97e8b2d6540
Former-commit-id: d8ffe7f8f5925f50b59c3bcd5e35c5a3e10271af
---
 src/components/core/d2-theme-list/index.vue | 17 +++--------------
 src/store/modules/theme.js                  | 20 ++++++++++++++++----
 2 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/src/components/core/d2-theme-list/index.vue b/src/components/core/d2-theme-list/index.vue
index 5407e72f..5e79ec70 100644
--- a/src/components/core/d2-theme-list/index.vue
+++ b/src/components/core/d2-theme-list/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-table v-bind="table">
+  <el-table :data="themeList" v-bind="table">
     <el-table-column prop="name" align="center" width="160"/>
     <el-table-column label="预览" width="220">
       <div slot-scope="scope" class="theme-preview" :style="{'backgroundImage': `url(${ scope.row.preview })`}"></div>
@@ -19,18 +19,6 @@ export default {
   data () {
     return {
       table: {
-        data: [
-          {
-            name: 'd2admin 经典',
-            value: 'd2',
-            preview: '/static/image/theme-preview/d2@2x.png'
-          },
-          {
-            name: '流星',
-            value: 'star',
-            preview: '/static/image/theme-preview/star@2x.png'
-          }
-        ],
         showHeader: false,
         border: true
       }
@@ -41,7 +29,8 @@ export default {
   },
   computed: {
     ...mapState({
-      themeName: state => state.theme.themeName
+      themeList: state => state.theme.list,
+      themeName: state => state.theme.name
     })
   },
   methods: {
diff --git a/src/store/modules/theme.js b/src/store/modules/theme.js
index 5cead18b..6fc16a7a 100644
--- a/src/store/modules/theme.js
+++ b/src/store/modules/theme.js
@@ -1,12 +1,24 @@
 export default {
   state: {
-    themeName: 'star'
+    list: [
+      {
+        name: 'd2admin 经典',
+        value: 'd2',
+        preview: '/static/image/theme-preview/d2@2x.png'
+      },
+      {
+        name: '流星',
+        value: 'star',
+        preview: '/static/image/theme-preview/star@2x.png'
+      }
+    ],
+    name: 'star'
   },
   mutations: {
     // 设置主题
-    setTheme (state, themeName) {
-      state.themeName = themeName
-      document.body.className = `theme-${state.themeName}`
+    setTheme (state, name) {
+      state.name = name
+      document.body.className = `theme-${state.name}`
     }
   }
 }

From 5d3025f33c4627d2f753954fb44d5e19b89166d2 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:11:47 +0800
Subject: [PATCH 17/33] no message

Former-commit-id: c4ead3ff0d34e4cd84554e16c180b993e98fe565
Former-commit-id: 93899322af2dee317860cca8fa1d3dc0224894d4
Former-commit-id: e47a2fc2262b8172ab50d8686a3862c9b2cbd7bd
---
 src/components/core/d2-container/index.vue  |  2 +-
 src/pages/demo/components/countup/index.vue | 21 ++++++----------
 src/pages/demo/plugins/js-cookie/index.vue  | 26 +++++++++----------
 src/pages/demo/plugins/mock/ajax.vue        | 28 ++++++++++-----------
 4 files changed, 34 insertions(+), 43 deletions(-)

diff --git a/src/components/core/d2-container/index.vue b/src/components/core/d2-container/index.vue
index 55a7e549..84d2eb84 100644
--- a/src/components/core/d2-container/index.vue
+++ b/src/components/core/d2-container/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container-component" :class="{responsive}">
     <!-- [card] 卡片容器 -->
-    <el-card v-if="type === 'card'" class="d2-container-card d2-mr d2-mb">
+    <el-card v-if="type === 'card'" shadow="never" class="d2-container-card d2-mr d2-mb">
       <slot v-if="$slots.header" name="header" slot="header"/>
       <slot/>
     </el-card>
diff --git a/src/pages/demo/components/countup/index.vue b/src/pages/demo/components/countup/index.vue
index ef6a6f8b..cd6700f7 100644
--- a/src/pages/demo/components/countup/index.vue
+++ b/src/pages/demo/components/countup/index.vue
@@ -1,11 +1,9 @@
 <template>
-  <d2-container type="ghost" class="page">
-    <el-card>
-      <d2-demo-page-header title="数字动画组件"/>
-    </el-card>
+  <d2-container class="page">
+    <template slot="header">数字动画组件</template>
     <el-row :gutter="20">
       <el-col :span="6">
-        <el-card>
+        <el-card shadow="never">
           <p slot="title">只设置目标数字</p>
           <div class="group">
             <d2-count-up :end="100"/>  
@@ -13,7 +11,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card>
+        <el-card shadow="never">
           <p slot="title">设置起止数值</p>
           <div class="group">
             <d2-count-up :start="14" :end="100"/>
@@ -21,7 +19,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card>
+        <el-card shadow="never">
           <p slot="title">小数位数</p>
           <div class="group">
             <d2-count-up :end="100" :decimals="2"/>
@@ -29,7 +27,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card>
+        <el-card shadow="never">
           <p slot="title">动画时长</p>
           <div class="group">
             <d2-count-up :end="100" :duration="6"/>
@@ -37,7 +35,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card>
+        <el-card shadow="never">
           <p slot="title">回调函数</p>
           <div class="group">
             <d2-count-up :end="100" :callback="() => {className = 'end'}" :class="className"/>
@@ -45,7 +43,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card>
+        <el-card shadow="never">
           <p slot="title">结束一秒后更新数值</p>
           <div class="group">
             <d2-count-up :end="end" :callback="update"/>
@@ -53,9 +51,6 @@
         </el-card>
       </el-col>
     </el-row>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 数字动画.md"/>
-    </el-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/plugins/js-cookie/index.vue b/src/pages/demo/plugins/js-cookie/index.vue
index 840f969d..e6fe6748 100644
--- a/src/pages/demo/plugins/js-cookie/index.vue
+++ b/src/pages/demo/plugins/js-cookie/index.vue
@@ -1,18 +1,16 @@
 <template>
-  <d2-container type="ghost">
-    <el-card class="d2-mb">
-      <d2-demo-page-header slot="header" title="基本示例"/>
-      <p class="d2-mt-0">基本读写删</p>
-      <el-button type="primary" @click="set('test-user-name', 'test-user')">set('test-user-name', 'normalValue')</el-button>
-      <el-button type="info" @click="get('test-user-name')">get('test-user-name')</el-button>
-      <el-button type="error" @click="remove('test-user-name')">remove('test-user-name')</el-button>
-      <p>设置有效期</p>
-      <el-button type="primary" @click="setExpires('test-user-pwd', '123456789', 1)">设置 'test-user-pwd' 有效期为一天</el-button>
-      <el-button type="info" @click="get('test-user-pwd')">get('test-user-pwd')</el-button>
-      <el-button type="error" @click="remove('test-user-pwd')">remove('test-user-pwd')</el-button>
-      <p>获取所有可以获得的数据</p>
-      <el-button type="info" @click="getAll">getAll</el-button>
-    </el-card>
+  <d2-container type="card">
+    <d2-demo-page-header slot="header" title="基本示例"/>
+    <p class="d2-mt-0">基本读写删</p>
+    <el-button type="primary" @click="set('test-user-name', 'test-user')">set('test-user-name', 'normalValue')</el-button>
+    <el-button type="info" @click="get('test-user-name')">get('test-user-name')</el-button>
+    <el-button type="error" @click="remove('test-user-name')">remove('test-user-name')</el-button>
+    <p>设置有效期</p>
+    <el-button type="primary" @click="setExpires('test-user-pwd', '123456789', 1)">设置 'test-user-pwd' 有效期为一天</el-button>
+    <el-button type="info" @click="get('test-user-pwd')">get('test-user-pwd')</el-button>
+    <el-button type="error" @click="remove('test-user-pwd')">remove('test-user-pwd')</el-button>
+    <p>获取所有可以获得的数据</p>
+    <el-button type="info" @click="getAll">getAll</el-button>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/plugins/mock/ajax.vue b/src/pages/demo/plugins/mock/ajax.vue
index c1837864..49b2c61a 100644
--- a/src/pages/demo/plugins/mock/ajax.vue
+++ b/src/pages/demo/plugins/mock/ajax.vue
@@ -1,19 +1,17 @@
 <template>
-  <d2-container type="ghost">
-    <el-card>
-      <div slot="header">
-        <el-button @click="ajax">发送请求</el-button>
-      </div>
-      <el-table v-bind="table" style="width: 100%" class="d2-mb">
-        <el-table-column
-          v-for="(item, index) in table.columns"
-          :key="index"
-          :prop="item.prop"
-          :label="item.label">
-        </el-table-column>
-      </el-table>
-      <d2-markdown url="/static/md/插件 - mock拦截ajax.md"/>
-    </el-card>
+  <d2-container type="card">
+    <div slot="header">
+      <el-button @click="ajax">发送请求</el-button>
+    </div>
+    <el-table v-bind="table" style="width: 100%" class="d2-mb">
+      <el-table-column
+        v-for="(item, index) in table.columns"
+        :key="index"
+        :prop="item.prop"
+        :label="item.label">
+      </el-table-column>
+    </el-table>
+    <d2-markdown url="/static/md/插件 - mock拦截ajax.md"/>
   </d2-container>
 </template>
 

From 34550b3d977e437a7488211dac9a7e1bab88258c Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:17:10 +0800
Subject: [PATCH 18/33] no message

Former-commit-id: 67bf1e9eb67b9613532937acd94cf05f916679ce
Former-commit-id: 06c6693074cc8ac2ab6a100551158edc548c0986
Former-commit-id: 53dc73a1dfa44c88fcfa797d1f95411499c05c3c
---
 src/assets/style/fixed/element.scss | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/assets/style/fixed/element.scss b/src/assets/style/fixed/element.scss
index be34caca..ce0144a0 100644
--- a/src/assets/style/fixed/element.scss
+++ b/src/assets/style/fixed/element.scss
@@ -1,10 +1,13 @@
 // element 样式补丁
 
 .el-card {
-  box-shadow: none;
-  &:hover {
-    // box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
-    box-shadow: none;
+  &.is-always-shadow {
+    box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
+  }
+  &.is-hover-shadow {
+    &:hover {
+      box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
+    }
   }
 }
 

From af39d3d92e6371b11c9c4cbf1ee348b80fa17a26 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:23:56 +0800
Subject: [PATCH 19/33] no message

Former-commit-id: 8fc0f93a63ebb4cfe4cb5b3c7a39c58d72a662b9
Former-commit-id: 0531d50d1568d58cfac2e9de8e87cc12dff49aaf
Former-commit-id: bdcecd7e905a98861d3c1de933d5d549ba220a0b
---
 src/pages/demo/components/countup/index.vue | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/pages/demo/components/countup/index.vue b/src/pages/demo/components/countup/index.vue
index cd6700f7..e5e59243 100644
--- a/src/pages/demo/components/countup/index.vue
+++ b/src/pages/demo/components/countup/index.vue
@@ -3,7 +3,7 @@
     <template slot="header">数字动画组件</template>
     <el-row :gutter="20">
       <el-col :span="6">
-        <el-card shadow="never">
+        <el-card shadow="never" class="d2-mb">
           <p slot="title">只设置目标数字</p>
           <div class="group">
             <d2-count-up :end="100"/>  
@@ -11,7 +11,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card shadow="never">
+        <el-card shadow="never" class="d2-mb">
           <p slot="title">设置起止数值</p>
           <div class="group">
             <d2-count-up :start="14" :end="100"/>
@@ -19,7 +19,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card shadow="never">
+        <el-card shadow="never" class="d2-mb">
           <p slot="title">小数位数</p>
           <div class="group">
             <d2-count-up :end="100" :decimals="2"/>
@@ -27,7 +27,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card shadow="never">
+        <el-card shadow="never" class="d2-mb">
           <p slot="title">动画时长</p>
           <div class="group">
             <d2-count-up :end="100" :duration="6"/>
@@ -43,7 +43,7 @@
         </el-card>
       </el-col>
       <el-col :span="6">
-        <el-card shadow="never">
+        <el-card shadow="never" class="d2-mb-0">
           <p slot="title">结束一秒后更新数值</p>
           <div class="group">
             <d2-count-up :end="end" :callback="update"/>
@@ -80,7 +80,6 @@ export default {
 .page {
   .el-card {
     @extend %unable-select;
-    margin-bottom: $margin;
     .group {
       display: flex;
       justify-content: center;

From cccf43ff2d67cdca21c07f20b925e9cd97c02c67 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:26:45 +0800
Subject: [PATCH 20/33] no message

Former-commit-id: 14e623463e72b289eab1072a959dce268b5d2bd1
Former-commit-id: cb7dd398546ef67112e82623e3233eac88ad6107
Former-commit-id: 5b296b480421ae5cbda216591de79b2f0f0849c0
---
 src/assets/style/theme/d2/index.scss | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/assets/style/theme/d2/index.scss b/src/assets/style/theme/d2/index.scss
index cb2c0265..cad7dab9 100644
--- a/src/assets/style/theme/d2/index.scss
+++ b/src/assets/style/theme/d2/index.scss
@@ -42,6 +42,9 @@
   // [组件] d2-container-card
   .d2-container-card {
     border: $theme-container-border;
+    .el-card__header {
+      border-bottom: $theme-container-border;
+    }
   }
   // 顶栏
   .el-header {

From 8c8bb1868ab03912a612f4e9f37389eb05ce43ab Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:27:44 +0800
Subject: [PATCH 21/33] no message

Former-commit-id: 0ee85249ab6fbf977b485d6b35cc003390fffb98
Former-commit-id: c2cd5382c0cb9e61c0ba9323b0b5a851c2102e8b
Former-commit-id: fef7fded1a605acc37244d086a00ee55cd49ffe5
---
 src/assets/style/theme/star/index.scss | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/assets/style/theme/star/index.scss b/src/assets/style/theme/star/index.scss
index d5123ab4..e2221d38 100644
--- a/src/assets/style/theme/star/index.scss
+++ b/src/assets/style/theme/star/index.scss
@@ -40,6 +40,9 @@
   // [组件] d2-container-card
   .d2-container-card {
     border: $theme-container-border;
+    .el-card__header {
+      border-bottom: $theme-container-border;
+    }
   }
   // 顶栏
   .el-header {

From e1a6ad21a1523c47dcbb127a0cd571bc4093ae29 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:30:30 +0800
Subject: [PATCH 22/33] no message

Former-commit-id: d747b364206f49771b684b45593f5e8689cefe26
Former-commit-id: db685aa368779e99b7ad57411d71adf68d36e70b
Former-commit-id: 999b9e8746566ba2180cdd9cbe0ec32554ee5bcf
---
 .../demo/components/editor-quill/index.vue    | 23 ++++++++-----------
 1 file changed, 9 insertions(+), 14 deletions(-)

diff --git a/src/pages/demo/components/editor-quill/index.vue b/src/pages/demo/components/editor-quill/index.vue
index 5ab2a667..87f51ef3 100644
--- a/src/pages/demo/components/editor-quill/index.vue
+++ b/src/pages/demo/components/editor-quill/index.vue
@@ -1,18 +1,13 @@
 <template>
-  <d2-container type="ghost">
-    <el-card class="d2-mb">
-      <d2-demo-page-header slot="header" title="基本示例"/>
-      <d2-quill
-        style="min-height: 200px;"
-        v-model="value"
-        @text-change="textChangeHandler"
-        @selection-change="selectionChangeHandler"
-        @editor-change="editorChangeHandler"/>
-    </el-card>
-    <el-card>
-      <template slot="header">输出</template>
-      <d2-highlight :code="formated"/>
-    </el-card>
+  <d2-container>
+    <d2-demo-page-header slot="header" title="基本示例"/>
+    <d2-quill
+      style="min-height: 200px;"
+      v-model="value"
+      @text-change="textChangeHandler"
+      @selection-change="selectionChangeHandler"
+      @editor-change="editorChangeHandler"/>
+    <d2-highlight :code="formated"/>
   </d2-container>
 </template>
 

From f0fb0e68a556548aa58c1985decc9bf4b3123c5c Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:38:15 +0800
Subject: [PATCH 23/33] no message

Former-commit-id: 9b3ba072c32c3f3b701dfe7f278031ede4dc2255
Former-commit-id: e6a843a9044f670ee739f39f412a31be242c008c
Former-commit-id: 220bcf5eab6ae030ba8d1f26d200453fdacda264
---
 src/pages/demo/components/editor-quill/index.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/pages/demo/components/editor-quill/index.vue b/src/pages/demo/components/editor-quill/index.vue
index 87f51ef3..fee97be8 100644
--- a/src/pages/demo/components/editor-quill/index.vue
+++ b/src/pages/demo/components/editor-quill/index.vue
@@ -7,7 +7,9 @@
       @text-change="textChangeHandler"
       @selection-change="selectionChangeHandler"
       @editor-change="editorChangeHandler"/>
-    <d2-highlight :code="formated"/>
+    <el-card shadow="never" class="d2-mt">
+      <d2-highlight :code="formated"/>
+    </el-card>
   </d2-container>
 </template>
 

From 0894798515537cdd363388ac91c97cca1bbdd799 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:53:47 +0800
Subject: [PATCH 24/33] no message

Former-commit-id: fc287cc8f6ab2052af26400abf0893008c9a21d3
Former-commit-id: 976fdd8400a9c855446ec171549fb3d489fda9f5
Former-commit-id: 69af7ddb348f8f80321bec6a5f7c636c5cc85487
---
 .../components/editor-simpleMDE/index.vue     | 15 +++---
 src/pages/demo/components/highlight/index.vue | 17 +++---
 .../{IconCell.vue => d2-icon-cell.vue}        |  0
 src/pages/demo/components/icon/icon.vue       | 17 +++---
 src/pages/demo/components/icon/list.vue       | 43 +++++++--------
 src/pages/demo/components/icon/select.vue     | 53 +++++++++----------
 src/pages/demo/components/icon/svg.vue        | 25 ++++-----
 7 files changed, 70 insertions(+), 100 deletions(-)
 rename src/pages/demo/components/icon/components/{IconCell.vue => d2-icon-cell.vue} (100%)

diff --git a/src/pages/demo/components/editor-simpleMDE/index.vue b/src/pages/demo/components/editor-simpleMDE/index.vue
index e2d02fe8..b0f399fc 100644
--- a/src/pages/demo/components/editor-simpleMDE/index.vue
+++ b/src/pages/demo/components/editor-simpleMDE/index.vue
@@ -1,13 +1,10 @@
 <template>
-  <d2-container type="ghost">
-    <el-card class="d2-mb">
-      <d2-demo-page-header slot="header" title="基本示例"/>
-      <d2-mde
-        v-model="text"
-        class="mde"/>
-    </el-card>
-    <el-card>
-      <template slot="header">输出</template>
+  <d2-container>
+    <d2-demo-page-header slot="header" title="基本示例"/>
+    <d2-mde
+      v-model="text"
+      class="mde"/>
+    <el-card shadow="never">
       <pre>{{text}}</pre>
     </el-card>
   </d2-container>
diff --git a/src/pages/demo/components/highlight/index.vue b/src/pages/demo/components/highlight/index.vue
index 302d2778..737b17cd 100644
--- a/src/pages/demo/components/highlight/index.vue
+++ b/src/pages/demo/components/highlight/index.vue
@@ -1,35 +1,30 @@
 <template>
-  <d2-container type="ghost">
-    <el-card class="d2-mb">
-      <d2-demo-page-header title="代码高亮组件"/>
-    </el-card>
-    <el-card class="d2-mb">
+  <d2-container>
+    <template slot="header">代码高亮组件</template>
+    <el-card shadow="never" class="d2-mb">
       <p slot="title">javascript</p>
       <d2-highlight :code="codeJavascript"/>
     </el-card>
     <el-row :gutter="20">
       <el-col :span="8">
-        <el-card class="d2-mb">
+        <el-card shadow="never">
           <p slot="title">css</p>
           <d2-highlight :code="codeCSS"/>
         </el-card>
       </el-col>
       <el-col :span="8">
-        <el-card class="d2-mb">
+        <el-card shadow="never">
           <p slot="title">scss</p>
           <d2-highlight :code="codeSCSS"/>
         </el-card>
       </el-col>
       <el-col :span="8">
-        <el-card class="d2-mb">
+        <el-card shadow="never">
           <p slot="title">html</p>
           <d2-highlight :code="codeHTML"/>
         </el-card>
       </el-col>
     </el-row>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 代码高亮.md"/>
-    </el-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/components/icon/components/IconCell.vue b/src/pages/demo/components/icon/components/d2-icon-cell.vue
similarity index 100%
rename from src/pages/demo/components/icon/components/IconCell.vue
rename to src/pages/demo/components/icon/components/d2-icon-cell.vue
diff --git a/src/pages/demo/components/icon/icon.vue b/src/pages/demo/components/icon/icon.vue
index e1ed030e..0ce31ce0 100644
--- a/src/pages/demo/components/icon/icon.vue
+++ b/src/pages/demo/components/icon/icon.vue
@@ -1,15 +1,10 @@
 <template>
-  <d2-container type="ghost">
-    <el-card class="d2-mb">
-      <d2-demo-page-header slot="header" title="图标组件"/>
-      <d2-icon/>
-      <d2-icon name="github"/>
-      <d2-icon name="github" style="font-size: 100px;"/>
-      <d2-icon name="github" class="icon-class-demo"/>
-    </el-card>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图标组件.md"/>
-    </el-card>
+  <d2-container>
+    <template slot="header">图标组件</template>
+    <d2-icon/>
+    <d2-icon name="github"/>
+    <d2-icon name="github" style="font-size: 100px;"/>
+    <d2-icon name="github" class="icon-class-demo"/>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/components/icon/list.vue b/src/pages/demo/components/icon/list.vue
index e691999c..e0ffcbaa 100644
--- a/src/pages/demo/components/icon/list.vue
+++ b/src/pages/demo/components/icon/list.vue
@@ -1,28 +1,21 @@
 <template>
-  <d2-container type="ghost">
-    <el-card>
-      <template slot="header">
-        <el-radio-group v-model="showIndex" size="mini">
-          <el-radio-button
-            v-for="(item, index) in radioOptions"
-            :key="index"
-            :label="item.value">
-            {{item.label}}
-          </el-radio-button>
-        </el-radio-group>
-      </template>
-      <el-row style="margin: -10px;">
-        <el-alert
-          title="点击图标复制代码"
-          type="info"
-          class="d2-m-10"
-          style="width: auto;">
-        </el-alert>
-        <el-col v-for="(iconItem, iconIndex) in iconShow.icon" :key="iconIndex" :span="6" class="d2-p-10">
-          <d2-iconCell :icon="iconItem"></d2-iconCell>
-        </el-col>
-      </el-row>
-    </el-card>
+  <d2-container>
+    <template slot="header">
+      <el-radio-group v-model="showIndex" size="mini">
+        <el-radio-button
+          v-for="(item, index) in radioOptions"
+          :key="index"
+          :label="item.value">
+          {{item.label}}
+        </el-radio-button>
+      </el-radio-group>
+    </template>
+    <el-row style="margin: -10px;">
+      <el-alert title="点击图标复制代码" type="info" class="d2-m-10" style="width: auto;"/>
+      <el-col v-for="(iconItem, iconIndex) in iconShow.icon" :key="iconIndex" :span="6" class="d2-p-10">
+        <d2-icon-cell :icon="iconItem"/>
+      </el-col>
+    </el-row>
   </d2-container>
 </template>
 
@@ -30,7 +23,7 @@
 import icon from '@/assets/library/font-awesome-4.7.0-icon/icon.js'
 export default {
   components: {
-    IconCell: () => import('./components/IconCell')
+    'd2-icon-cell': () => import('./components/d2-icon-cell')
   },
   data () {
     return {
diff --git a/src/pages/demo/components/icon/select.vue b/src/pages/demo/components/icon/select.vue
index 2ad209e8..9e5c2721 100644
--- a/src/pages/demo/components/icon/select.vue
+++ b/src/pages/demo/components/icon/select.vue
@@ -1,33 +1,28 @@
 <template>
-  <d2-container type="ghost">
-    <el-card class="d2-mb">
-      <d2-demo-page-header slot="header" title="图标选择器"/>
-      <div class="title-group">
-        <p class="title">一般用法</p>
-        <p class="sub-title">
-          <template v-if="icon">
-            选择的图标 {{icon}}
-            <i :class="'fa fa-' + icon"></i>
-          </template>
-          <template v-else>未选择</template>
-        </p>
-      </div>
-      <d2-icon-select v-model="icon"/>
-      <div class="title-group">
-        <p class="title">用户可以输入</p>
-        <p class="sub-title">
-          <template v-if="icon2">
-            选择的图标 {{icon2}}
-            <i :class="'fa fa-' + icon2"></i>
-          </template>
-          <template v-else>未选择</template>
-        </p>
-      </div>
-      <d2-icon-select v-model="icon2" :user-input="true"/>
-    </el-card>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图标选择器.md"/>
-    </el-card>
+  <d2-container>
+    <template slot="header">图标选择器</template>
+    <div class="title-group">
+      <p class="title">一般用法</p>
+      <p class="sub-title">
+        <template v-if="icon">
+          选择的图标 {{icon}}
+          <i :class="'fa fa-' + icon"></i>
+        </template>
+        <template v-else>未选择</template>
+      </p>
+    </div>
+    <d2-icon-select v-model="icon"/>
+    <div class="title-group">
+      <p class="title">用户可以输入</p>
+      <p class="sub-title">
+        <template v-if="icon2">
+          选择的图标 {{icon2}}
+          <i :class="'fa fa-' + icon2"></i>
+        </template>
+        <template v-else>未选择</template>
+      </p>
+    </div>
+    <d2-icon-select v-model="icon2" :user-input="true"/>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/components/icon/svg.vue b/src/pages/demo/components/icon/svg.vue
index 280186e5..321741fa 100644
--- a/src/pages/demo/components/icon/svg.vue
+++ b/src/pages/demo/components/icon/svg.vue
@@ -1,19 +1,14 @@
 <template>
-  <d2-container type="ghost">
-    <el-card class="d2-mb">
-      <d2-demo-page-header slot="header" title="SVG图标组件"/>
-      <el-row>
-        <el-col class="icon-card" :span="4" v-for="(icon, index) in $IconSvg" :key="index">
-          <d2-icon-svg class="icon" :name="icon"/>
-          <div class="icon-title">
-            <span>{{icon}}</span>
-          </div>
-        </el-col>
-      </el-row>
-    </el-card>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图标组件 - svg.md"/>
-    </el-card>
+  <d2-container>
+    <template slot="header">SVG图标组件</template>
+    <el-row>
+      <el-col class="icon-card" :span="4" v-for="(icon, index) in $IconSvg" :key="index">
+        <d2-icon-svg class="icon" :name="icon"/>
+        <div class="icon-title">
+          <span>{{icon}}</span>
+        </div>
+      </el-col>
+    </el-row>
   </d2-container>
 </template>
 

From 5896607513608449bd6790e495931fc443d5fbe6 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 14:56:18 +0800
Subject: [PATCH 25/33] no message

Former-commit-id: 7f8cb372dc60400bf24e20c9d2999bc349091948
Former-commit-id: 8e2d0a3ff2c74ce2e0ddaf5b123eaf12e0320170
Former-commit-id: 239cafabc645fc81016cc99d962872772bc461e6
---
 src/pages/demo/components/layout/grid.vue      | 6 +++---
 src/pages/demo/components/layout/splitpane.vue | 2 +-
 src/pages/demo/components/markdown/index.vue   | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/pages/demo/components/layout/grid.vue b/src/pages/demo/components/layout/grid.vue
index f9905920..2cd5d60a 100644
--- a/src/pages/demo/components/layout/grid.vue
+++ b/src/pages/demo/components/layout/grid.vue
@@ -1,5 +1,5 @@
 <template>
-  <d2-container type="ghost" class="demo-plugins-vue-grid-layout-demo">
+  <d2-container type="ghost" class="demo-layout-grid">
     <d2-grid-layout
       v-bind="layout"
       @layout-updated="layoutUpdatedHandler">
@@ -11,7 +11,7 @@
         @move="moveHandler"
         @resized="resizedHandler"
         @moved="movedHandler">
-        <el-card>
+        <el-card shadow="never">
           <el-tag size="mini" type="info" slot="header">Card {{item.i}}</el-tag>
           <template v-if="item.i === '0'">
             <div class="d2-mb">拖拽卡片调整位置</div>
@@ -88,7 +88,7 @@ export default {
 
 <style lang="scss">
 @import '~@/assets/style/public.scss';
-.demo-plugins-vue-grid-layout-demo {
+.demo-layout-grid {
   .vue-grid-layout {
     margin: -10px;
     .el-card {
diff --git a/src/pages/demo/components/layout/splitpane.vue b/src/pages/demo/components/layout/splitpane.vue
index c05f4288..d229f501 100644
--- a/src/pages/demo/components/layout/splitpane.vue
+++ b/src/pages/demo/components/layout/splitpane.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" title="基本示例"/>
+    <template slot="header">基本示例</template>
     <div style="height: 400px; margin: -16px;">
       <SplitPane :min-percent='20' :default-percent='30' split="vertical">
         <template slot="paneL"><div style="margin: 10px;">左</div></template>
diff --git a/src/pages/demo/components/markdown/index.vue b/src/pages/demo/components/markdown/index.vue
index 68d785fd..dd998d2c 100644
--- a/src/pages/demo/components/markdown/index.vue
+++ b/src/pages/demo/components/markdown/index.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" title="效果演示"/>
+    <template slot="header">效果演示</template>
     <d2-markdown url="/static/md/组件 - markdown - 演示.md"/>
   </d2-container>
 </template>
\ No newline at end of file

From e475b7e1df4cc159770d717bc5fe603ebf76aecb Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 19:13:11 +0800
Subject: [PATCH 26/33] no message

Former-commit-id: f834dedfbffb630f6562443809d488ebffcf8f43
Former-commit-id: 37e16ee9ed36382673e58ab6da8848426ab953e5
Former-commit-id: fd53d926e044117974afccab729f690d2409e1f2
---
 src/menu/index.js                                |  8 ++++----
 src/pages/demo/plugins/build/index.vue           |  6 ++----
 .../demo/plugins/clipboard-polyfill/index.vue    |  4 ++--
 src/pages/demo/plugins/export/table.vue          |  5 ++---
 src/pages/demo/plugins/export/txt.vue            |  5 ++---
 src/pages/demo/plugins/i18n/demo1.vue            |  2 +-
 src/pages/demo/plugins/i18n/demo2.vue            |  2 +-
 src/pages/demo/plugins/import/csv.vue            |  2 +-
 src/pages/demo/plugins/import/xlsx.vue           |  2 +-
 src/pages/demo/plugins/js-cookie/index.vue       |  4 ++--
 src/pages/demo/plugins/mock/ajax.vue             |  5 ++---
 .../{MockDemoCard.vue => d2-demo-mock-card.vue}  |  3 ++-
 src/pages/demo/plugins/mock/dpd.vue              |  8 ++++----
 src/pages/demo/plugins/mock/dtd.vue              | 16 ++++++++--------
 src/pages/demo/plugins/timeago/index.vue         | 10 ++--------
 15 files changed, 36 insertions(+), 46 deletions(-)
 rename src/pages/demo/plugins/mock/components/{MockDemoCard.vue => d2-demo-mock-card.vue} (95%)

diff --git a/src/menu/index.js b/src/menu/index.js
index 9de0d79f..0f16a72b 100644
--- a/src/menu/index.js
+++ b/src/menu/index.js
@@ -10,8 +10,8 @@ const demoPlugins = {
       title: '模拟数据',
       children: [
         { path: `${pre}mock/ajax`, title: '拦截异步请求' },
-        { path: `${pre}mock/dpd`, title: 'DPD规则' },
-        { path: `${pre}mock/dtd`, title: 'DTD规则' }
+        { path: `${pre}mock/dpd`, title: 'DPD 规则' },
+        { path: `${pre}mock/dtd`, title: 'DTD 规则' }
       ]
     },
     {
@@ -40,8 +40,8 @@ const demoPlugins = {
     },
     { path: `${pre}build`, title: '环境区分' },
     { path: `${pre}clipboard-polyfill`, title: '剪贴板访问' },
-    { path: `${pre}js-cookie`, title: 'cookie读写' },
-    { path: `${pre}timeago`, title: '计算已经过去的时间' }
+    { path: `${pre}js-cookie`, title: 'Cookie 读写' },
+    { path: `${pre}timeago`, title: '时间差计算' }
   ])('/demo/plugins/')
 }
 
diff --git a/src/pages/demo/plugins/build/index.vue b/src/pages/demo/plugins/build/index.vue
index 90f3fb16..08f640cf 100644
--- a/src/pages/demo/plugins/build/index.vue
+++ b/src/pages/demo/plugins/build/index.vue
@@ -1,8 +1,6 @@
 <template>
-  <d2-container type="full">
-    <template slot="header">
-      多环境发布
-    </template>
+  <d2-container>
+    <template slot="header">多环境发布</template>
     <p>当前是{{$env ? '开发' : '生产'}}环境</p>
   </d2-container>
 </template>
\ No newline at end of file
diff --git a/src/pages/demo/plugins/clipboard-polyfill/index.vue b/src/pages/demo/plugins/clipboard-polyfill/index.vue
index d63e0f6e..c838df39 100644
--- a/src/pages/demo/plugins/clipboard-polyfill/index.vue
+++ b/src/pages/demo/plugins/clipboard-polyfill/index.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" title="基本示例"/>
+    <template slot="header">剪贴板访问</template>
     <el-row :gutter="10">
       <el-col :span="12">
         <div class="d2-mb">
@@ -12,7 +12,7 @@
       <el-col :span="12">
         <el-alert
           class="d2-mb"
-          title="只有在 IE 浏览器下你才可以通过下面这两个按钮获取剪贴板数据"
+          title="在 IE 浏览器或者高版本 Chrome 下你才可以通过下面这两个按钮获取剪贴板数据"
           type="warning"
           show-icon>
         </el-alert>
diff --git a/src/pages/demo/plugins/export/table.vue b/src/pages/demo/plugins/export/table.vue
index 900c05dc..af0f69f3 100644
--- a/src/pages/demo/plugins/export/table.vue
+++ b/src/pages/demo/plugins/export/table.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" title="导出表格"/>
+    <template slot="header">导出表格</template>
     <div class="d2-mb">
       <el-button type="primary" @click="exportCsv">
         <d2-icon name="download"/>
@@ -11,7 +11,7 @@
         导出 Excel
       </el-button>
     </div>
-    <el-table v-bind="table" style="width: 100%" class="d2-mb">
+    <el-table v-bind="table" style="width: 100%">
       <el-table-column
         v-for="(item, index) in table.columns"
         :key="index"
@@ -19,7 +19,6 @@
         :label="item.label">
       </el-table-column>
     </el-table>
-    <d2-markdown url="/static/md/插件 - 导出.md"/>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/plugins/export/txt.vue b/src/pages/demo/plugins/export/txt.vue
index 978104fc..685f57ed 100644
--- a/src/pages/demo/plugins/export/txt.vue
+++ b/src/pages/demo/plugins/export/txt.vue
@@ -1,19 +1,18 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" title="导出文本"/>
+    <template slot="header">导出文本</template>
     <el-input
       type="textarea"
       :autosize="{minRows: 2, maxRows: 4}"
       placeholder="请输入内容 然后点击保存按钮导出文本文档"
       v-model="text">
     </el-input>
-    <div class="d2-mt d2-mb">
+    <div class="d2-mt">
       <el-button type="primary" @click="exportTxt">
         <d2-icon name="download"/>
         保存为 txt
       </el-button>
     </div>
-    <d2-markdown url="/static/md/插件 - 导出.md"/>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/plugins/i18n/demo1.vue b/src/pages/demo/plugins/i18n/demo1.vue
index 411c3b1a..ef7204ef 100644
--- a/src/pages/demo/plugins/i18n/demo1.vue
+++ b/src/pages/demo/plugins/i18n/demo1.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" :title="`${$t('pub.pageHeader.demo')} 1`"/>
+    <template slot="header">{{`${$t('pub.pageHeader.demo')} 1`}}</template>
     <DemoI18nControl></DemoI18nControl>
     <DemoI18n></DemoI18n>
   </d2-container>
diff --git a/src/pages/demo/plugins/i18n/demo2.vue b/src/pages/demo/plugins/i18n/demo2.vue
index 80187f29..154ef2de 100644
--- a/src/pages/demo/plugins/i18n/demo2.vue
+++ b/src/pages/demo/plugins/i18n/demo2.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" :title="`${$t('pub.pageHeader.demo')} 2`"/>
+    <template slot="header">{{`${$t('pub.pageHeader.demo')} 2`}}</template>
     <DemoI18nControl></DemoI18nControl>
     <DemoI18n></DemoI18n>
   </d2-container>
diff --git a/src/pages/demo/plugins/import/csv.vue b/src/pages/demo/plugins/import/csv.vue
index 73eea01b..c2ffca61 100644
--- a/src/pages/demo/plugins/import/csv.vue
+++ b/src/pages/demo/plugins/import/csv.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" title="导入 csv"/>
+    <template slot="header">导入 csv</template>
     <div class="d2-mb">
       <el-button @click="download">
         <d2-icon name="download"/>
diff --git a/src/pages/demo/plugins/import/xlsx.vue b/src/pages/demo/plugins/import/xlsx.vue
index bfb18bda..f5d947dd 100644
--- a/src/pages/demo/plugins/import/xlsx.vue
+++ b/src/pages/demo/plugins/import/xlsx.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container>
-    <d2-demo-page-header slot="header" title="导入 xlsx"/>
+    <template slot="header">导入 xlsx</template>
     <div class="d2-mb">
       <el-button @click="download">
         <d2-icon name="download"/>
diff --git a/src/pages/demo/plugins/js-cookie/index.vue b/src/pages/demo/plugins/js-cookie/index.vue
index e6fe6748..2e004854 100644
--- a/src/pages/demo/plugins/js-cookie/index.vue
+++ b/src/pages/demo/plugins/js-cookie/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <d2-container type="card">
-    <d2-demo-page-header slot="header" title="基本示例"/>
+  <d2-container>
+    <template slot="header">Cookie 读写</template>
     <p class="d2-mt-0">基本读写删</p>
     <el-button type="primary" @click="set('test-user-name', 'test-user')">set('test-user-name', 'normalValue')</el-button>
     <el-button type="info" @click="get('test-user-name')">get('test-user-name')</el-button>
diff --git a/src/pages/demo/plugins/mock/ajax.vue b/src/pages/demo/plugins/mock/ajax.vue
index 49b2c61a..ee0f035a 100644
--- a/src/pages/demo/plugins/mock/ajax.vue
+++ b/src/pages/demo/plugins/mock/ajax.vue
@@ -1,9 +1,9 @@
 <template>
-  <d2-container type="card">
+  <d2-container>
     <div slot="header">
       <el-button @click="ajax">发送请求</el-button>
     </div>
-    <el-table v-bind="table" style="width: 100%" class="d2-mb">
+    <el-table v-bind="table" style="width: 100%">
       <el-table-column
         v-for="(item, index) in table.columns"
         :key="index"
@@ -11,7 +11,6 @@
         :label="item.label">
       </el-table-column>
     </el-table>
-    <d2-markdown url="/static/md/插件 - mock拦截ajax.md"/>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/plugins/mock/components/MockDemoCard.vue b/src/pages/demo/plugins/mock/components/d2-demo-mock-card.vue
similarity index 95%
rename from src/pages/demo/plugins/mock/components/MockDemoCard.vue
rename to src/pages/demo/plugins/mock/components/d2-demo-mock-card.vue
index 585df91c..04491ceb 100644
--- a/src/pages/demo/plugins/mock/components/MockDemoCard.vue
+++ b/src/pages/demo/plugins/mock/components/d2-demo-mock-card.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-card class="d2-mb">
+  <el-card shadow="never" class="d2-mb">
     <div slot="header" class="d2-clearfix">
       <el-button type="text" size="mini">{{title}}</el-button>
       <el-tooltip content="重新 mock 数据" placement="top-end">
@@ -23,6 +23,7 @@
 
 <script>
 export default {
+  name: 'd2-demo-mock-card',
   props: {
     title: {
       type: String,
diff --git a/src/pages/demo/plugins/mock/dpd.vue b/src/pages/demo/plugins/mock/dpd.vue
index 85a110f7..1bc2ebf9 100644
--- a/src/pages/demo/plugins/mock/dpd.vue
+++ b/src/pages/demo/plugins/mock/dpd.vue
@@ -1,17 +1,17 @@
 <template>
   <d2-container type="ghost">
-    <el-card class="d2-mb">
+    <el-card shadow="never" class="d2-mb">
       <d2-demo-page-header slot="header" title="数据占位符"/>
       <d2-markdown url="/static/md/插件 - mock演示页面介绍.md"/>
     </el-card>
-    <MockDemoCard
+    <d2-demo-mock-card
       v-for="(item, index) in settingDPD"
       :key="index"
       :title="item.title"
       :code="JSON.stringify(item.json, null, 2)"
       :mock="mockResult[index]"
       @reload="doMock(index)">
-    </MockDemoCard>
+    </d2-demo-mock-card>
   </d2-container>
 </template>
 
@@ -22,7 +22,7 @@ import Mock from 'mockjs'
 import settingDPD from './data/settingDPD'
 export default {
   components: {
-    MockDemoCard: () => import('./components/MockDemoCard')
+    'd2-demo-mock-card': () => import('./components/d2-demo-mock-card')
   },
   data () {
     return {
diff --git a/src/pages/demo/plugins/mock/dtd.vue b/src/pages/demo/plugins/mock/dtd.vue
index 79e7a8f8..fd545269 100644
--- a/src/pages/demo/plugins/mock/dtd.vue
+++ b/src/pages/demo/plugins/mock/dtd.vue
@@ -1,29 +1,29 @@
 <template>
   <d2-container type="ghost">
-    <el-card class="d2-mb">
+    <el-card shadow="never" class="d2-mb">
       <d2-demo-page-header slot="header" title="数据模板"/>
       <d2-markdown url="/static/md/插件 - mock演示页面介绍.md"/>
     </el-card>
-    <MockDemoCard
+    <d2-demo-mock-card
       v-for="(item, index) in settingDTD"
       :key="index"
       :title="item.title"
       :code="JSON.stringify(item.json, null, 2)"
       :mock="mockResult[index]"
       @reload="doMock(index)">
-    </MockDemoCard>
-    <MockDemoCard
+    </d2-demo-mock-card>
+    <d2-demo-mock-card
       :title="fn.title"
       :code="fn.code"
       :mock="fn.mocked"
       @reload="fnMock()">
-    </MockDemoCard>
-    <MockDemoCard
+    </d2-demo-mock-card>
+    <d2-demo-mock-card
       :title="regexp.title"
       :code="regexp.code"
       :mock="regexp.mocked"
       @reload="regexpMock()">
-    </MockDemoCard>
+    </d2-demo-mock-card>
   </d2-container>
 </template>
 
@@ -40,7 +40,7 @@ export default {
     fn
   ],
   components: {
-    MockDemoCard: () => import('./components/MockDemoCard')
+    'd2-demo-mock-card': () => import('./components/d2-demo-mock-card')
   },
   data () {
     return {
diff --git a/src/pages/demo/plugins/timeago/index.vue b/src/pages/demo/plugins/timeago/index.vue
index cad12708..2aa51096 100644
--- a/src/pages/demo/plugins/timeago/index.vue
+++ b/src/pages/demo/plugins/timeago/index.vue
@@ -1,15 +1,12 @@
 <template>
   <d2-container type="ghost">
-    <el-card class="d2-mb">
-      <d2-demo-page-header title="基本示例"/>
-    </el-card>
-    <el-card class="d2-mb">
+    <el-card shadow="never" class="d2-mb">
       <div class="d2-text-center">
         <h1 style="font-size: 30px;">您在{{openPageDateAgo}}打开的此页面</h1>
         <p style="font-size: 10px;">请稍等一下 10秒后会开始自动刷新</p>
       </div>
     </el-card>
-    <el-card class="d2-mb">
+    <el-card shadow="never">
       <div class="d2-text-center">
         <h1 style="font-size: 30px;">{{dateTimeRangeAgo}}</h1>
         <el-date-picker
@@ -21,9 +18,6 @@
         </el-date-picker>
       </div>
     </el-card>
-    <el-card>
-      <d2-markdown url="/static/md/插件 - timeago.md"/>
-    </el-card>
   </d2-container>
 </template>
 

From e627fde02a6543217a7de3b68b57505729364242 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 19:14:53 +0800
Subject: [PATCH 27/33] no message

Former-commit-id: a838b6e7fee739930fd2b78ee1ad57515419b0c7
Former-commit-id: dbd0bc699015ebe687c3418871e0828e2559a07a
Former-commit-id: 6b3f23c332367bccf2eb9ffad136715105845085
---
 src/pages/demo/components/container/ghost.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/demo/components/container/ghost.vue b/src/pages/demo/components/container/ghost.vue
index 788779e6..c888e868 100644
--- a/src/pages/demo/components/container/ghost.vue
+++ b/src/pages/demo/components/container/ghost.vue
@@ -1,6 +1,6 @@
 <template>
   <d2-container type="ghost">
-    <el-card style="width: 50%;">
+    <el-card shadow="never" style="width: 50%;">
       <d2-markdown url="/static/md/组件 - 页面容器 - 隐形.md"/>
     </el-card>
   </d2-container>

From cb3df42c750ddc2a0965d89138d900dea819c63e Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 19:41:45 +0800
Subject: [PATCH 28/33] no message

Former-commit-id: 51ef3a6ec2f60ad569a6f4f6c5205ceee62df271
Former-commit-id: 9b2bf4b7c9a2bb48c5173ddf7eae90640c9ea214
Former-commit-id: 77254977d141873f378c7d2d5d74566e8bce160a
---
 src/pages/demo/plugins/import/xlsx.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/demo/plugins/import/xlsx.vue b/src/pages/demo/plugins/import/xlsx.vue
index f5d947dd..487b5553 100644
--- a/src/pages/demo/plugins/import/xlsx.vue
+++ b/src/pages/demo/plugins/import/xlsx.vue
@@ -23,7 +23,6 @@
         :label="item.label">
       </el-table-column>
     </el-table>
-    <d2-markdown url="/static/md/插件 - 导入.md"/>
   </d2-container>
 </template>
 

From 9c0069cdc0d3464f3f95243b09f6c00c591d88e0 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 19:45:07 +0800
Subject: [PATCH 29/33] no message

Former-commit-id: c7d4f035ae65745c352a251a90aed0ff1f63bb6e
Former-commit-id: 9d1ed97b543b24b15c5eb5b41d487dc5e624d83f
Former-commit-id: 9577e9080fee8196fef245ee4f19260c94d1efc4
---
 src/pages/demo/chart/demo/PieBase.vue                      | 7 ++-----
 src/pages/demo/chart/demo/areaBase.vue                     | 7 ++-----
 src/pages/demo/chart/demo/barBase.vue                      | 7 ++-----
 src/pages/demo/chart/demo/columnBase.vue                   | 7 ++-----
 .../{ChartDemoCard.vue => d2-demo-chart-card.vue}          | 0
 src/pages/demo/chart/demo/lineBase.vue                     | 7 ++-----
 src/pages/demo/chart/demo/lineStep.vue                     | 7 ++-----
 src/pages/demo/chart/demo/mixins/public.js                 | 2 +-
 src/pages/demo/chart/demo/nightingaleRoseBase.vue          | 7 ++-----
 src/pages/demo/chart/demo/radarBase.vue                    | 7 ++-----
 10 files changed, 17 insertions(+), 41 deletions(-)
 rename src/pages/demo/chart/demo/components/{ChartDemoCard.vue => d2-demo-chart-card.vue} (100%)

diff --git a/src/pages/demo/chart/demo/PieBase.vue b/src/pages/demo/chart/demo/PieBase.vue
index 73e67aab..d347ba64 100644
--- a/src/pages/demo/chart/demo/PieBase.vue
+++ b/src/pages/demo/chart/demo/PieBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-pie-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-pie-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/areaBase.vue b/src/pages/demo/chart/demo/areaBase.vue
index e13c2606..eb324ca8 100644
--- a/src/pages/demo/chart/demo/areaBase.vue
+++ b/src/pages/demo/chart/demo/areaBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-area-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-area-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/barBase.vue b/src/pages/demo/chart/demo/barBase.vue
index a257df0d..f31fcc5a 100644
--- a/src/pages/demo/chart/demo/barBase.vue
+++ b/src/pages/demo/chart/demo/barBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-bar-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-bar-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/columnBase.vue b/src/pages/demo/chart/demo/columnBase.vue
index c6da31a0..eab38ea2 100644
--- a/src/pages/demo/chart/demo/columnBase.vue
+++ b/src/pages/demo/chart/demo/columnBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-column-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-column-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/components/ChartDemoCard.vue b/src/pages/demo/chart/demo/components/d2-demo-chart-card.vue
similarity index 100%
rename from src/pages/demo/chart/demo/components/ChartDemoCard.vue
rename to src/pages/demo/chart/demo/components/d2-demo-chart-card.vue
diff --git a/src/pages/demo/chart/demo/lineBase.vue b/src/pages/demo/chart/demo/lineBase.vue
index b01286e3..434fa57e 100644
--- a/src/pages/demo/chart/demo/lineBase.vue
+++ b/src/pages/demo/chart/demo/lineBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-line-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-line-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/lineStep.vue b/src/pages/demo/chart/demo/lineStep.vue
index 802fcbc9..fd559668 100644
--- a/src/pages/demo/chart/demo/lineStep.vue
+++ b/src/pages/demo/chart/demo/lineStep.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-line-step slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-line-step>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/mixins/public.js b/src/pages/demo/chart/demo/mixins/public.js
index 17c839b4..7a0b5698 100644
--- a/src/pages/demo/chart/demo/mixins/public.js
+++ b/src/pages/demo/chart/demo/mixins/public.js
@@ -1,5 +1,5 @@
 export default {
   components: {
-    ChartDemoCard: () => import('../components/ChartDemoCard.vue')
+    'd2-demo-chart-card': () => import('../components/d2-demo-chart-card.vue')
   }
 }
diff --git a/src/pages/demo/chart/demo/nightingaleRoseBase.vue b/src/pages/demo/chart/demo/nightingaleRoseBase.vue
index e7e4f1f6..0e52ce20 100644
--- a/src/pages/demo/chart/demo/nightingaleRoseBase.vue
+++ b/src/pages/demo/chart/demo/nightingaleRoseBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-nightingale-rose-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-nightingale-rose-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/chart/demo/radarBase.vue b/src/pages/demo/chart/demo/radarBase.vue
index 6451b317..e319081b 100644
--- a/src/pages/demo/chart/demo/radarBase.vue
+++ b/src/pages/demo/chart/demo/radarBase.vue
@@ -1,11 +1,8 @@
 <template>
   <d2-container type="ghost" :responsive="true">
-    <ChartDemoCard class="d2-mb" v-bind="card" @resize="$refs.chart.resize()">
+    <d2-demo-chart-card v-bind="card" @resize="$refs.chart.resize()">
       <d2-chart-radar-base slot-scope="{data}" ref="chart" :data="data" v-bind="chart"></d2-chart-radar-base>
-    </ChartDemoCard>
-    <el-card>
-      <d2-markdown url="/static/md/组件 - 图表.md"/>
-    </el-card>
+    </d2-demo-chart-card>
   </d2-container>
 </template>
 

From 0daef2becfb61f46dab120a5b033d2c97cc743a2 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 19:49:11 +0800
Subject: [PATCH 30/33] no message

Former-commit-id: f0773ac8cf51efbac589552b1311145cb1c8ad3e
Former-commit-id: 9082a4e38b40dadccb8ce83d0f1aee4be8b4994a
Former-commit-id: 7d4d9e66ee7eceddfabe9c27d37fa4b83e8f65a7
---
 ...ader.vue => d2-demo-chart-card-header.vue} |  1 +
 src/pages/demo/chart/all/index.vue            | 34 +++++++++----------
 ...ader.vue => d2-demo-chart-card-header.vue} |  1 +
 src/pages/demo/chart/dynamicSize/index.vue    | 34 +++++++++----------
 4 files changed, 36 insertions(+), 34 deletions(-)
 rename src/pages/demo/chart/all/components/{ChartCardHeader.vue => d2-demo-chart-card-header.vue} (95%)
 rename src/pages/demo/chart/dynamicSize/components/{ChartCardHeader.vue => d2-demo-chart-card-header.vue} (95%)

diff --git a/src/pages/demo/chart/all/components/ChartCardHeader.vue b/src/pages/demo/chart/all/components/d2-demo-chart-card-header.vue
similarity index 95%
rename from src/pages/demo/chart/all/components/ChartCardHeader.vue
rename to src/pages/demo/chart/all/components/d2-demo-chart-card-header.vue
index 194460da..18d4c20f 100644
--- a/src/pages/demo/chart/all/components/ChartCardHeader.vue
+++ b/src/pages/demo/chart/all/components/d2-demo-chart-card-header.vue
@@ -14,6 +14,7 @@
 
 <script>
 export default {
+  name: 'd2-demo-chart-card-header',
   props: {
     title: {
       type: String,
diff --git a/src/pages/demo/chart/all/index.vue b/src/pages/demo/chart/all/index.vue
index 91126a32..0837f774 100644
--- a/src/pages/demo/chart/all/index.vue
+++ b/src/pages/demo/chart/all/index.vue
@@ -2,50 +2,50 @@
   <d2-container type="ghost" :responsive="true" class="demo-chart-index">
     <el-row :gutter="20">
       <el-col class="col" :span="8">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(0)" title="<d2-chart-line-base/>"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(0)" title="<d2-chart-line-base/>"></d2-demo-chart-card-header>
           <d2-chart-line-base :ref="chart[0].refName" v-bind="chart[0]" @ready="isReady(0)"></d2-chart-line-base>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(1)" title="<d2-chart-line-step/>"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(1)" title="<d2-chart-line-step/>"></d2-demo-chart-card-header>
           <d2-chart-line-step :ref="chart[1].refName" v-bind="chart[1]" @ready="isReady(1)"></d2-chart-line-step>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(2)" title="<d2-chart-column-base/>"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(2)" title="<d2-chart-column-base/>"></d2-demo-chart-card-header>
           <d2-chart-column-base :ref="chart[2].refName" v-bind="chart[2]" @ready="isReady(2)"></d2-chart-column-base>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(3)" title="<d2-chart-bar-base/>"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(3)" title="<d2-chart-bar-base/>"></d2-demo-chart-card-header>
           <d2-chart-bar-base :ref="chart[3].refName" v-bind="chart[3]" @ready="isReady(3)"></d2-chart-bar-base>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(4)" title="<d2-chart-pie-base/>"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(4)" title="<d2-chart-pie-base/>"></d2-demo-chart-card-header>
           <d2-chart-pie-base :ref="chart[4].refName" v-bind="chart[4]" @ready="isReady(4)"></d2-chart-pie-base>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(5)" title="<d2-chart-nightingale-rose-base/>"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(5)" title="<d2-chart-nightingale-rose-base/>"></d2-demo-chart-card-header>
           <d2-chart-nightingale-rose-base :ref="chart[5].refName" v-bind="chart[5]" @ready="isReady(5)"></d2-chart-nightingale-rose-base>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(6)" title="<d2-chart-radar-base/>"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(6)" title="<d2-chart-radar-base/>"></d2-demo-chart-card-header>
           <d2-chart-radar-base :ref="chart[6].refName" v-bind="chart[6]" @ready="isReady(6)"></d2-chart-radar-base>
         </el-card>
       </el-col>
       <el-col class="col" :span="8">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(7)" title="<d2-chart-area-base/>"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(7)" title="<d2-chart-area-base/>"></d2-demo-chart-card-header>
           <d2-chart-area-base :ref="chart[7].refName" v-bind="chart[7]" @ready="isReady(7)"></d2-chart-area-base>
         </el-card>
       </el-col>
@@ -56,7 +56,7 @@
 <script>
 export default {
   components: {
-    ChartCardHeader: () => import('./components/ChartCardHeader')
+    'd2-demo-chart-card-header': () => import('./components/d2-demo-chart-card-header')
   },
   data () {
     return {
diff --git a/src/pages/demo/chart/dynamicSize/components/ChartCardHeader.vue b/src/pages/demo/chart/dynamicSize/components/d2-demo-chart-card-header.vue
similarity index 95%
rename from src/pages/demo/chart/dynamicSize/components/ChartCardHeader.vue
rename to src/pages/demo/chart/dynamicSize/components/d2-demo-chart-card-header.vue
index 194460da..18d4c20f 100644
--- a/src/pages/demo/chart/dynamicSize/components/ChartCardHeader.vue
+++ b/src/pages/demo/chart/dynamicSize/components/d2-demo-chart-card-header.vue
@@ -14,6 +14,7 @@
 
 <script>
 export default {
+  name: 'd2-demo-chart-card-header',
   props: {
     title: {
       type: String,
diff --git a/src/pages/demo/chart/dynamicSize/index.vue b/src/pages/demo/chart/dynamicSize/index.vue
index 29ba5b13..c3bbd56b 100644
--- a/src/pages/demo/chart/dynamicSize/index.vue
+++ b/src/pages/demo/chart/dynamicSize/index.vue
@@ -3,57 +3,57 @@
     <d2-grid-layout v-bind="layout" @layout-updated="layoutUpdatedHandler">
       <!-- 卡片 -->
       <d2-grid-item v-bind="layout.layout[0]" @resized="handleResized(chart[0].refName)">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(0)" title="d2-chart-line-base"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(0)" title="d2-chart-line-base"></d2-demo-chart-card-header>
           <d2-chart-line-base :ref="chart[0].refName" v-bind="chart[0]" @ready="isReady(0)"></d2-chart-line-base>
         </el-card>
       </d2-grid-item>
       <!-- 卡片 -->
       <d2-grid-item v-bind="layout.layout[1]" @resized="handleResized(chart[1].refName)">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(1)" title="d2-chart-line-step"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(1)" title="d2-chart-line-step"></d2-demo-chart-card-header>
           <d2-chart-line-step :ref="chart[1].refName" v-bind="chart[1]" @ready="isReady(1)"></d2-chart-line-step>
         </el-card>
       </d2-grid-item>
       <!-- 卡片 -->
       <d2-grid-item v-bind="layout.layout[2]" @resized="handleResized(chart[2].refName)">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(2)" title="d2-chart-column-base"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(2)" title="d2-chart-column-base"></d2-demo-chart-card-header>
           <d2-chart-column-base :ref="chart[2].refName" v-bind="chart[2]" @ready="isReady(2)"></d2-chart-column-base>
         </el-card>
       </d2-grid-item>
       <!-- 卡片 -->
       <d2-grid-item v-bind="layout.layout[3]" @resized="handleResized(chart[3].refName)">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(3)" title="d2-chart-bar-base"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(3)" title="d2-chart-bar-base"></d2-demo-chart-card-header>
           <d2-chart-bar-base :ref="chart[3].refName" v-bind="chart[3]" @ready="isReady(3)"></d2-chart-bar-base>
         </el-card>
       </d2-grid-item>
       <!-- 卡片 -->
       <d2-grid-item v-bind="layout.layout[4]" @resized="handleResized(chart[4].refName)">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(4)" title="d2-chart-pie-base"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(4)" title="d2-chart-pie-base"></d2-demo-chart-card-header>
           <d2-chart-pie-base :ref="chart[4].refName" v-bind="chart[4]" @ready="isReady(4)"></d2-chart-pie-base>
         </el-card>
       </d2-grid-item>
       <!-- 卡片 -->
       <d2-grid-item v-bind="layout.layout[5]" @resized="handleResized(chart[5].refName)">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(5)" title="d2-chart-nightingale-rose-base"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(5)" title="d2-chart-nightingale-rose-base"></d2-demo-chart-card-header>
           <d2-chart-nightingale-rose-base :ref="chart[5].refName" v-bind="chart[5]" @ready="isReady(5)"></d2-chart-nightingale-rose-base>
         </el-card>
       </d2-grid-item>
       <!-- 卡片 -->
       <d2-grid-item v-bind="layout.layout[6]" @resized="handleResized(chart[6].refName)">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(6)" title="d2-chart-radar-base"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(6)" title="d2-chart-radar-base"></d2-demo-chart-card-header>
           <d2-chart-radar-base :ref="chart[6].refName" v-bind="chart[6]" @ready="isReady(6)"></d2-chart-radar-base>
         </el-card>
       </d2-grid-item>
       <!-- 卡片 -->
       <d2-grid-item v-bind="layout.layout[7]" @resized="handleResized(chart[7].refName)">
-        <el-card class="header-in">
-          <ChartCardHeader slot="header" @refresh="handleRefreshData(7)" title="d2-chart-area-base"></ChartCardHeader>
+        <el-card shadow="never" class="header-in">
+          <d2-demo-chart-card-header slot="header" @refresh="handleRefreshData(7)" title="d2-chart-area-base"></d2-demo-chart-card-header>
           <d2-chart-area-base :ref="chart[7].refName" v-bind="chart[7]" @ready="isReady(7)"></d2-chart-area-base>
         </el-card>
       </d2-grid-item>
@@ -64,7 +64,7 @@
 <script>
 export default {
   components: {
-    ChartCardHeader: () => import('./components/ChartCardHeader')
+    'd2-demo-chart-card-header': () => import('./components/d2-demo-chart-card-header')
   },
   data () {
     return {

From 5ecc2c53eb4f74057a777ea16ea9f709cdb79ae0 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 20:51:44 +0800
Subject: [PATCH 31/33] no message

Former-commit-id: a589a4ea4e4f45393d91d557db4b4b3e3f72d47b
Former-commit-id: 18483145821bf3445974734a7f8bdf392cd74666
Former-commit-id: 632d9abab39bb0311e169b1b982dbb2bd81e499e
---
 build/webpack.base.conf.js                    |   4 +
 package.json                                  |   1 +
 src/menu/index.js                             |   2 +-
 src/pages/demo/components/container/card.vue  |  17 ++
 src/pages/demo/components/container/full.vue  |  13 +-
 src/pages/demo/components/container/ghost.vue |  13 +-
 .../pages/demo/components/container/md/doc-card.md |   0
 .../pages/demo/components/container/md/doc-full.md |   2 +-
 .../pages/demo/components/container/md/doc-ghost.md |   0
 .../demo/components/container/normal.vue      |   6 -
 src/pages/demo/components/markdown/index.vue  |  15 +-
 .../pages/demo/components/markdown/md/doc.md  |   4 +-
 src/pages/demo/plugins/import/csv.vue         |   1 -
 src/pages/demo/plugins/mock/dpd.vue           |   6 +-
 src/pages/demo/plugins/mock/dtd.vue           |   6 +-
 .../pages/demo/plugins/mock/md/doc.md         |   0
 src/router/index.js                           |   2 +-
 static/md/插件 - mock拦截ajax.md              |  35 ----
 static/md/插件 - mock语法规范.md              | 181 ------------------
 static/md/插件 - timeago.md                   |  47 -----
 static/md/插件 - 多国语.md                    | 122 ------------
 static/md/插件 - 导入.md                      |  62 ------
 static/md/插件 - 导出.md                      | 146 --------------
 static/md/组件 - markdown - 文档.md           |  54 ------
 static/md/组件 - 代码高亮.md                  |  13 --
 static/md/组件 - 图标组件 - svg.md            |  33 ----
 static/md/组件 - 图标组件.md                  |  39 ----
 static/md/组件 - 图标选择器.md                |  13 --
 static/md/组件 - 图表.md                      |  68 -------
 static/md/组件 - 数字动画.md                  |  27 ---
 static/md/组件 - 页面容器.md                  |  36 ----
 31 files changed, 71 insertions(+), 897 deletions(-)
 create mode 100644 src/pages/demo/components/container/card.vue
 rename static/md/组件 - 页面容器 - 基础.md => src/pages/demo/components/container/md/doc-card.md (100%)
 rename static/md/组件 - 页面容器 - 撑满.md => src/pages/demo/components/container/md/doc-full.md (98%)
 rename static/md/组件 - 页面容器 - 隐形.md => src/pages/demo/components/container/md/doc-ghost.md (100%)
 delete mode 100644 src/pages/demo/components/container/normal.vue
 rename static/md/组件 - markdown - 演示.md => src/pages/demo/components/markdown/md/doc.md (86%)
 rename static/md/插件 - mock演示页面介绍.md => src/pages/demo/plugins/mock/md/doc.md (100%)
 delete mode 100644 static/md/插件 - mock拦截ajax.md
 delete mode 100644 static/md/插件 - mock语法规范.md
 delete mode 100644 static/md/插件 - timeago.md
 delete mode 100644 static/md/插件 - 多国语.md
 delete mode 100644 static/md/插件 - 导入.md
 delete mode 100644 static/md/插件 - 导出.md
 delete mode 100644 static/md/组件 - markdown - 文档.md
 delete mode 100644 static/md/组件 - 代码高亮.md
 delete mode 100644 static/md/组件 - 图标组件 - svg.md
 delete mode 100644 static/md/组件 - 图标组件.md
 delete mode 100644 static/md/组件 - 图标选择器.md
 delete mode 100644 static/md/组件 - 图表.md
 delete mode 100644 static/md/组件 - 数字动画.md
 delete mode 100644 static/md/组件 - 页面容器.md

diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js
index b1fe7c87..0a43f3a4 100755
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@@ -81,6 +81,10 @@ module.exports = {
         test: /\.scss$/,
         loaders: ["style", "css", "sass"]
       },
+      {
+        test: /\.md$/,
+        loaders: ["text-loader"]
+      },
       {
         test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
         loader: 'url-loader',
diff --git a/package.json b/package.json
index 84dbbf7b..9d756c5d 100755
--- a/package.json
+++ b/package.json
@@ -80,6 +80,7 @@
     "semver": "^5.3.0",
     "shelljs": "^0.7.6",
     "svg-sprite-loader": "^3.6.2",
+    "text-loader": "0.0.1",
     "uglifyjs-webpack-plugin": "^1.1.1",
     "url-loader": "^0.5.8",
     "vue-loader": "^13.3.0",
diff --git a/src/menu/index.js b/src/menu/index.js
index 0f16a72b..b2c53a76 100644
--- a/src/menu/index.js
+++ b/src/menu/index.js
@@ -58,7 +58,7 @@ const demoComponents = {
       children: [
         { path: `${pre}container/full`, title: '填满' },
         { path: `${pre}container/ghost`, title: '隐形' },
-        { path: `${pre}container/normal`, title: '一般' }
+        { path: `${pre}container/card`, title: '卡片' }
       ]
     },
     {
diff --git a/src/pages/demo/components/container/card.vue b/src/pages/demo/components/container/card.vue
new file mode 100644
index 00000000..49ccca78
--- /dev/null
+++ b/src/pages/demo/components/container/card.vue
@@ -0,0 +1,17 @@
+<template>
+  <d2-container>
+    <template slot="header">我是插入到 header 中的内容</template>
+    <d2-markdown :md="doc"/>
+  </d2-container>
+</template>
+
+<script>
+import doc from './md/doc-card.md'
+export default {
+  data () {
+    return {
+      doc
+    }
+  }
+}
+</script>
diff --git a/src/pages/demo/components/container/full.vue b/src/pages/demo/components/container/full.vue
index 9d31cbb9..0783ea0e 100644
--- a/src/pages/demo/components/container/full.vue
+++ b/src/pages/demo/components/container/full.vue
@@ -3,9 +3,20 @@
     <template slot="header">
       我是插入到 header 中的内容
     </template>
-    <d2-markdown url="/static/md/组件 - 页面容器 - 撑满.md"/>
+    <d2-markdown :md="doc"/>
     <template slot="footer">
       我是插入到 footer 中的内容
     </template>
   </d2-container>
 </template>
+
+<script>
+import doc from './md/doc-full.md'
+export default {
+  data () {
+    return {
+      doc
+    }
+  }
+}
+</script>
diff --git a/src/pages/demo/components/container/ghost.vue b/src/pages/demo/components/container/ghost.vue
index c888e868..6250aea8 100644
--- a/src/pages/demo/components/container/ghost.vue
+++ b/src/pages/demo/components/container/ghost.vue
@@ -1,7 +1,18 @@
 <template>
   <d2-container type="ghost">
     <el-card shadow="never" style="width: 50%;">
-      <d2-markdown url="/static/md/组件 - 页面容器 - 隐形.md"/>
+      <d2-markdown :md="doc"/>
     </el-card>
   </d2-container>
 </template>
+
+<script>
+import doc from './md/doc-ghost.md'
+export default {
+  data () {
+    return {
+      doc
+    }
+  }
+}
+</script>
diff --git a/static/md/组件 - 页面容器 - 基础.md b/src/pages/demo/components/container/md/doc-card.md
similarity index 100%
rename from static/md/组件 - 页面容器 - 基础.md
rename to src/pages/demo/components/container/md/doc-card.md
diff --git a/static/md/组件 - 页面容器 - 撑满.md b/src/pages/demo/components/container/md/doc-full.md
similarity index 98%
rename from static/md/组件 - 页面容器 - 撑满.md
rename to src/pages/demo/components/container/md/doc-full.md
index df8b36f4..a254fc10 100644
--- a/static/md/组件 - 页面容器 - 撑满.md	
+++ b/src/pages/demo/components/container/md/doc-full.md
@@ -72,4 +72,4 @@ Element，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 
 
 - 用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；
 
-- 结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。
+- 结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。
\ No newline at end of file
diff --git a/static/md/组件 - 页面容器 - 隐形.md b/src/pages/demo/components/container/md/doc-ghost.md
similarity index 100%
rename from static/md/组件 - 页面容器 - 隐形.md
rename to src/pages/demo/components/container/md/doc-ghost.md
diff --git a/src/pages/demo/components/container/normal.vue b/src/pages/demo/components/container/normal.vue
deleted file mode 100644
index 2bea1196..00000000
--- a/src/pages/demo/components/container/normal.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-<template>
-  <d2-container>
-    <template slot="header">我是插入到 header 中的内容</template>
-    <d2-markdown url="/static/md/组件 - 页面容器 - 基础.md"/>
-  </d2-container>
-</template>
diff --git a/src/pages/demo/components/markdown/index.vue b/src/pages/demo/components/markdown/index.vue
index dd998d2c..e38e9ab4 100644
--- a/src/pages/demo/components/markdown/index.vue
+++ b/src/pages/demo/components/markdown/index.vue
@@ -1,6 +1,17 @@
 <template>
   <d2-container>
     <template slot="header">效果演示</template>
-    <d2-markdown url="/static/md/组件 - markdown - 演示.md"/>
+    <d2-markdown :md="doc"/>
   </d2-container>
-</template>
\ No newline at end of file
+</template>
+
+<script>
+import doc from './md/doc.md'
+export default {
+  data () {
+    return {
+      doc
+    }
+  }
+}
+</script>
diff --git a/static/md/组件 - markdown - 演示.md b/src/pages/demo/components/markdown/md/doc.md
similarity index 86%
rename from static/md/组件 - markdown - 演示.md
rename to src/pages/demo/components/markdown/md/doc.md
index 3e1d0c1b..301b283d 100644
--- a/static/md/组件 - markdown - 演示.md	
+++ b/src/pages/demo/components/markdown/md/doc.md
@@ -20,6 +20,4 @@ alert('Hello World')
 
 > 链接: https://pan.baidu.com/s/1ggFW21l 密码: 877y
 
-[https://github.com/FairyEver](https://github.com/FairyEver)
-
-
+[https://github.com/FairyEver](https://github.com/FairyEver)
\ No newline at end of file
diff --git a/src/pages/demo/plugins/import/csv.vue b/src/pages/demo/plugins/import/csv.vue
index c2ffca61..aa18de82 100644
--- a/src/pages/demo/plugins/import/csv.vue
+++ b/src/pages/demo/plugins/import/csv.vue
@@ -23,7 +23,6 @@
         :label="item.label">
       </el-table-column>
     </el-table>
-    <d2-markdown url="/static/md/插件 - 导入.md"/>
   </d2-container>
 </template>
 
diff --git a/src/pages/demo/plugins/mock/dpd.vue b/src/pages/demo/plugins/mock/dpd.vue
index 1bc2ebf9..c51f9585 100644
--- a/src/pages/demo/plugins/mock/dpd.vue
+++ b/src/pages/demo/plugins/mock/dpd.vue
@@ -2,7 +2,7 @@
   <d2-container type="ghost">
     <el-card shadow="never" class="d2-mb">
       <d2-demo-page-header slot="header" title="数据占位符"/>
-      <d2-markdown url="/static/md/插件 - mock演示页面介绍.md"/>
+      <d2-markdown :md="doc"/>
     </el-card>
     <d2-demo-mock-card
       v-for="(item, index) in settingDPD"
@@ -20,6 +20,7 @@ import Vue from 'vue'
 import clone from '@/utils/clone.js'
 import Mock from 'mockjs'
 import settingDPD from './data/settingDPD'
+import doc from './md/doc.md'
 export default {
   components: {
     'd2-demo-mock-card': () => import('./components/d2-demo-mock-card')
@@ -28,7 +29,8 @@ export default {
     return {
       mockResult: [],
       settingDPD,
-      settingDPDClone: clone(settingDPD)
+      settingDPDClone: clone(settingDPD),
+      doc
     }
   },
   mounted () {
diff --git a/src/pages/demo/plugins/mock/dtd.vue b/src/pages/demo/plugins/mock/dtd.vue
index fd545269..5ff55ec3 100644
--- a/src/pages/demo/plugins/mock/dtd.vue
+++ b/src/pages/demo/plugins/mock/dtd.vue
@@ -2,7 +2,7 @@
   <d2-container type="ghost">
     <el-card shadow="never" class="d2-mb">
       <d2-demo-page-header slot="header" title="数据模板"/>
-      <d2-markdown url="/static/md/插件 - mock演示页面介绍.md"/>
+      <d2-markdown :md="doc"/>
     </el-card>
     <d2-demo-mock-card
       v-for="(item, index) in settingDTD"
@@ -34,6 +34,7 @@ import Mock from 'mockjs'
 import settingDTD from './data/settingDTD'
 import regexp from './mixins/regexp'
 import fn from './mixins/function'
+import doc from './md/doc.md'
 export default {
   mixins: [
     regexp,
@@ -46,7 +47,8 @@ export default {
     return {
       mockResult: [],
       settingDTD,
-      settingDTDClone: clone(settingDTD)
+      settingDTDClone: clone(settingDTD),
+      doc
     }
   },
   mounted () {
diff --git a/static/md/插件 - mock演示页面介绍.md b/src/pages/demo/plugins/mock/md/doc.md
similarity index 100%
rename from static/md/插件 - mock演示页面介绍.md
rename to src/pages/demo/plugins/mock/md/doc.md
diff --git a/src/router/index.js b/src/router/index.js
index 2b581011..8b7f2599 100755
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -28,7 +28,7 @@ const routes = [
     children: (pre => [
       { path: 'container/full', name: `${pre}container-full`, component: () => import('@/pages/demo/components/container/full.vue') },
       { path: 'container/ghost', name: `${pre}container-ghost`, component: () => import('@/pages/demo/components/container/ghost.vue') },
-      { path: 'container/normal', name: `${pre}container-normal`, component: () => import('@/pages/demo/components/container/normal.vue') },
+      { path: 'container/normal', name: `${pre}container-card`, component: () => import('@/pages/demo/components/container/card.vue') },
       { path: 'countup', name: `${pre}countup`, component: () => import('@/pages/demo/components/countup/index.vue') },
       { path: 'editor-quill', name: `${pre}editor-quill`, component: () => import('@/pages/demo/components/editor-quill/index.vue') },
       { path: 'editor-simpleMDE', name: `${pre}editor-simpleMDE`, component: () => import('@/pages/demo/components/editor-simpleMDE/index.vue') },
diff --git a/static/md/插件 - mock拦截ajax.md b/static/md/插件 - mock拦截ajax.md
deleted file mode 100644
index 3f2f9d9f..00000000
--- a/static/md/插件 - mock拦截ajax.md	
+++ /dev/null
@@ -1,35 +0,0 @@
-在 `src/mock/demo/001.js` 配置拦截返回的数据
-
-```
-import Mock from 'mockjs'
-
-Mock.mock('/api/demo/001', {
-  'list|4-10': [{
-    'id|+1': 1,
-    'name': '@CNAME',
-    'star|1-5': '★',
-    'delFlag|1': [0, 1],
-    'creatDate': '@DATE',
-    'address': '@CITY',
-    'zip': '@ZIP'
-  }]
-})
-```
-
-请求数据
-
-```
-ajax () {
-  this.$axios.get('/api/demo/001')
-  .then(res => {
-    this.table.columns = Object.keys(res.data.list[0]).map(e => ({
-      label: e,
-      prop: e
-    }))
-    this.table.data = res.data.list
-  })
-}
-```
-
-
-
diff --git a/static/md/插件 - mock语法规范.md b/static/md/插件 - mock语法规范.md
deleted file mode 100644
index 22ac0160..00000000
--- a/static/md/插件 - mock语法规范.md	
+++ /dev/null
@@ -1,181 +0,0 @@
-# 语法规范
-
-Mock.js 的语法规范包括两部分：
-
-1. 数据模板定义规范（Data Template Definition，DTD）
-2. 数据占位符定义规范（Data Placeholder Definition，DPD）
-
-## 数据模板定义规范 DTD
-
-**数据模板中的每个属性由 3 部分构成：属性名、生成规则、属性值：**
-
-```js
-// 属性名   name
-// 生成规则 rule
-// 属性值   value
-'name|rule': value
-```
-
-**注意：**
-
-* _属性名_ 和 _生成规则_ 之间用竖线 `|` 分隔。
-* _生成规则_ 是可选的。
-* _生成规则_ 有 7 种格式：
-    1. `'name|min-max': value`
-    1. `'name|count': value`
-    1. `'name|min-max.dmin-dmax': value`
-    1. `'name|min-max.dcount': value`
-    1. `'name|count.dmin-dmax': value`
-    1. `'name|count.dcount': value`
-    1. `'name|+step': value`
-* **_生成规则_ 的 含义 需要依赖 _属性值的类型_ 才能确定。**
-* _属性值_ 中可以含有 `@占位符`。
-* _属性值_ 还指定了最终值的初始值和类型。
-
-<!-- 感谢 @麦少 同学对 Mock.js 语法的整理和分析，才有了这版相对清晰的语法文档。 -->
-
-**生成规则和示例：**
-
-### 1. 属性值是字符串 **String**
-
-1. `'name|min-max': string` 
-
-    通过重复 `string` 生成一个字符串，重复次数大于等于 `min`，小于等于 `max`。
-
-2. `'name|count': string` 
-
-    通过重复 `string` 生成一个字符串，重复次数等于 `count`。
-
-### 2. 属性值是数字 **Number**
-
-1. `'name|+1': number` 
-
-    属性值自动加 1，初始值为 `number`。
-
-2. `'name|min-max': number` 
-
-    生成一个大于等于 `min`、小于等于 `max` 的整数，属性值 `number` 只是用来确定类型。
-
-3. `'name|min-max.dmin-dmax': number` 
-
-    生成一个浮点数，整数部分大于等于 `min`、小于等于 `max`，小数部分保留 `dmin` 到 `dmax` 位。
-
-```js
-Mock.mock({
-    'number1|1-100.1-10': 1,
-    'number2|123.1-10': 1,
-    'number3|123.3': 1,
-    'number4|123.10': 1.123
-})
-// =>
-{
-    "number1": 12.92,
-    "number2": 123.51,
-    "number3": 123.777,
-    "number4": 123.1231091814
-}
-```
-
-### 3. 属性值是布尔型 **Boolean**
-
-1. `'name|1': boolean` 
-
-    随机生成一个布尔值，值为 true 的概率是 1/2，值为 false 的概率同样是 1/2。
-
-2. `'name|min-max': value` 
-
-    随机生成一个布尔值，值为 `value` 的概率是 `min / (min + max)`，值为 `!value` 的概率是 `max / (min + max)`。
-
-### 4. 属性值是对象 **Object**
-
-1. `'name|count': object`
-
-    从属性值 `object` 中随机选取 `count` 个属性。
-
-2. `'name|min-max': object`
-
-    从属性值 `object` 中随机选取 `min` 到 `max` 个属性。
-
-### 5. 属性值是数组 **Array**
-
-1. `'name|1': array` 
-
-    从属性值 `array` 中随机选取 1 个元素，作为最终值。
-
-2. `'name|+1': array` 
-
-    从属性值 `array` 中顺序选取 1 个元素，作为最终值。
-
-3. `'name|min-max': array` 
-
-    通过重复属性值 `array` 生成一个新数组，重复次数大于等于 `min`，小于等于 `max`。
-
-4. `'name|count': array` 
-
-    通过重复属性值 `array` 生成一个新数组，重复次数为 `count`。
-
-### 6. 属性值是函数 **Function**
-
-1. `'name': function` 
-
-    执行函数 `function`，取其返回值作为最终的属性值，函数的上下文为属性 `'name'` 所在的对象。
-
-### 7. 属性值是正则表达式 **RegExp**
-
-1. `'name': regexp` 
-
-    根据正则表达式 `regexp` 反向生成可以匹配它的字符串。用于生成自定义格式的字符串。
-
-    ```js
-    Mock.mock({
-        'regexp1': /[a-z][A-Z][0-9]/,
-        'regexp2': /\w\W\s\S\d\D/,
-        'regexp3': /\d{5,10}/
-    })
-    // =>
-    {
-        "regexp1": "pJ7",
-        "regexp2": "F)\fp1G",
-        "regexp3": "561659409"
-    }
-    ```
-
-## 数据占位符定义规范 DPD
-
-_占位符_ 只是在属性值字符串中占个位置，并不出现在最终的属性值中。
-
-_占位符_ 的格式为：
-
-```
-@占位符
-@占位符(参数 [, 参数])
-```
-
-**注意：**
-
-1. 用 `@` 来标识其后的字符串是 _占位符_。
-2. _占位符_ 引用的是 `Mock.Random` 中的方法。
-3. 通过 `Mock.Random.extend()` 来扩展自定义占位符。
-4. _占位符_ 也可以引用 _数据模板_ 中的属性。
-5. _占位符_ 会优先引用 _数据模板_ 中的属性。
-6. _占位符_ 支持 _相对路径_ 和 _绝对路径_。
-
-```js
-Mock.mock({
-    name: {
-        first: '@FIRST',
-        middle: '@FIRST',
-        last: '@LAST',
-        full: '@first @middle @last'
-    }
-})
-// =>
-{
-    "name": {
-        "first": "Charles",
-        "middle": "Brenda",
-        "last": "Lopez",
-        "full": "Charles Brenda Lopez"
-    }
-}
-```
\ No newline at end of file
diff --git a/static/md/插件 - timeago.md b/static/md/插件 - timeago.md
deleted file mode 100644
index f0bbd90f..00000000
--- a/static/md/插件 - timeago.md	
+++ /dev/null
@@ -1,47 +0,0 @@
-```
-import timeago from 'timeago.js'
-export default {
-  data () {
-    return {
-      // 打开页面时间
-      openPageDate: new Date(),
-      // 打开页面已经过去的时间
-      openPageDateAgo: '',
-      // 打开页面时间计时器
-      dateTimeRangeTimer: null,
-      // 起止时间
-      dateTimeRange: [new Date(2018, 0, 1, 0, 0), new Date()],
-      // 上面起止时间的计算结果
-      dateTimeRangeAgo: ''
-    }
-  },
-  mounted () {
-    // 刷新打开页面过去的时间
-    this.refreshOpenPageDateAgo()
-    this.dateTimeRangeTimer = setInterval(this.refreshOpenPageDateAgo, 1000)
-    // 刷新起止时间的计算结果
-    this.refreshDateTimeRangeAgo()
-  },
-  beforeDestroy () {
-    // 清空计时器
-    clearInterval(this.dateTimeRangeTimer)
-  },
-  watch: {
-    dateTimeRange () {
-      // 刷新起止时间的计算结果
-      this.refreshDateTimeRangeAgo()
-    }
-  },
-  methods: {
-    // 计算打开页面过了多久
-    refreshOpenPageDateAgo () {
-      this.openPageDateAgo = timeago().format(this.openPageDate, 'zh_CN')
-    },
-    // 计算起止时间间隔
-    refreshDateTimeRangeAgo () {
-      const timeagoInstance = timeago(this.dateTimeRange[1])
-      this.dateTimeRangeAgo = timeagoInstance.format(this.dateTimeRange[0], 'zh_CN')
-    }
-  }
-}
-```
\ No newline at end of file
diff --git a/static/md/插件 - 多国语.md b/static/md/插件 - 多国语.md
deleted file mode 100644
index 0e67ce29..00000000
--- a/static/md/插件 - 多国语.md	
+++ /dev/null
@@ -1,122 +0,0 @@
-# vue-i18n
-
-多国语插件
-
-> 此文档仅限于演示如何在 `D2Admin` 中使用多国语言设置
-
-公用的语言设置建议放在 `src/i18n` 下
-
-i18n 文件夹结构如下所示
-
-```
-|__index.js // 主文件
-|__lang // 语言配置文件夹
-| |__cn // 中文
-| | |__index.js // 中文 公用配置
-| |__ja // 日语
-| | |__index.js // 日语 公用配置
-| |__en // 英语
-| | |__index.js // 英语 公用配置
-```
-
-在 `src/i18n/index.js` 中导入同级lang文件夹内的语言设置，并导出一个新的 `VueI18n` 实例供 `main.js` 使用
-
-```
-import i18n from './i18n'
-new Vue({
-  el: '#app',
-  store,
-  i18n, // 使用 i18n
-  router,
-  template: '<App/>',
-  components: { App }
-})
-```
-
-## 基本使用方法
-
-使用 `$t('路径')`
-
-```
-<PageHeader
-  slot="header"
-  :title="`${$t('pub.pageHeader.demo')} 1`"
-  url="http://kazupon.github.io/vue-i18n/en/">
-</PageHeader>
-```
-
-## 在组件中单独配置
-
-有时候我们只希望在某个文件中配置这个组件的多国语言，如果所有的语言设置都放在 `d2admin-vue-element/src/i18n` 中会造成混乱，不易维护
-
-`D2Admin` 已经替你安装好了 `vue-i18n-loader`，可以方便地在单文件组件中使用
-
-示例
-
-```
-<i18n src="./lang.json"></i18n>
-
-<template>
-  <div>
-    <el-tag>{{$t('hello')}}</el-tag>
-    <p>{{$t('check.title')}}</p>
-    <el-checkbox-group v-model="check">
-      <el-checkbox label="a">{{$t('check.label.Beijing')}}</el-checkbox>
-      <el-checkbox label="b">{{$t('check.label.Tokyo')}}</el-checkbox>
-      <el-checkbox label="c">{{$t('check.label.NewYork')}}</el-checkbox>
-    </el-checkbox-group>
-  </div>
-</template>
-
-<script>
-export default {
-  data () {
-    return {
-      check: ['a', 'b']
-    }
-  }
-}
-</script>
-```
-
-在同一文件夹下的 `lang.json`
-
-```
-{
-  "cn": {
-    "hello": "你好",
-    "check": {
-      "title": "请选择",
-      "label": {
-        "Beijing": "北京",
-        "Tokyo": "东京",
-        "NewYork": "纽约"
-      }
-    }
-  },
-  "en": {
-    "hello": "hello",
-    "check": {
-      "title": "Please choose",
-      "label": {
-        "Beijing": "Beijing",
-        "Tokyo": "Tokyo",
-        "NewYork": "NewYork"
-      }
-    }
-  },
-  "ja": {
-    "hello": "こんにちは",
-    "check": {
-      "title": "選択してください",
-      "label": {
-        "Beijing": "北京",
-        "Tokyo": "東京",
-        "NewYork": "ニューヨーク"
-      }
-    }
-  }
-}
-```
-
-详细教程请查看官方文档，见此页右上角的链接
diff --git a/static/md/插件 - 导入.md b/static/md/插件 - 导入.md
deleted file mode 100644
index 3f25b777..00000000
--- a/static/md/插件 - 导入.md	
+++ /dev/null
@@ -1,62 +0,0 @@
-# Vue.$import
-
-本框架集成了数据导入功能，并包装成插件
-
-## 注册插件
-
-> 默认已经注册，可以直接使用
-
-```
-import pluginImport from '@/plugin/import'
-Vue.use(pluginImport)
-```
-
-之后就可以在组件中使用 `this.$import` 来调用导出功能
-
-## Vue.$import.csv()
-
-导入csv文件，并且返回一个 `Promise` 对象
-
-```
-// 在选择文件后调用
-handleUpload (file) {
-  this.$import.csv(file)
-    .then(res => {
-      this.table.columns = Object.keys(res.data[0]).map(e => ({
-        label: e,
-        prop: e
-      }))
-      this.table.data = res.data
-    })
-  // 阻止默认的上传
-  return false
-}
-```
-
-## Vue.$import.xlsx()
-
-导入xlsx文件，并且返回一个 `Promise` 对象
-
-**注意 导入的表格文件第一行应为表头**
-
-参考下述示例使用
-
-```
-// 在选择文件后调用
-handleUpload (file) {
-  this.$import.xlsx(file)
-    .then(({header, results}) => {
-      // header 为表头
-      // results 为内容
-      this.table.columns = header.map(e => {
-        return {
-          label: e,
-          prop: e
-        }
-      })
-      this.table.data = results
-    })
-  // 阻止默认的上传
-  return false
-}
-```
\ No newline at end of file
diff --git a/static/md/插件 - 导出.md b/static/md/插件 - 导出.md
deleted file mode 100644
index 148d698e..00000000
--- a/static/md/插件 - 导出.md	
+++ /dev/null
@@ -1,146 +0,0 @@
-# Vue.$export
-
-本框架集成了数据导出功能，并包装成插件
-
-## 注册插件
-
-> 默认已经注册，可以直接使用
-
-```
-import pluginExport from '@/plugin/export'
-Vue.use(pluginExport)
-```
-
-之后就可以在组件中使用 `this.$export` 来调用导出功能
-
-## Vue.$export.csv()
-
-此方法将数据以 `CSV` 格式导出，并且返回一个 `Promise` 对象
-
-使用
-
-```
-this.$export.csv({
-  columns,
-  data
-})
-  .then(() => {
-    // ...可选回调
-  })
-```
-
-参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| columns | 列 | 非 | Array |  | 空数组 |
-| data | 行数据 | 非 | Array |  | 空数组 |
-| table | 文件名 | 非 | String |  | table |
-| noHeader | 不导出表头 | 非 | Boolean |  | false |
-| separator | 数据分隔符 | 非 | String |  | , |
-| quoted | 每项数据是否加引号 | 非 | Boolean |  | false |
-
-示例
-
-```
-const columns = [
-  {
-    label: '姓名',
-    prop: 'name'
-  },
-  {
-    label: '年龄',
-    prop: 'age'
-  }
-]
-const data = [
-  {
-    name: 'lucy',
-    age: 24
-  },
-  {
-    name: 'bob',
-    age: 26
-  }
-]
-this.$export.csv({
-  columns,
-  data
-})
-```
-
-## Vue.$export.excel()
-
-此方法将数据以 `xlsx` 格式导出，并且返回一个 `Promise` 对象
-
-使用
-
-```
-this.$export.excel({
-  columns,
-  data
-})
-  .then(() => {
-    // ...可选回调
-  })
-```
-
-参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| columns | 列 | 非 | Array |  | 空数组 |
-| data | 行数据 | 非 | Array |  | 空数组 |
-| table | 文件名 | 非 | String |  | table |
-
-示例
-
-```
-const columns = [
-  {
-    label: '姓名',
-    prop: 'name'
-  },
-  {
-    label: '年龄',
-    prop: 'age'
-  }
-]
-const data = [
-  {
-    name: 'lucy',
-    age: 24
-  },
-  {
-    name: 'bob',
-    age: 26
-  }
-]
-this.$export.excel({
-  columns,
-  data
-})
-```
-
-## Vue.$export.txt()
-
-此方法将数据以 `txt` 格式导出，并且返回一个 `Promise` 对象
-
-使用
-
-```
-this.$export.txt({
-  text: '文本内容',
-  title: '文件名'
-})
-  .then(() => {
-    // ...可选回调
-  })
-```
-
-参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| text | 文件内容 | 非 | String |  | 空 |
-| title | 文件名 | 非 | String |  | 文本 |
diff --git a/static/md/组件 - markdown - 文档.md b/static/md/组件 - markdown - 文档.md
deleted file mode 100644
index 31a9a711..00000000
--- a/static/md/组件 - markdown - 文档.md	
+++ /dev/null
@@ -1,54 +0,0 @@
-## 参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| url | markdown文件地址 | 非 | String |  | 无 |
-| md | markdown内容 | 非 | String |  | 无 |
-| highlight | 代码高亮 | 非 | Boolean |  | false |
-| baidupan | 百度网盘分享链接显示优化 | 非 | Boolean |  | true |
-
-## 使用方法
-
-加载一个.md文件
-
-```
-<d2-markdown url="/static/md/xxxx.md"/>
-```
-
-加载资源
-
-```
-const md = `# Header
-
-## title
-
-text`
-
-<d2-markdown :md="md"/>
-```
-
-## 百度网盘分享链接优化
-
-当书写类似下面的分享链接时
-
-> 需要 `baidupan = true`
-
-```
-普通分享链接
-
-> https://pan.baidu.com/s/1kW6uUwB
-
-私密分享链接
-
-> 链接: https://pan.baidu.com/s/1ggFW21l 密码: 877y
-```
-
-markdown 中引用部分的文本由于被识别为百度云的分享链接，所以不会被当做 `blockquote` 渲染（非百度云链接的引用行不会改变），会以一种特别的块来显示
-
-就像这样
-
-> https://pan.baidu.com/s/1kW6uUwB
-
-上面的块会嵌套在你的 markdown 渲染结果中
-
-> 了解 D2Admin 是如何在 markdown 中匹配百度云链接的？ [查看源码](https://github.com/FairyEver/d2admin-vue-element/blob/master/src/components/core/Markdown/plugin/baidupan.js)
\ No newline at end of file
diff --git a/static/md/组件 - 代码高亮.md b/static/md/组件 - 代码高亮.md
deleted file mode 100644
index 2ababbb3..00000000
--- a/static/md/组件 - 代码高亮.md	
+++ /dev/null
@@ -1,13 +0,0 @@
-## 参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| code | 代码字符串 | 非 | String |  | console.log('you lost code prop') |
-
-## 示例
-
-```
-<d2-highlight code="alert('Hello')"/>
-```
-
-> 本框架只是提供代码高亮的简单实现，如需实现更高级的设置请修改组件代码
\ No newline at end of file
diff --git a/static/md/组件 - 图标组件 - svg.md b/static/md/组件 - 图标组件 - svg.md
deleted file mode 100644
index e9dd1a34..00000000
--- a/static/md/组件 - 图标组件 - svg.md	
+++ /dev/null
@@ -1,33 +0,0 @@
-## 参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| name | 图标名称 | 非 | String | 放在 src/assets/icons/svg 中的 .svg 文件名 | 空 |
-
-## 使用方法
-
-首先将下载的 .svg 图标放入 `src/assets/icons/svg` 文件夹下
-
-然后使用组件
-
-```
-<d2-icon-svg name="刚才的svg文件名"/>
-```
-
-## 获取已经注册的所有图标
-
-你已经发现了，只需要将图标文件放入项目中就会自动注册
-
-这是因为已经对 `webpack` 和 `svg-sprite-loader` 进行了相关设置，`src/assets/icons/svg` 文件夹中的图标会自动注册到项目中，文件全部打包成 svg-sprite，名称注册到 `Vue.$IconSvg` 属性中
-
-所以如果你需要检查项目中已经注册的所有图标，可以通过如下方式
-
-```
-// 在 vue 单文件组件中
-console.log(this.$IconSvg)
-```
-
-## 参考
-
-演示图标来源 [iconfont.cn @龙正昆《常用的50个4px双色图标库》](http://iconfont.cn/collections/detail?spm=a313x.7781069.1998910419.d9df05512&cid=4878)
-
diff --git a/static/md/组件 - 图标组件.md b/static/md/组件 - 图标组件.md
deleted file mode 100644
index 122c6418..00000000
--- a/static/md/组件 - 图标组件.md	
+++ /dev/null
@@ -1,39 +0,0 @@
-## 参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| name | 图标名称 | 非 | String | font-awesome 所有图标名 | font-awesome |
-
-## 使用方法
-
-基本
-
-```
-// 这样用没有毛病 但是也没什么用
-<d2-icon/>
-
-// 指定图标名称
-<d2-icon name="github"/>
-
-// 设置行内样式
-<d2-icon name="github" style="font-size: 100px;"/>
-
-// 设置 class
-<d2-icon name="github" class="icon-class-demo"/>
-```
-
-这个组件只是简化了写法而已
-
-```
-<d2-icon name="github"/>
-// 等同于
-<i class="fa fa-github" aria-hidden="true"></i>
-```
-
-## 参考
-
-图标索引
-
-[Font Awesome 中文网](http://www.fontawesome.com.cn/faicons/)
-
-[fontawesome.com](https://fontawesome.com/icons?d=gallery)
\ No newline at end of file
diff --git a/static/md/组件 - 图标选择器.md b/static/md/组件 - 图标选择器.md
deleted file mode 100644
index 61459cc6..00000000
--- a/static/md/组件 - 图标选择器.md	
+++ /dev/null
@@ -1,13 +0,0 @@
-# 图标选择器
-
-## 参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| value | 绑定的值，可以使用 v-model | 非 | String |  |  |
-| placeholder | 占位符，显示在未选择之前的按钮和输入框中 | 非 | String |  | 请选择 |
-| placement | 界面探出方向 | 非 | String | 同 Popover 组件 placement 参数 | right |
-| clearable | 是否允许清空 | 非 | Boolean |  | true |
-| userInput | 是否允许用户自由输入 | 非 | Boolean |  | false |
-| autoClose | 是否在选择后自动关闭 | 非 | Boolean |  | true |
-
diff --git a/static/md/组件 - 图表.md b/static/md/组件 - 图表.md
deleted file mode 100644
index 84ccd1bd..00000000
--- a/static/md/组件 - 图表.md	
+++ /dev/null
@@ -1,68 +0,0 @@
-## 介绍
-
-D2Admin 集成了由蚂蚁金服出品的 **G2** 图表库
-
-## 实现方式
-
-`src/components/charts/register.js` 为注册图表组件的文件
-
-`src/components/charts/G2` 为图表组件存放位置
-
-`src/components/charts/G2/mixins/G2.js` 是图表最主要的文件，这是一个所有的图表组件都会使用的 mixin，这个 mixin 主要有以下用途
-
- - 将 G2 和 DataSet 绑定到 data 上，方便组件使用，省去重复 `import G2 from '@antv/g2'` 等
- - 将 [G2 Chart类](http://antv.alipay.com/zh-cn/g2/3.x/api/chart.html#_Chart) 的属性全部暴露为 Vue 组件参数，这些参数会在初始化图表时用到
- - 提供了额外的设置参数，比如自动高度，自动初始化，初始化延时
- - 关闭 G2 的体验改进计划打点请求
- - data 上的 chart 对象
- - 自动初始化(或者不初始化)图表
- - `creatChart` 方法，根据参数设置生成 data 上的 chart 对象
- - `resize` 方法
-
-在图表组件中使用这个 mixin 示例
-
-```
-<template>
-  <!-- 如果需要开启自动高度功能 需要在这里设置 style="height: 100%;" -->
-  <div ref="chart" style="height: 100%;"></div>
-</template>
-
-<script>
-// 引入公用 mixin
-import G2 from '@/components/charts/G2/mixins/G2.js'
-export default {
-  mixins: [
-    G2
-  ],
-  methods: {
-    // 初始化图表
-    init () {
-      // mixin 中提供 creatChart 方法，这部分每个图表都一样
-      this.creatChart()
-      // 本组件的特殊设置 这部分每个图表不一样 你只需要改这部分内容
-      this.chart.source(this.data)
-      this.chart.coord().transpose()
-      this.chart.interval().position('x*y')
-      // 最后一步 渲染图表 这部分每个图表都一样
-      this.chart.render()
-    },
-    // 数据源改变 重新渲染新的数据
-    changeData () {
-      this.chart.changeData(this.data)
-    }
-  }
-}
-</script>
-```
-
-上面的代码段展示了如何使用 mixin 快速制作一个图表组件，只需根据某个图表的个性化需要，在组件中重新定义 `init` 和 `changeData` 方法即可
-
-你可以修改这个 mixin 去实现更多的功能，同时影响所有的图表组件
-
-> 这只仅仅是作者个人对于图表封装的一个实现思路
-
-## 为什么没有选择其他产品
-
-G2 完全可以胜任一般的后台界面报表图表需求，而且官网文档清晰友好
-
-如果你需要更酷炫的图表，也完全可以剔除集成的库，换用 百度的[echarts](http://echarts.baidu.com/) 或者超级强大的 [d3.js](https://d3js.org/)
diff --git a/static/md/组件 - 数字动画.md b/static/md/组件 - 数字动画.md
deleted file mode 100644
index 44c1797b..00000000
--- a/static/md/组件 - 数字动画.md	
+++ /dev/null
@@ -1,27 +0,0 @@
-## 参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| start | 起始值 | 非 | Number |  | 0 |
-| end | 结束值 | 是 | Number |  | 0 |
-| decimals | 小数位数 | 非 | Number |  | 0 |
-| duration | 持续时间 | 非 | Number |  | 2 |
-| options | 设置项 | 非 | Object |  | 空对象 |
-| callback | 回调函数 | 非 | Function |  | 空函数 |
-
-## 示例
-
-```
-// 基本使用方法
-<d2-count-up :end="100"/>
-
-// 设置始末值
-<d2-count-up :start="14" :end="100"/>
-
-// 设置动画时间
-<d2-count-up :end="100" :decimals="2"/>
-```
-
-组件会在页面上渲染 `<span>` 标签
-
-组件根据 [countUp.js](https://github.com/inorganik/countUp.js) 封装，`options` 参数详见原始插件文档
diff --git a/static/md/组件 - 页面容器.md b/static/md/组件 - 页面容器.md
deleted file mode 100644
index b3a6b5e8..00000000
--- a/static/md/组件 - 页面容器.md	
+++ /dev/null
@@ -1,36 +0,0 @@
-页面容器组件是每个页面的基础，为了在整个项目中统一效果，它应该是 `<template>` 组件的直接子组件
-
-## 参数
-
-| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
-| --- | --- | --- | --- | --- | --- |
-| type | 容器类型 | 非 | String | card ghost card-full | card |
-| responsive | 响应式宽度 | 非 | Boolean |  | false |
-
-> `responsive` 参数设置只在 `type` 等于 `card` 或 `ghost` 时生效
-
-## 使用方法
-
-一个基础单文件页面组件的示例
-
-```
-<template>
-  <d2-container>
-    <template slot="header">
-      可选的 header 内容 ...
-    </template>
-    主体内容 ...
-  </d2-container>
-</template>
-
-<script>
-export default {
-  name: 'your-component-name'
-}
-</script>
-
-<style lang="scss">
-// 需要的话引入
-@import '~@/assets/style/public.scss';
-</style>
-```
\ No newline at end of file

From fb2404fe7660282dd95e0233e849874391d07da9 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 21:01:00 +0800
Subject: [PATCH 32/33] no message

Former-commit-id: 77dbdfa7f01c725b08ba78a4c8e3361beeed5508
Former-commit-id: a3dd25ef792dfd2f361ed45f1526b2ee2d8bc0a6
Former-commit-id: 5d1d40f8267f4c6d91ee07042d53f0204c3754ce
---
 src/components/core/d2-layout-main/index.vue |  9 +++++++++
 src/store/modules/theme.js                   | 10 ++++++++++
 2 files changed, 19 insertions(+)

diff --git a/src/components/core/d2-layout-main/index.vue b/src/components/core/d2-layout-main/index.vue
index 94fd5a8f..15e4ee42 100644
--- a/src/components/core/d2-layout-main/index.vue
+++ b/src/components/core/d2-layout-main/index.vue
@@ -29,6 +29,7 @@
 </template>
 
 <script>
+import { mapMutations } from 'vuex'
 export default {
   name: 'd2-layout-main',
   components: {
@@ -44,6 +45,14 @@ export default {
       // [侧边栏宽度] 折叠状态
       asideWidthCollapse: '65px'
     }
+  },
+  mounted () {
+    this.loadTheme()
+  },
+  methods: {
+    ...mapMutations([
+      'loadTheme'
+    ])
   }
 }
 </script>
diff --git a/src/store/modules/theme.js b/src/store/modules/theme.js
index 6fc16a7a..f1ba0088 100644
--- a/src/store/modules/theme.js
+++ b/src/store/modules/theme.js
@@ -1,3 +1,5 @@
+import Cookies from 'js-cookie'
+
 export default {
   state: {
     list: [
@@ -15,6 +17,14 @@ export default {
     name: 'star'
   },
   mutations: {
+    loadTheme (state) {
+      const name = Cookies.get('themeName')
+      if (name) {
+        this.commit('setTheme', name)
+      } else {
+        this.commit('setTheme', state.list[0].value)
+      }
+    },
     // 设置主题
     setTheme (state, name) {
       state.name = name

From 870ec8b48aadbf76756d113149ea23e8eeb73489 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Mon, 11 Jun 2018 21:12:50 +0800
Subject: [PATCH 33/33] no message

Former-commit-id: 7bb5e62cb621d9a7e1d5d137ea1daf8e9bfbee74
Former-commit-id: 92e1ec9948b6bb6536eae3003b33b4fe9f1ff177
Former-commit-id: a30a575808b36631a6968d66afbeeaa8f183ce1c
---
 src/components/core/d2-layout-main/index.vue |  1 +
 src/components/core/d2-theme-list/index.vue  |  3 ---
 src/store/modules/theme.js                   | 19 ++++++++++++++++---
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/core/d2-layout-main/index.vue b/src/components/core/d2-layout-main/index.vue
index 15e4ee42..6493b856 100644
--- a/src/components/core/d2-layout-main/index.vue
+++ b/src/components/core/d2-layout-main/index.vue
@@ -47,6 +47,7 @@ export default {
     }
   },
   mounted () {
+    // 加载主题
     this.loadTheme()
   },
   methods: {
diff --git a/src/components/core/d2-theme-list/index.vue b/src/components/core/d2-theme-list/index.vue
index 5e79ec70..5abf11cd 100644
--- a/src/components/core/d2-theme-list/index.vue
+++ b/src/components/core/d2-theme-list/index.vue
@@ -24,9 +24,6 @@ export default {
       }
     }
   },
-  mounted () {
-    this.setTheme('d2')
-  },
   computed: {
     ...mapState({
       themeList: state => state.theme.list,
diff --git a/src/store/modules/theme.js b/src/store/modules/theme.js
index f1ba0088..5eae0945 100644
--- a/src/store/modules/theme.js
+++ b/src/store/modules/theme.js
@@ -14,20 +14,33 @@ export default {
         preview: '/static/image/theme-preview/star@2x.png'
       }
     ],
-    name: 'star'
+    name: ''
   },
   mutations: {
+    // 从 cookie 加载主题
     loadTheme (state) {
       const name = Cookies.get('themeName')
       if (name) {
-        this.commit('setTheme', name)
+        // 设置 store
+        state.name = name
+        // 激活主题
+        this.commit('activeTheme')
       } else {
+        // 设置新的主题为列表第一项
         this.commit('setTheme', state.list[0].value)
       }
     },
-    // 设置主题
+    // 设置新的主题
     setTheme (state, name) {
+      // 设置 store
       state.name = name
+      // 设置 Cookie
+      Cookies.set('themeName', name)
+      // 激活主题
+      this.commit('activeTheme')
+    },
+    // 激活当前主题
+    activeTheme (state) {
       document.body.className = `theme-${state.name}`
     }
   }