diff --git a/docs/zh/components/count-up.md b/docs/zh/components/count-up.md
index d88a3ce9..a8f1844b 100644
--- a/docs/zh/components/count-up.md
+++ b/docs/zh/components/count-up.md
@@ -15,13 +15,13 @@
 
 ``` vue
 // 基本使用方法
-<d2-count-up :end="100"></d2-count-up>
+<d2-count-up :end="100"/>
 
 // 设置始末值
-<d2-count-up :start="14" :end="100"></d2-count-up>
+<d2-count-up :start="14" :end="100"/>
 
 // 设置动画时间
-<d2-count-up :end="100" :decimals="2"></d2-count-up>
+<d2-count-up :end="100" :decimals="2"/>
 ```
 
 组件会在页面上渲染 `<span>` 标签
diff --git a/docs/zh/components/highlight.md b/docs/zh/components/highlight.md
index e68c8de1..275f0bca 100644
--- a/docs/zh/components/highlight.md
+++ b/docs/zh/components/highlight.md
@@ -9,7 +9,7 @@
 ## 示例
 
 ``` vue
-<d2-highlight code="alert('Hello')"></d2-highlight>
+<d2-highlight code="alert('Hello')"/>
 ```
 
 ::: tip
diff --git a/docs/zh/components/icon-svg.md b/docs/zh/components/icon-svg.md
index 69273a35..a9616141 100644
--- a/docs/zh/components/icon-svg.md
+++ b/docs/zh/components/icon-svg.md
@@ -13,7 +13,7 @@
 然后使用组件
 
 ``` vue
-<d2-icon-svg name="刚才的svg文件名"></d2-icon-svg>
+<d2-icon-svg name="刚才的svg文件名"/>
 ```
 
 ## 获取已经注册的所有图标
diff --git a/docs/zh/components/icon.md b/docs/zh/components/icon.md
index 414d08f5..aae2eab4 100644
--- a/docs/zh/components/icon.md
+++ b/docs/zh/components/icon.md
@@ -12,22 +12,22 @@
 
 ``` vue
 // 这样用没有毛病 但是也没什么用
-<d2-icon></d2-icon>
+<d2-icon/>
 
 // 指定图标名称
-<d2-icon name="github"></d2-icon>
+<d2-icon name="github"/>
 
 // 设置行内样式
-<d2-icon name="github" style="font-size: 100px;"></d2-icon>
+<d2-icon name="github" style="font-size: 100px;"/>
 
 // 设置 class
-<d2-icon name="github" class="icon-class-demo"></d2-icon>
+<d2-icon name="github" class="icon-class-demo"/>
 ```
 
 这个组件只是简化了写法而已
 
 ``` vue
-<d2-icon name="github"></d2-icon>
+<d2-icon name="github"/>
 // 等同于
 <i class="fa fa-github" aria-hidden="true"></i>
 ```
