refine

src/styles/index.scss

@@ -73,9 +73,10 @@ a:hover {
 
 code {
   background: #eef1f6;
-  padding: 20px 10px;
+  padding: 15px 10px;
   margin-bottom: 20px;
   display: block;
+  line-height: 36px;
   a {
     color: #337ab7;
     cursor: pointer;

src/views/charts/index.vue

@@ -1,5 +1,7 @@
 <template>
   <div class="components-container" >
-    介绍
+    <code>
+      这里的所有的图表都基于echarts,实例代码来源<a href='http://gallery.echartsjs.com/explore.html#sort=rank~timeframe=all~author=all' target='_blank'>gallery</a><br/>其实echarts封装的很好了，用vue封装是很简单的事情，建议大家自己来封装。
+    </code>
   </div>
 </template>

src/views/components/index.vue

@@ -1,5 +1,7 @@
 <template>
-  <div class="components-container" >
-    介绍
+  <div class="components-container">
+    <code>这里暂时列出了自己在项目中自己封装和用到的组件，如有补充可以提<a href='https://github.com/PanJiaChen/vue-element-admin/issues' target='_blank'>issue</a><br/>
+    我个人崇尚自己封装组件，因为很多组件会和业务后高度的耦合，很多时候第三方封装是满足不了需求的，如有需要可以看楼主之前写过的一篇<a href='https://segmentfault.com/a/1190000009090836' target='_blank'>文章</a>
+    </code>
   </div>
 </template>

src/views/theme/index.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="app-container">
+    <code>会补动态换肤的教程</code>
     <el-card class="box-card">
       <div slot="header">
         <span style="line-height: 36px;">偏好设置</span>
@@ -23,19 +24,19 @@
     </div>
 
     <div class="block">
-      <el-tag v-for="tag in tags" :type="tag.type">
+      <el-tag class='tag-item' v-for="tag in tags" :type="tag.type">
         {{tag.name}}
       </el-tag>
     </div>
 
     <div class="block">
-      <el-alert title="成功提示的文案" type="success">
+      <el-alert class='alert-item' title="成功提示的文案" type="success">
       </el-alert>
-      <el-alert title="消息提示的文案" type="info">
+      <el-alert class='alert-item' title="消息提示的文案" type="info">
       </el-alert>
-      <el-alert title="警告提示的文案" type="warning">
+      <el-alert class='alert-item' title="警告提示的文案" type="warning">
       </el-alert>
-      <el-alert title="错误提示的文案" type="error">
+      <el-alert class='alert-item' title="错误提示的文案" type="error">
       </el-alert>
     </div>
 
@@ -82,4 +83,10 @@ export default {
 .block{
   padding: 30px 24px;
 }
+.alert-item{
+  margin-bottom: 10px;
+}
+.tag-item{
+  margin-right: 15px;
+}
 </style>