diff --git a/src/components/core/MainLayout/components/HeaderRight/components/FullScreen.vue b/src/components/core/MainLayout/components/HeaderRight/components/FullScreen.vue
new file mode 100644
index 00000000..da2344e2
--- /dev/null
+++ b/src/components/core/MainLayout/components/HeaderRight/components/FullScreen.vue
@@ -0,0 +1,28 @@
+<template>
+  <el-tooltip
+    class="item"
+    effect="dark"
+    :content="isFullScreen ? '退出全屏' : '全屏'"
+    placement="bottom">
+    <el-button class="d2-mr btn-text" type="text" @click="toggleFullScreen">
+      <d2-icon v-if="isFullScreen" name="compress"/>
+      <d2-icon v-else name="arrows-alt"/>
+    </el-button>
+  </el-tooltip>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+export default {
+  computed: {
+    ...mapState({
+      isFullScreen: state => state.fullScreen.isFullScreen
+    })
+  },
+  methods: {
+    ...mapMutations([
+      'toggleFullScreen'
+    ])
+  }
+}
+</script>
diff --git a/src/components/core/MainLayout/components/HeaderRight/components/UserDropdown.vue b/src/components/core/MainLayout/components/HeaderRight/components/UserDropdown.vue
new file mode 100644
index 00000000..808dc81c
--- /dev/null
+++ b/src/components/core/MainLayout/components/HeaderRight/components/UserDropdown.vue
@@ -0,0 +1,33 @@
+<template>
+  <el-dropdown class="d2-mr">
+    <span class="el-dropdown-link">你好</span>
+    <el-dropdown-menu slot="dropdown">
+      <el-dropdown-item @click.native="logOff"><d2-icon name="power-off"/> 注销</el-dropdown-item>
+      <el-dropdown-item><d2-icon name="user-circle-o"/> 个人中心</el-dropdown-item>
+    </el-dropdown-menu>
+  </el-dropdown>
+</template>
+
+<script>
+import Cookies from 'js-cookie'
+export default {
+  methods: {
+    logOff () {
+      this.$confirm('注销此账户吗?', '注销', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        // 删除cookie
+        Cookies.remove('token')
+        // 跳转路由
+        this.$router.push({
+          name: 'login'
+        })
+      }).catch(() => {
+        // 取消了注销
+      })
+    }
+  }
+}
+</script>
diff --git a/src/components/core/d2-container-full/index.vue b/src/components/core/d2-container-full/index.vue
index d02c0b4e..7432efcc 100644
--- a/src/components/core/d2-container-full/index.vue
+++ b/src/components/core/d2-container-full/index.vue
@@ -1,13 +1,13 @@
 <template>
   <div class="d2-container-full" :style="cardStyle">
     <div v-if="$slots.header" class="d2-container-full__header" ref="header">
-      <slot name="header"></slot>
+      <slot name="header"/>
     </div>
     <div class="d2-container-full__body" :style="bodyStyle">
-      <slot></slot>
+      <slot/>
     </div>
     <div v-if="$slots.footer" class="d2-container-full__footer" ref="footer">
-      <slot name="footer"></slot>
+      <slot name="footer"/>
     </div>
   </div>
 </template>
diff --git a/src/components/core/d2-container/index.vue b/src/components/core/d2-container/index.vue
index 466f9fb3..71bb2f08 100644
--- a/src/components/core/d2-container/index.vue
+++ b/src/components/core/d2-container/index.vue
@@ -2,19 +2,19 @@
   <div class="container-component" :class="{responsive}">
     <!-- [card] 卡片容器 -->
     <el-card v-if="type === 'card'" class="d2-mr d2-mb">
-      <slot v-if="$slots.header" name="header" slot="header"></slot>
-      <slot></slot>
+      <slot v-if="$slots.header" name="header" slot="header"/>
+      <slot/>
     </el-card>
     <!-- [ghost] 隐形的容器 -->
     <div v-if="type === 'ghost'" class="d2-mr d2-mb">
-      <slot name="header"></slot>
-      <slot></slot>
+      <slot name="header"/>
+      <slot/>
     </div>
     <!-- [container-full] 撑满 -->
     <d2-container-full v-if="type === 'full'" :right="20" :bottom="0">
-      <slot v-if="$slots.header" name="header" slot="header"></slot>
-      <slot></slot>
-      <slot v-if="$slots.footer" name="footer" slot="footer"></slot>
+      <slot v-if="$slots.header" name="header" slot="header"/>
+      <slot/>
+      <slot v-if="$slots.footer" name="footer" slot="footer"/>
     </d2-container-full>
   </div>
 </template>
diff --git a/src/components/core/d2-layout-main/components/-header-right/components/FullScreen.vue b/src/components/core/d2-layout-main/components/-header-right/components/FullScreen.vue
index ab7136d0..da2344e2 100644
--- a/src/components/core/d2-layout-main/components/-header-right/components/FullScreen.vue
+++ b/src/components/core/d2-layout-main/components/-header-right/components/FullScreen.vue
@@ -5,8 +5,8 @@
     :content="isFullScreen ? '退出全屏' : '全屏'"
     placement="bottom">
     <el-button class="d2-mr btn-text" type="text" @click="toggleFullScreen">
-      <d2-icon v-if="isFullScreen" name="compress"></d2-icon>
-      <d2-icon v-else name="arrows-alt"></d2-icon>
+      <d2-icon v-if="isFullScreen" name="compress"/>
+      <d2-icon v-else name="arrows-alt"/>
     </el-button>
   </el-tooltip>
 </template>
diff --git a/src/components/core/d2-layout-main/components/-header-right/components/UserDropdown.vue b/src/components/core/d2-layout-main/components/-header-right/components/UserDropdown.vue
index 5b12e6f6..808dc81c 100644
--- a/src/components/core/d2-layout-main/components/-header-right/components/UserDropdown.vue
+++ b/src/components/core/d2-layout-main/components/-header-right/components/UserDropdown.vue
@@ -2,8 +2,8 @@
   <el-dropdown class="d2-mr">
     <span class="el-dropdown-link">你好</span>
     <el-dropdown-menu slot="dropdown">
-      <el-dropdown-item @click.native="logOff"><d2-icon name="power-off"></d2-icon> 注销</el-dropdown-item>
-      <el-dropdown-item><d2-icon name="user-circle-o"></d2-icon> 个人中心</el-dropdown-item>
+      <el-dropdown-item @click.native="logOff"><d2-icon name="power-off"/> 注销</el-dropdown-item>
+      <el-dropdown-item><d2-icon name="user-circle-o"/> 个人中心</el-dropdown-item>
     </el-dropdown-menu>
   </el-dropdown>
 </template>
diff --git a/src/components/demo/PageIndexArticle/index.vue b/src/components/demo/PageIndexArticle/index.vue
index 76d40583..2b9c66d6 100644
--- a/src/components/demo/PageIndexArticle/index.vue
+++ b/src/components/demo/PageIndexArticle/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="page-index-article-body">
     <div class="page-index-article-body__logo">
-      <slot></slot>
+      <slot/>
     </div>
     <p class="page-index-article-body__title">{{title}}</p>
     <p class="page-index-article-body__sub-title d2-mt-0">{{subTitle}}</p>
diff --git a/src/pages/demo/chart/demo/components/ChartDemoCard.vue b/src/pages/demo/chart/demo/components/ChartDemoCard.vue
index 4d16decb..e9b26f5d 100644
--- a/src/pages/demo/chart/demo/components/ChartDemoCard.vue
+++ b/src/pages/demo/chart/demo/components/ChartDemoCard.vue
@@ -2,7 +2,7 @@
   <el-card>
     <div slot="header">
       <el-button type="primary" size="mini" @click="syncData">
-        <d2-icon name="refresh"></d2-icon>
+        <d2-icon name="refresh"/>
         加载数据
       </el-button>
       <el-radio-group v-model="height" size="mini">
@@ -10,7 +10,7 @@
       </el-radio-group>
     </div>
     <div :style="style">
-      <slot :data="data"></slot>
+      <slot :data="data"/>
     </div>
   </el-card>
 </template>
diff --git a/src/pages/demo/components/countup/index.vue b/src/pages/demo/components/countup/index.vue
index 89537a14..8baf119f 100644
--- a/src/pages/demo/components/countup/index.vue
+++ b/src/pages/demo/components/countup/index.vue
@@ -11,7 +11,7 @@
         <el-card>
           <p slot="title">只设置目标数字</p>
           <div class="group">
-            <d2-count-up :end="100"></d2-count-up>  
+            <d2-count-up :end="100"/>  
           </div>
         </el-card>
       </el-col>
@@ -19,7 +19,7 @@
         <el-card>
           <p slot="title">设置起止数值</p>
           <div class="group">
-            <d2-count-up :start="14" :end="100"></d2-count-up>
+            <d2-count-up :start="14" :end="100"/>
           </div>
         </el-card>
       </el-col>
@@ -27,7 +27,7 @@
         <el-card>
           <p slot="title">小数位数</p>
           <div class="group">
-            <d2-count-up :end="100" :decimals="2"></d2-count-up>
+            <d2-count-up :end="100" :decimals="2"/>
           </div>
         </el-card>
       </el-col>
@@ -35,7 +35,7 @@
         <el-card>
           <p slot="title">动画时长</p>
           <div class="group">
-            <d2-count-up :end="100" :duration="6"></d2-count-up>
+            <d2-count-up :end="100" :duration="6"/>
           </div>
         </el-card>
       </el-col>
@@ -43,7 +43,7 @@
         <el-card>
           <p slot="title">回调函数</p>
           <div class="group">
-            <d2-count-up :end="100" :callback="() => {className = 'end'}" :class="className"></d2-count-up>
+            <d2-count-up :end="100" :callback="() => {className = 'end'}" :class="className"/>
           </div>
         </el-card>
       </el-col>
@@ -51,7 +51,7 @@
         <el-card>
           <p slot="title">结束一秒后更新数值</p>
           <div class="group">
-            <d2-count-up :end="end" :callback="update"></d2-count-up>
+            <d2-count-up :end="end" :callback="update"/>
           </div>
         </el-card>
       </el-col>
diff --git a/src/pages/demo/components/editor-quill/index.vue b/src/pages/demo/components/editor-quill/index.vue
index 1c96cacc..910f7218 100644
--- a/src/pages/demo/components/editor-quill/index.vue
+++ b/src/pages/demo/components/editor-quill/index.vue
@@ -15,7 +15,7 @@
     </el-card>
     <el-card>
       <template slot="header">输出</template>
-      <d2-highlight :code="formated"></d2-highlight>
+      <d2-highlight :code="formated"/>
     </el-card>
   </d2-container>
 </template>
diff --git a/src/pages/demo/components/highlight/index.vue b/src/pages/demo/components/highlight/index.vue
index e998f258..bd20d7d4 100644
--- a/src/pages/demo/components/highlight/index.vue
+++ b/src/pages/demo/components/highlight/index.vue
@@ -8,25 +8,25 @@
     </el-card>
     <el-card class="d2-mb">
       <p slot="title">javascript</p>
-      <d2-highlight :code="codeJavascript"></d2-highlight>
+      <d2-highlight :code="codeJavascript"/>
     </el-card>
     <el-row :gutter="20">
       <el-col :span="8">
         <el-card class="d2-mb">
           <p slot="title">css</p>
-          <d2-highlight :code="codeCSS"></d2-highlight>
+          <d2-highlight :code="codeCSS"/>
         </el-card>
       </el-col>
       <el-col :span="8">
         <el-card class="d2-mb">
           <p slot="title">scss</p>
-          <d2-highlight :code="codeSCSS"></d2-highlight>
+          <d2-highlight :code="codeSCSS"/>
         </el-card>
       </el-col>
       <el-col :span="8">
         <el-card class="d2-mb">
           <p slot="title">html</p>
-          <d2-highlight :code="codeHTML"></d2-highlight>
+          <d2-highlight :code="codeHTML"/>
         </el-card>
       </el-col>
     </el-row>
diff --git a/src/pages/demo/components/icon/components/IconCell.vue b/src/pages/demo/components/icon/components/IconCell.vue
index 80196643..48f1c8e4 100644
--- a/src/pages/demo/components/icon/components/IconCell.vue
+++ b/src/pages/demo/components/icon/components/IconCell.vue
@@ -54,7 +54,7 @@ export default {
       return `<i class="fa fa-${this.icon}" aria-hidden="true"></i>`
     },
     iconComponent () {
-      return `<d2-icon name="${this.icon}"></d2-icon>`
+      return `<d2-icon name="${this.icon}"/>`
     }
   },
   methods: {
diff --git a/src/pages/demo/components/icon/icon.vue b/src/pages/demo/components/icon/icon.vue
index 0ad219b4..ffd92d2e 100644
--- a/src/pages/demo/components/icon/icon.vue
+++ b/src/pages/demo/components/icon/icon.vue
@@ -6,10 +6,10 @@
         title="图标组件"
         url="https://github.com/FairyEver/d2admin-vue-element/blob/master/src/components/core/Icon/index.vue">
       </PageHeader>
-      <d2-icon></d2-icon>
-      <d2-icon name="github"></d2-icon>
-      <d2-icon name="github" style="font-size: 100px;"></d2-icon>
-      <d2-icon name="github" class="icon-class-demo"></d2-icon>
+      <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"/>
diff --git a/src/pages/demo/components/icon/select.vue b/src/pages/demo/components/icon/select.vue
index 061873ec..82a3ba77 100644
--- a/src/pages/demo/components/icon/select.vue
+++ b/src/pages/demo/components/icon/select.vue
@@ -16,7 +16,7 @@
           <template v-else>未选择</template>
         </p>
       </div>
-      <d2-icon-select v-model="icon"></d2-icon-select>
+      <d2-icon-select v-model="icon"/>
       <div class="title-group">
         <p class="title">用户可以输入</p>
         <p class="sub-title">
@@ -27,7 +27,7 @@
           <template v-else>未选择</template>
         </p>
       </div>
-      <d2-icon-select v-model="icon2" :user-input="true"></d2-icon-select>
+      <d2-icon-select v-model="icon2" :user-input="true"/>
     </el-card>
     <el-card>
       <d2-markdown url="/static/md/组件 - 图标选择器.md"/>
diff --git a/src/pages/demo/components/icon/svg.vue b/src/pages/demo/components/icon/svg.vue
index f4f8d4b2..6a584676 100644
--- a/src/pages/demo/components/icon/svg.vue
+++ b/src/pages/demo/components/icon/svg.vue
@@ -7,7 +7,7 @@
       </PageHeader>
       <el-row>
         <el-col class="icon-card" :span="4" v-for="(icon, index) in $IconSvg" :key="index">
-          <d2-icon-svg class="icon" :name="icon"></d2-icon-svg>
+          <d2-icon-svg class="icon" :name="icon"/>
           <div class="icon-title">
             <span>{{icon}}</span>
           </div>
diff --git a/src/pages/demo/plugins/export/table.vue b/src/pages/demo/plugins/export/table.vue
index e6345463..22691373 100644
--- a/src/pages/demo/plugins/export/table.vue
+++ b/src/pages/demo/plugins/export/table.vue
@@ -6,11 +6,11 @@
     </PageHeader>
     <div class="d2-mb">
       <el-button type="primary" @click="exportCsv">
-        <d2-icon name="download"></d2-icon>
+        <d2-icon name="download"/>
         导出 CSV
       </el-button>
       <el-button type="primary" @click="exportExcel">
-        <d2-icon name="download"></d2-icon>
+        <d2-icon name="download"/>
         导出 Excel
       </el-button>
     </div>
diff --git a/src/pages/demo/plugins/export/txt.vue b/src/pages/demo/plugins/export/txt.vue
index 7acffb07..01a33ad5 100644
--- a/src/pages/demo/plugins/export/txt.vue
+++ b/src/pages/demo/plugins/export/txt.vue
@@ -12,7 +12,7 @@
     </el-input>
     <div class="d2-mt d2-mb">
       <el-button type="primary" @click="exportTxt">
-        <d2-icon name="download"></d2-icon>
+        <d2-icon name="download"/>
         保存为 txt
       </el-button>
     </div>
diff --git a/src/pages/demo/plugins/import/csv.vue b/src/pages/demo/plugins/import/csv.vue
index 0356de94..f9bc7d0a 100644
--- a/src/pages/demo/plugins/import/csv.vue
+++ b/src/pages/demo/plugins/import/csv.vue
@@ -7,14 +7,14 @@
     </PageHeader>
     <div class="d2-mb">
       <el-button @click="download">
-        <d2-icon name="download"></d2-icon>
+        <d2-icon name="download"/>
         下载演示 .csv 表格
       </el-button>
     </div>
     <div class="d2-mb">
       <el-upload :before-upload="handleUpload" action="default">
         <el-button type="success">
-          <d2-icon name="file-o"></d2-icon>
+          <d2-icon name="file-o"/>
           选择要导入的 .csv 表格
         </el-button>
       </el-upload>
diff --git a/src/pages/demo/plugins/import/xlsx.vue b/src/pages/demo/plugins/import/xlsx.vue
index 1a555a0e..82cf8091 100644
--- a/src/pages/demo/plugins/import/xlsx.vue
+++ b/src/pages/demo/plugins/import/xlsx.vue
@@ -7,14 +7,14 @@
     </PageHeader>
     <div class="d2-mb">
       <el-button @click="download">
-        <d2-icon name="download"></d2-icon>
+        <d2-icon name="download"/>
         下载演示 .xlsx 表格
       </el-button>
     </div>
     <div class="d2-mb">
       <el-upload :before-upload="handleUpload" action="default">
         <el-button type="success">
-          <d2-icon name="file-o"></d2-icon>
+          <d2-icon name="file-o"/>
           选择要导入的 .xlsx 表格
         </el-button>
       </el-upload>
diff --git a/src/pages/demo/plugins/mock/components/MockDemoCard.vue b/src/pages/demo/plugins/mock/components/MockDemoCard.vue
index 81ffc448..585df91c 100644
--- a/src/pages/demo/plugins/mock/components/MockDemoCard.vue
+++ b/src/pages/demo/plugins/mock/components/MockDemoCard.vue
@@ -9,12 +9,12 @@
     <el-row :gutter="10">
       <el-col :span="12">
         <div class="col col-l">
-          <d2-highlight :code="code"></d2-highlight>
+          <d2-highlight :code="code"/>
         </div>
       </el-col>
       <el-col :span="12">
         <div class="col col-r">
-          <d2-highlight :code="mock"></d2-highlight>
+          <d2-highlight :code="mock"/>
         </div>
       </el-col>
     </el-row>
diff --git a/static/md/组件 - 代码高亮.md b/static/md/组件 - 代码高亮.md
index 0feb72ec..2ababbb3 100644
--- a/static/md/组件 - 代码高亮.md	
+++ b/static/md/组件 - 代码高亮.md	
@@ -7,7 +7,7 @@
 ## 示例
 
 ```
-<d2-highlight code="alert('Hello')"></d2-highlight>
+<d2-highlight code="alert('Hello')"/>
 ```
 
 > 本框架只是提供代码高亮的简单实现，如需实现更高级的设置请修改组件代码
\ No newline at end of file
diff --git a/static/md/组件 - 图标组件 - svg.md b/static/md/组件 - 图标组件 - svg.md
index 44164e28..e9dd1a34 100644
--- a/static/md/组件 - 图标组件 - svg.md	
+++ b/static/md/组件 - 图标组件 - svg.md	
@@ -11,7 +11,7 @@
 然后使用组件
 
 ```
-<d2-icon-svg name="刚才的svg文件名"></d2-icon-svg>
+<d2-icon-svg name="刚才的svg文件名"/>
 ```
 
 ## 获取已经注册的所有图标
diff --git a/static/md/组件 - 图标组件.md b/static/md/组件 - 图标组件.md
index d593cef6..122c6418 100644
--- a/static/md/组件 - 图标组件.md	
+++ b/static/md/组件 - 图标组件.md	
@@ -10,22 +10,22 @@
 
 ```
 // 这样用没有毛病 但是也没什么用
-<d2-icon></d2-icon>
+<d2-icon/>
 
 // 指定图标名称
-<d2-icon name="github"></d2-icon>
+<d2-icon name="github"/>
 
 // 设置行内样式
-<d2-icon name="github" style="font-size: 100px;"></d2-icon>
+<d2-icon name="github" style="font-size: 100px;"/>
 
 // 设置 class
-<d2-icon name="github" class="icon-class-demo"></d2-icon>
+<d2-icon name="github" class="icon-class-demo"/>
 ```
 
 这个组件只是简化了写法而已
 
 ```
-<d2-icon name="github"></d2-icon>
+<d2-icon name="github"/>
 // 等同于
 <i class="fa fa-github" aria-hidden="true"></i>
 ```
diff --git a/static/md/组件 - 数字动画.md b/static/md/组件 - 数字动画.md
index 31a3a7d6..44c1797b 100644
--- a/static/md/组件 - 数字动画.md	
+++ b/static/md/组件 - 数字动画.md	
@@ -13,13 +13,13 @@
 
 ```
 // 基本使用方法
-<d2-count-up :end="100"></d2-count-up>
+<d2-count-up :end="100"/>
 
 // 设置始末值
-<d2-count-up :start="14" :end="100"></d2-count-up>
+<d2-count-up :start="14" :end="100"/>
 
 // 设置动画时间
-<d2-count-up :end="100" :decimals="2"></d2-count-up>
+<d2-count-up :end="100" :decimals="2"/>
 ```
 
 组件会在页面上渲染 `<span>` 标签