diff --git a/src/api/file-api.js b/src/api/file-api.js
index e50dc78..abaa2ee 100644
--- a/src/api/file-api.js
+++ b/src/api/file-api.js
@@ -107,6 +107,14 @@ export default {
       params
     })
   },
+  // 查找下级目录
+  listfiles: function(params) {
+    return request({
+      url: 'listfiles',
+      method: 'get',
+      params
+    })
+  },
   // 移动文件/文件夹
   move: function(params) {
     return request({
@@ -180,6 +188,14 @@ export default {
       params
     })
   },
+  // 通过filepath预览文本文件
+  previewTextByPath: function(params) {
+    return request({
+      url: '/preview/path/text',
+      method: 'get',
+      params
+    })
+  },
   // 预览文本文件
   previewText: function(params) {
     return request({
@@ -196,4 +212,12 @@ export default {
       params
     })
   },
+  // 解压文件
+  unzip: function(params) {
+    return request({
+      url: '/unzip',
+      method: 'get',
+      params
+    })
+  },
 }
diff --git a/src/components/FileTree/index.vue b/src/components/FileTree/index.vue
new file mode 100644
index 0000000..87cfdf1
--- /dev/null
+++ b/src/components/FileTree/index.vue
@@ -0,0 +1,201 @@
+<template>
+  <div>
+    <el-tree
+      ref="fileTree"
+      :data="directoryTreeData"
+      :node-key="localFileMode?'path':'id'"
+      :props="directoryTreeProps"
+      :load="localFileMode ? loadOfLocalFileMode : directoryTreeLoadNode"
+      :highlight-current="true"
+      :default-expanded-keys="defaultExpandedKeys"
+      :render-content="renderContent"
+      hight="100"
+      lazy
+      @node-click="treeNodeClick"
+      @node-expand="treeNodeExpand"
+    >
+    </el-tree>
+    <sim-text-preview :file="textPreviewRow" :status.sync="textPreviewVisible" :filepath="filepath"></sim-text-preview>
+  </div>
+</template>
+
+<script>
+  import api from '@/api/file-api'
+  import IconFile from "@/components/Icon/IconFile"
+  import SimTextPreview from "@/components/preview/SimTextPreview"
+  import { iconClass,suffix } from '@/utils/file-type'
+  export default {
+    name: "FileTree",
+    components: {IconFile,SimTextPreview},
+    props: {
+      directoryTreeData: {
+        type: Array,
+        default: () => []
+      },
+      localFileMode: { //本地文件模式, true:通过文件路径加载, false: 通用文件Id加载
+        type: Boolean,
+        default: true
+      },
+      tempDir: {
+        type: Boolean,
+        default: false
+      }
+    },
+    data() {
+      return {
+        textPreviewVisible : false,
+        textPreviewRow: {},
+        filepath: undefined,
+        directoryTreeProps: {
+          label: 'name',
+          children: 'children',
+          isLeaf: 'isLeaf'
+        }
+      }
+    },
+    computed: {
+      // 默认展开项
+      defaultExpandedKeys() {
+        if(!this.localFileMode){
+          return ['0']
+        }else{
+          let keys = []
+          this.directoryTreeData.forEach(file => {
+            keys.push(file.path)
+          })
+          return keys
+        }
+      },
+    },
+    methods: {
+      // 加载下一级文件树  localFileMode = true
+      loadOfLocalFileMode(node, resolve) {
+        if (node.level === 0) {
+          let elDialogWrapper = document.querySelector('.compressed-file-dialog')
+          console.log('elDialogWrapper', elDialogWrapper.style.zIndex)
+          elDialogWrapper.style.zIndex += 5
+          return resolve(this.directoryTreeData)
+        }
+        if (node.level > 0){
+          api.listfiles({
+            username: this.$store.state.user.name,
+            path: node.data.path,
+            tempDir: this.tempDir
+          }).then(res => {
+            const nextNodes = res.data
+            return resolve(nextNodes)
+          })
+        }
+      },
+      // 加载下一级文件树  localFileMode = false
+      directoryTreeLoadNode(node, resolve) {
+        let fileId = null
+        if (node.level === 0) {
+          const that = this
+          setTimeout(function () {
+            that.$refs.fileTree.setCurrentKey('0')
+          },0)
+          return resolve([{'id':"0",'name':'全部文件'}])
+        }
+        if (node.level > 1){
+          fileId = node.data.id
+        }
+        api.queryFileTree({
+          userId: this.$store.state.user.userId,
+          username: this.$store.state.user.name,
+          fileId: fileId,
+        }).then(res => {
+          const nextNodes = res.data
+          return resolve(nextNodes)
+        })
+      },
+      // 点击文件树
+      treeNodeClick(row) {
+        if(suffix.simText.includes(row.suffix)){
+          // 文本文件
+          this.textPreviewRow = row
+          this.textPreviewVisible = true
+          this.filepath = row.path
+        }
+      },
+      // 节点被展开时触发
+      treeNodeExpand(row,node,event) {
+      },
+      renderContent(h, { node, data, store }) {
+        if(data.newFolder){
+          return (
+            <span class="custom-tree-node">
+            <span><svg-icon icon-class="folder" /></span>
+            <span>
+            <div class="el-input el-input--mini el-input-tree">
+              <input type="text" autocomplete="on" value="新建文件夹" id="treeInput" class="el-input__inner"></input>
+            </div>
+            <button type="button" on-click={() => {
+              let path = '/'
+              let parentData = node.parent.data
+              if(parentData.path){
+                path = parentData.path + parentData.name + path
+              }
+              api.newFolder({
+                isFolder: true,
+                filename: data.name,
+                currentDirectory: path,
+                username: this.$store.state.user.name,
+                userId: this.$store.state.user.userId
+              }).then((res) => {
+                data.newFolder = false
+                data.id = res.data.id
+                console.log(data)
+              }).catch(() => {
+                window.event.preventDefault()
+                window.event.stopPropagation()
+              })
+            }}
+                    class="el-button el-icon-check el-button--mini el-input-tree-button" element-loading-spinner="el-icon-loading" element-loading-background="#f6f7fa88"></button>
+            <button type="button" on-click={() => {
+              this.$refs.fileTree.remove(node)
+              window.event.preventDefault()
+              window.event.stopPropagation()
+            }}
+                    class="el-button el-icon-close el-button--mini el-input-tree-button" element-loading-spinner="el-icon-loading" element-loading-background="#f6f7fa88"></button>
+            </span>
+            </span>);
+        }
+        if(node.expanded){
+          return (
+            <span class="custom-tree-node">
+            <svg-icon icon-class="open-folder" />
+            <span style="margin-left: 5px;">{node.label}</span>
+            <span>
+            </span>
+            </span>);
+        }else{
+          let iconClass = this.findIconClass(node.data)
+          return (
+            <span class="custom-tree-node">
+            <svg-icon icon-class={iconClass}/>
+            <span style="margin-left: 5px;">{node.label}</span>
+            <span>
+            </span>
+            </span>);
+        }
+      },
+      findIconClass(file){
+        if(file.isFolder){
+          return 'folder'
+        }
+        let suffix = file.suffix;
+        if(!suffix && file.name){
+          suffix = file.name.substring(file.name.lastIndexOf('.') + 1);
+        }
+        if(iconClass.has(suffix)){
+          return iconClass.get(suffix)
+        }
+        return 'file'
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/components/ShowFile/ShowFile.vue b/src/components/ShowFile/ShowFile.vue
index 544607e..74f2d2c 100644
--- a/src/components/ShowFile/ShowFile.vue
+++ b/src/components/ShowFile/ShowFile.vue
@@ -102,6 +102,37 @@
       </ul>
     </e-vue-contextmenu>
 
+    <el-dialog
+      class="open-file-dialog"
+      title="提示"
+      top="35vh"
+      :visible.sync="openCompressionVisible">
+      <svg-icon icon-class="open-folder"></svg-icon> <span class="dialog-msg">查看压缩文件</span>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" >解压到...</el-button>
+      <el-button size="small" @click="unzip(openingFile,openingFile.id,false)">解压到当前目录</el-button>
+      <el-button size="small" type="primary" @click=compressionFilePreview(openingFile)>预览</el-button>
+      </span>
+    </el-dialog>
+
+    <el-dialog
+      class="open-file-dialog"
+      title="提示"
+      top="35vh"
+      :visible.sync="notPreviewDialogVisible">
+      <svg-icon icon-class="warring"></svg-icon> <span class="dialog-msg">此文件不支持预览, 是否下载该文件?</span>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="small" @click="forciblyOpen(openingFile)">强行使用文本编辑器打开</el-button>
+      <el-button size="small" @click="notPreviewDialogVisible = false">取 消</el-button>
+      <el-button size="small" type="primary" @click=determineDownload(openingFile)>确 定</el-button>
+      </span>
+    </el-dialog>
+
+    <!--展示压缩文件-->
+    <el-dialog class="compressed-file-dialog" :title="'预览:'+compressedFileName" :visible.sync="compressedFileVisible">
+      <file-tree :directoryTreeData="compressedFileData" :tempDir="compressedFileTempDir"></file-tree>
+    </el-dialog>
+
     <!--移动或复制弹出框-->
     <el-dialog
       :title="'移动或复制到'+selectTreeNode.showName"
@@ -404,6 +435,9 @@
   import VideoPreview from "@/components/preview/VideoPreview";
   import AudioPreview from "@/components/preview/AudioPreview";
   import ButtonUpload from "@/components/button/ButtonUpload";
+
+  import FileTree from"@/components/FileTree"
+
   import '@/utils/directives.js'
 
   import 'pl-table/themes/index.css';
@@ -415,7 +449,8 @@
     components: {AudioPreview, VideoPreview, ImageViewer, SimTextPreview, IconFile, BreadcrumbFilePath, EmptyFile,
       PlTable,
       PlTableColumn,
-      ButtonUpload
+      ButtonUpload,
+      FileTree
     },
     props: {
       isCollectView: {
@@ -579,7 +614,10 @@
         cellMouseIndex: -1,
         editingIndex: -1,
         dialogMoveOrCopyVisible: false,
+        compressedFileVisible: false,
         directoryTreeData: [],
+        compressedFileData: [],
+        compressedFileName: '',
         selectTreeNode: {},
         directoryTreeProps: {
           label: 'name',
@@ -618,6 +656,10 @@
         dragElementList: [],
         drawFlag: false,
         fileListScrollTop: 0,
+        notPreviewDialogVisible: false,
+        openingFile: '',
+        openCompressionVisible: false,
+        compressedFileTempDir: false,
       }
     },
     computed: {
@@ -2356,8 +2398,43 @@
           }
         },300)
       },
+      // 预览压缩文件
+      compressionFilePreview(file){
+        this.unzip(file,undefined,true)
+      },
+      // 解压文件
+      unzip(file, destFileId, tempDir) {
+        let status = '解压'
+        let decompressing = this.$message({
+          iconClass: 'el-icon-loading',
+          type: 'info',
+          duration: 0,
+          dangerouslyUseHTMLString: true,
+          message: '<span>&nbsp;&nbsp;正在'+status+'</span>'
+        });
+        api.unzip({
+          fileId: file.id,
+          destFileId: destFileId
+        }).then((res) => {
+          decompressing.iconClass = null
+          decompressing.type = 'success'
+          decompressing.message = status+'成功'
+
+          this.compressedFileData = res.data
+          this.compressedFileVisible = true
+          this.compressedFileName = file.name
+          this.compressedFileTempDir = tempDir
+
+          setTimeout(function () {
+            decompressing.close()
+          },1000)
+        }).catch(() => {
+          decompressing.close()
+        })
+      },
       // 点击文件或文件夹
       fileClick(row) {
+        this.openingFile = row
         if (row.isFolder) {
           this.editingIndex = -1
           // 打开文件夹
@@ -2415,19 +2492,46 @@
             this.$router.push(`/public/articles/article?mark=${row.id}`)
             return
           }
+          if(suffix.compressedFile.includes(row.suffix)){
+            // this.unzip(row)
+            this.openCompressionVisible = true
+            return
+          }
           // 打开文件
           let fileIds = [row.id]
 
-          this.$confirm('此文件不支持预览, 是否下载该文件?', '提示', {
-            confirmButtonText: '确定',
-            cancelButtonText: '取消',
-            type: 'warning'
-          }).then(() => {
-            let url = process.env.VUE_APP_BASE_FILE_API + 'preview/' + row.name + '?jmal-token=' + this.$store.state.user.token + '&fileIds=' + fileIds
-            window.open(url, '_self')
-          })
+          this.notPreviewDialogVisible = true
+
+          // this.$confirm('此文件不支持预览, 是否下载该文件?', '提示', {
+          //   confirmButtonText: '确定',
+          //   cancelButtonText: '强行使用文本编辑器打开',
+          //   type: 'warning',
+          //   distinguishCancelAndClose: true
+          // }).then(() => {
+          //   let url = process.env.VUE_APP_BASE_FILE_API + 'preview/' + row.name + '?jmal-token=' + this.$store.state.user.token + '&fileIds=' + fileIds
+          //   window.open(url, '_self')
+          // }).catch(() => {
+          //   this.textPreviewRow = row
+          //   this.textPreviewVisible = true
+          // })
         }
-      }
+      },
+      // 强行使用文本编辑器打开
+      forciblyOpen(file) {
+        this.textPreviewRow = file
+        this.textPreviewVisible = true
+        const that = this
+        setTimeout(function () {
+          that.notPreviewDialogVisible = false
+        },100)
+      },
+      determineDownload(file) {
+        this.downLaod(file)
+        this.notPreviewDialogVisible = false
+      },
+      downLaod(file){
+        window.open(`${process.env.VUE_APP_BASE_FILE_API}preview/${file.name}?jmal-token=${this.$store.state.user.token}&fileIds=${file.id}`, '_self')
+      },
     }
   }
 </script>
@@ -2518,5 +2622,16 @@
   /deep/.el-input-tree-button {
     margin-left: 5px!important;
   }
+  /deep/.open-file-dialog {
+    .el-dialog {
+      width: 400px;
+    }
+    .svg-icon {
+      font-size: 20px;
+    }
+    .dialog-msg {
+      margin-left: 10px;
+    }
+  }
 </style>
 
diff --git a/src/components/preview/SimTextPreview.vue b/src/components/preview/SimTextPreview.vue
index e808c67..1a47f41 100644
--- a/src/components/preview/SimTextPreview.vue
+++ b/src/components/preview/SimTextPreview.vue
@@ -66,6 +66,10 @@
         type: String,
         default: undefined
       },
+      filepath: {
+        type: String,
+        default: undefined
+      },
       status: {
         type: Boolean,
         default: function () {
@@ -160,15 +164,20 @@
         if(this.shareId){
           request = 'sharePreviewText'
         }
+        if(this.filepath){
+          request = 'previewTextByPath'
+          this.options.readOnly = true
+        }
         api[request]({
           shareId: this.shareId,
           fileId: file.id,
           id: file.id,
+          path: this.filepath,
           username: this.$store.state.user.name
         }).then((res)=>{
-            this.loading.close()
-            this.textPreviewVisible = true
-            this.content = res.data.contentText
+          this.loading.close()
+          this.textPreviewVisible = true
+          this.content = res.data.contentText
         }).catch(() => {
           this.loading.close()
         })
@@ -256,7 +265,7 @@
         this.setTheme()
       },
       setTheme(){
-        let header = document.querySelector('.simtext-dialog .el-dialog__header')
+        let header = document.querySelector('.simtext-dialog .el-dialog .el-dialog__header')
         if(this.lightTheme){
           header.style.background = '#FFF'
           header.style.color = '#181818'
@@ -290,7 +299,6 @@
 <style lang="scss" scoped>
   @import "src/styles/markdown";
 
-
   /deep/.el-dialog {
     /*width: 1035px;*/
     margin: 0 !important;
diff --git a/src/icons/svg/warring.svg b/src/icons/svg/warring.svg
new file mode 100644
index 0000000..bb26a83
--- /dev/null
+++ b/src/icons/svg/warring.svg
@@ -0,0 +1 @@
+<svg t="1590740552858" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1150" width="128" height="128"><path d="M512 1024.056889a512.568889 512.568889 0 0 1-512-512 512.625778 512.625778 0 0 1 512-512 512.568889 512.568889 0 0 1 512 512 512.512 512.512 0 0 1-512 512z m0-284.444445a56.888889 56.888889 0 0 0-55.978667 46.762667A57.856 57.856 0 0 0 455.111111 796.444444a56.888889 56.888889 0 0 0 56.888889 56.888889 56.888889 56.888889 0 0 0 55.921778-46.762666 55.296 55.296 0 0 0 0.967111-10.069334 56.888889 56.888889 0 0 0-56.888889-56.888889z m0-560.64a52.679111 52.679111 0 0 0-47.843556 40.675556 42.496 42.496 0 0 0-0.796444 8.021333v357.262223a51.996444 51.996444 0 0 0 48.64 48.753777 53.020444 53.020444 0 0 0 48.753778-40.675555V227.612444a51.996444 51.996444 0 0 0-48.64-48.696888z" fill="#FFC320" p-id="1151"></path></svg>
diff --git a/src/utils/file-type.js b/src/utils/file-type.js
index c0e2d63..e2f3303 100644
--- a/src/utils/file-type.js
+++ b/src/utils/file-type.js
@@ -6,7 +6,10 @@ export const suffix = {
     'xml','xsl','iml','m','bas','prg','cmd',
     'sass','sas','php','lst','key','pem','log',
     'cmake','db','gradle','bat'
-  ]
+  ],
+  compressedFile: [
+    'zip'
+  ],
 }
 
 monaco.languages.getLanguages().forEach(language => {
diff --git a/src/views/nested/menu1/index.vue b/src/views/nested/menu1/index.vue
deleted file mode 100644
index 30cb670..0000000
--- a/src/views/nested/menu1/index.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-<template>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1">
-      <router-view />
-    </el-alert>
-  </div>
-</template>
diff --git a/src/views/nested/menu1/menu1-1/index.vue b/src/views/nested/menu1/menu1-1/index.vue
deleted file mode 100644
index 27e173a..0000000
--- a/src/views/nested/menu1/menu1-1/index.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-<template>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-1" type="success">
-      <router-view />
-    </el-alert>
-  </div>
-</template>
diff --git a/src/views/nested/menu1/menu1-2/index.vue b/src/views/nested/menu1/menu1-2/index.vue
deleted file mode 100644
index 0c86276..0000000
--- a/src/views/nested/menu1/menu1-2/index.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-<template>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-2" type="success">
-      <router-view />
-    </el-alert>
-  </div>
-</template>
diff --git a/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue b/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
deleted file mode 100644
index f87d88f..0000000
--- a/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template functional>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-2-1" type="warning" />
-  </div>
-</template>
diff --git a/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue b/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
deleted file mode 100644
index d88789f..0000000
--- a/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template functional>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-2-2" type="warning" />
-  </div>
-</template>
diff --git a/src/views/nested/menu1/menu1-3/index.vue b/src/views/nested/menu1/menu1-3/index.vue
deleted file mode 100644
index f7cd073..0000000
--- a/src/views/nested/menu1/menu1-3/index.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template functional>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-3" type="success" />
-  </div>
-</template>
diff --git a/src/views/nested/menu2/index.vue b/src/views/nested/menu2/index.vue
deleted file mode 100644
index 19dd48f..0000000
--- a/src/views/nested/menu2/index.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 2" />
-  </div>
-</template>
diff --git a/src/views/table/index.vue b/src/views/table/index.vue
deleted file mode 100644
index 7f08893..0000000
--- a/src/views/table/index.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<template>
-  <div v-html="htms"></div>
-</template>
-
-<script>
-  converter.setOption('tables', true);    // 将表格显示出来
-  export default {
-    data() {
-      return {
-        htms: ""
-      }
-    },
-    created() {
-      this.setMakedown()
-    },
-    methods: {
-      setMakedown() {
-        this.htms = converter.makeHtml('# 这是一个标题')
-      }
-    }
-  }
-</script>
diff --git a/src/views/test/360demo.html b/src/views/test/360demo.html
deleted file mode 100644
index 792d2e1..0000000
--- a/src/views/test/360demo.html
+++ /dev/null
@@ -1,184 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>Title</title>
-  <style>
-    .process-area {
-      width: 140px;
-      height: 140px;
-      background: #eee;
-      margin: auto;
-      border-radius: 50%;
-      position: relative;
-      transition: .5s;
-    }
-    .process-anime {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      border: 4px solid #fff;
-      transform: translate(-50%,-50%);
-      width: 130px;
-      height: 130px;
-      background: linear-gradient(45deg,#fde47c,#fdeca6);
-      border-radius: 50%;
-      overflow: hidden;
-    }
-    .process-anime .cube-a {
-      position: absolute;
-      left: 50%;
-      background: rgba(53,53,53,.3);
-      width: 130px;
-      height: 130px;
-      border-radius: 50px;
-      animation: fx-rotate 15s infinite linear;
-      transform-origin: 50% 50%;
-      transition: .5s;
-    }
-    .process-anime .cube-b {
-      position: absolute;
-      left: 50%;
-      background: #fff;
-      width: 130px;
-      height: 130px;
-      border-radius: 50px;
-      animation: fx-rotate 10s infinite reverse linear;
-      transform-origin: 50% 50%;
-      transition: .5s;
-    }
-
-    /**成功**/
-    .process-anime .done {
-      position: absolute;
-      width: 56px;
-      height: 56px;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%,-50%) scale(2.25);
-    }
-    .process-anime .done .checkmark {
-      width: 56px;
-      height: 56px;
-      border-radius: 50%;
-      display: block;
-      stroke-width: 2;
-      stroke: #fff;
-      stroke-miterlimit: 10;
-      box-shadow: inset 0 0 0 #fdda65;
-      animation: fill-data-v-93100324 .4s ease-in-out .4s forwards,scale-data-v-93100324 .3s ease-in-out .9s both;
-    }
-    .process-anime .done .checkmark__check {
-      transform: translate(2px,2px);
-      transform-origin: 50% 50%;
-      stroke-dasharray: 48;
-      stroke-dashoffset: 48;
-      animation: stroke-data-v-93100324 .3s cubic-bezier(.65,0,.45,1) .8s forwards;
-    }
-
-
-    *{
-      margin:0;
-    }
-    .box{
-      width: 130px;
-      height: 130px;
-      margin: 130px auto;
-      background-image: linear-gradient(-180deg, rgba(255,255,255,0.00) 0%, rgba(255,234,149,0.96) 68%);
-      border-radius: 100%;
-      overflow: hidden;
-      position: relative;
-    }
-    .box:before{
-      content: '';
-      width: 130px;
-      height: 130px;
-      background-image: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,234,149,0.96) 68%);
-      border-radius: 100%;
-      position: absolute;
-      left: 10px;
-      top: 10px;
-    }
-    /*.box:after{*/
-      /*content: '';*/
-      /*width: 160px;*/
-      /*height: 160px;*/
-      /*background-image: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,234,149,1) 50%);*/
-      /*border-radius: 100%;*/
-      /*position: absolute;*/
-      /*left: 20px;*/
-      /*top: 20px;*/
-    /*}*/
-    .wave{
-      margin-top: 0px;
-      width: 100%;
-      height: 210px;
-      position: relative;
-      overflow: hidden;
-      z-index: 2;
-    }
-    .parallax>use {
-      animation: wave-move 5s linear infinite;
-      animation-duration: 1.5s;
-    }
-    .parallax>use:nth-child(1) {
-      animation-delay: -.5s;
-    }
-    .parallax>use:nth-child(2) {
-      animation-delay: -.9s;
-    }
-    .parallax>use:nth-child(3) {
-      animation-delay: -1.5s;
-    }
-    @keyframes wave-move {
-      0% {
-        transform: translate(90px,0);
-      }
-      100% {
-        transform: translate(-85px,0);
-      }
-    }
-    @keyframes fx-rotate {
-      0% {
-        transform: translate(-50%) rotate(0);
-      }
-      100% {
-        transform: translate(-50%,2px) rotate(365deg);
-      }
-    }
-  </style>
-</head>
-<body>
-
-<div class="process-area">
-  <div class="process-anime">
-    <div class="cube-a" style="top: -60%;"></div>
-    <div class="cube-b" style="top: -60%;"></div><!----></div>
-
-    <div data-v-93100324="" class="done">
-      <svg xmlns="http://www.w3.org/2000/svg" class="done-icon checkmark">
-        <path d="M14.1 27.2l7.1 7.2 16.7-16.8" class="checkmark__check" style="fill: transparent;"></path>
-      </svg>
-    </div>
-</div>
-
-<div class="box">
-  <svg class="wave" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 200 210">
-    <defs>
-      <path id="wave-shape" stroke="rgba(255,255,255,.8)" stroke-width=".5" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 58-18 88-18 58 18 88 18 v185h-528z"></path>
-    </defs>
-    <g class="parallax">
-      <use xlink:href="#wave-shape" x="50" y="0" fill="url(#linear)"></use>
-      <use xlink:href="#wave-shape" x="50" y="3" fill="url(#linear)"></use>
-      <use xlink:href="#wave-shape" x="50" y="6" fill="url(#linear)"></use>
-    </g>
-    <defs>
-      <linearGradient id="linear" x1="0%" y1="0%" x2="100%" y2="0%" gradientTransform="rotate(90)">
-        <stop offset="10%"   stop-color="#FDD936" stop-opacity="0.4" />
-        <stop offset="80%" stop-color="#E6911B" stop-opacity="0.8" />
-      </linearGradient>
-    </defs>
-  </svg>
-</div>
-</body>
-</html>
diff --git a/src/views/test/js点击触发动画.html b/src/views/test/js点击触发动画.html
deleted file mode 100644
index 84c102c..0000000
--- a/src/views/test/js点击触发动画.html
+++ /dev/null
@@ -1,31 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <style>
-    #aaa {
-      width: 100px;
-      height: 100px;
-      background: blue;
-      transition: all 2s;
-      -moz-transition: all 2s; /* Firefox 4 */
-      -webkit-transition: all 2s; /* Safari and Chrome */
-      -o-transition: all 2s; /* Opera */
-    }
-  </style>
-  <script>
-    function big() {
-      document.getElementById("aaa").style.width = "300px";
-      document.getElementById("aaa").style.height = "300px";
-    }
-    function small() {
-      document.getElementById("aaa").style.width = "100px";
-      document.getElementById("aaa").style.height = "100px";
-    }
-  </script>
-</head>
-<body>
-<button onclick="big()">Big</button>
-<button onclick="small()">Small</button>
-<div id="aaa"></div>
-</body>
-</html>
diff --git a/src/views/test/test.html b/src/views/test/test.html
deleted file mode 100644
index 1e8903a..0000000
--- a/src/views/test/test.html
+++ /dev/null
@@ -1,206 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <meta http-equiv="X-UA-Compatible" content="ie=edge">
-  <title>js仿360桌面悬浮球拖拽到边缘自动贴边特效</title>
-
-  <style>
-    * {
-      margin: 0;
-      padding: 0;
-      list-style: none;
-    }
-
-    html,
-    body {
-      width: 100%;
-      height: 100%;
-    }
-
-    #drag-ball {
-      width: 100px;
-      height: 100px;
-      background: #ddd;
-      position: fixed;
-      cursor: move;
-      box-sizing: border-box;
-      border: 4px solid #66cc66;
-      border-radius: 50%;
-      background: url('test.jpeg') no-repeat center center;
-      background-size: 100% 100%;
-      overflow: hidden;
-    }
-  </style>
-
-</head>
-<body>
-
-<div id="drag-ball"></div>
-
-<script>
-
-  // 自动吸附距离
-  var marginOffset = 50;
-
-  var ball = document.querySelector('#drag-ball');
-  var ballWidth = ball.offsetWidth;
-  var ballHeight = ball.offsetHeight;
-  var cuntWidth = 0;
-  var cuntHeight = 0;
-  // ball.style.left = parseInt(Math.random() * (document.body.offsetWidth - ballWidth)) + 'px';
-  // ball.style.top = parseInt(Math.random() * (document.body.offsetHeight - ballHeight)) + 'px';
-
-  function move(obj, w, h) {
-    if (obj.direction === 'left') {
-      obj.style.left = 0 - w + 'px';
-    } else if (obj.direction === 'right') {
-      obj.style.left = document.body.offsetWidth - ballWidth + w + 'px';
-    }
-    if (obj.direction === 'top') {
-      obj.style.top = 0 - h + 'px';
-    } else if (obj.direction === 'bottom') {
-      obj.style.top = document.body.offsetHeight - ballHeight + h + 'px';
-    }
-  }
-
-  function rate(obj, a) {
-    obj.style.transform = ' rotate(' + a + ')'
-  }
-
-  function action(obj) {
-
-    var dir = obj.direction;
-
-    switch (dir) {
-      case 'left':
-        rate(obj, '90deg');
-        break;
-      case 'right':
-        rate(obj, '-90deg');
-        break;
-      case 'top':
-        rate(obj, '-180deg');
-        break;
-      default:
-        rate(obj, '-0');
-        break;
-    }
-
-  }
-
-  function ballMove(ballDynamicLeft,ballDynamicTop) {
-    cuntWidth = 0;
-    cuntHeight = 0;
-    ball.direction = '';
-    ball.style.transition = '';
-    ball.style.left = ballDynamicLeft + 'px';
-    ball.style.top = ballDynamicTop + 'px';
-    if (ballDynamicLeft < marginOffset) {
-      ball.direction = 'left';
-      if (ballDynamicLeft < 1) {
-        move(ball, 0, 0);
-      }
-    }
-    if (ballDynamicTop < marginOffset) {
-      ball.direction = 'top';
-      if (ballDynamicTop < 1) {
-        move(ball, 0, 0);
-      }
-    }
-    if (ballDynamicLeft > document.body.offsetWidth - ballWidth - marginOffset) {
-      ball.direction = 'right';
-      if (ballDynamicLeft > document.body.offsetWidth - ballWidth - 1) {
-        move(ball, 0, 0);
-      }
-    }
-    if (ballDynamicTop > document.body.offsetHeight - ballHeight - marginOffset) {
-      ball.direction = 'bottom';
-      if (ballDynamicTop > document.body.offsetHeight - ballHeight - 1) {
-        move(ball, 0, 0);
-      }
-    }
-  }
-
-  /***
-   * 移动端
-   */
-  ball.addEventListener('touchstart', function (e) {
-    var ballLeft = e.touches[0].clientX - ball.offsetLeft;
-    var ballTop = e.touches[0].clientY - ball.offsetTop;
-    move(this, 0, 0);
-    rate(this, 0)
-    document.addEventListener('touchmove', function (e) {
-      var ballDynamicLeft = e.touches[0].clientX - ballLeft
-      var ballDynamicTop = e.touches[0].clientY - ballTop
-      ballMove(ballDynamicLeft,ballDynamicTop)
-    })
-  })
-
-  ball.addEventListener('touchend', function () {
-    this.style.transition = '.5s';
-    move(this, ballWidth / 2, ballHeight / 2);
-    action(this);
-  })
-
-  /***
-   * pc端
-   */
-  ball.onmousedown = function (e) {
-    var ballLeft = e.clientX - ball.offsetLeft;
-    var ballTop = e.clientY - ball.offsetTop;
-    document.onmousemove = function (e) {
-      cuntWidth = 0;
-      cuntHeight = 0;
-      var ballDynamicLeft = e.clientX - ballLeft
-      var ballDynamicTop = e.clientY - ballTop
-      ballMove(ballDynamicLeft,ballDynamicTop)
-    }
-  }
-
-  ball.onmouseover = function () {
-    move(this, 0, 0);
-    rate(this, 0)
-  }
-
-  ball.onmouseout = function () {
-    move(this, ballWidth / 2, ballHeight / 2);
-    action(this);
-  }
-
-  ball.onmouseup = function () {
-    document.onmousemove = null;
-    this.style.transition = '.5s';
-    move(this, ballWidth / 2, ballHeight / 2);
-    action(this);
-  }
-
-  window.onresize = function () {
-    var bodyH = document.body.offsetHeight;
-    var ballTop = ball.offsetTop;
-    var bodyW = document.body.offsetWidth;
-    var ballLeft = ball.offsetLeft;
-
-    if (ballTop + ballHeight > bodyH) {
-      ball.style.top = bodyH - ballHeight + 'px';
-      cuntHeight++;
-    }
-    if (bodyH > ballTop && cuntHeight > 0) {
-      ball.style.top = bodyH - ballHeight + 'px';
-    }
-    if (ballLeft + ballWidth > bodyW) {
-      ball.style.left = bodyW - ballWidth + 'px';
-      cuntWidth++;
-    }
-    if (bodyW > ballLeft && cuntWidth > 0) {
-      ball.style.left = bodyW - ballWidth + 'px';
-    }
-    move(ball, ballWidth / 2, ballHeight / 2);
-  }
-
-
-
-</script>
-</body>
-</html>
diff --git a/src/views/test/test.jpeg b/src/views/test/test.jpeg
deleted file mode 100644
index 12c8a0e..0000000
Binary files a/src/views/test/test.jpeg and /dev/null differ
diff --git a/src/views/test/图片上加文字.html b/src/views/test/图片上加文字.html
deleted file mode 100644
index f411796..0000000
--- a/src/views/test/图片上加文字.html
+++ /dev/null
@@ -1,29 +0,0 @@
-<!DOCTYPE html>
-<html lang=en>
-<title>Example of DataTransfer.setDragImage()</title>
-<meta name="viewport" content="width=device-width">
-<style>
-  div {
-    margin: 0em;
-    padding: 2em;
-  }
-  #source {
-    color: blue;
-    border: 1px solid black;
-  }
-  #target {
-    border: 1px solid black;
-  }
-</style>
-<script>
-</script>
-<body>
-<img src="../../assets/img/moveFile.png">
-<h1>Example of <code>DataTransfer.setDragImage()</code></h1>
-<div>
-  <p id="source" ondragstart="dragstart_handler(event);" draggable="true">
-    Select this element, drag it to the Drop Zone and then release the selection to move the element.</p>
-</div>
-<div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">Drop Zone</div>
-</body>
-</html>
diff --git a/src/views/test/悬浮小球不旋转.html b/src/views/test/悬浮小球不旋转.html
deleted file mode 100644
index a0c542b..0000000
--- a/src/views/test/悬浮小球不旋转.html
+++ /dev/null
@@ -1,281 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <meta http-equiv="X-UA-Compatible" content="ie=edge">
-  <title>悬浮小球不旋转</title>
-
-  <style>
-    * {
-      margin: 0;
-      padding: 0;
-      list-style: none;
-    }
-
-    html,
-    body {
-      width: 100%;
-      height: 100%;
-    }
-
-    /*#drag-ball {*/
-      /*width: 100px;*/
-      /*height: 100px;*/
-      /*position: fixed;*/
-      /*cursor: pointer;*/
-      /*box-sizing: border-box;*/
-      /*border-radius: 50%;*/
-      /*background-size: 100% 100%;*/
-      /*overflow: hidden;*/
-    /*}*/
-
-    .process-area {
-      width: 100px;
-      height: 100px;
-      cursor: pointer;
-      background: #eee;
-      margin: auto;
-      overflow: hidden;
-      background-size: 100% 100%;
-      border-radius: 50%;
-      position: fixed;
-      transition: .5s;
-    }
-    .process-anime {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      border: 4px solid #fff;
-      transform: translate(-50%,-50%);
-      width: 90px;
-      height: 90px;
-      background: linear-gradient(45deg,#fde47c,#fdeca6);
-      border-radius: 50%;
-      overflow: hidden;
-    }
-    .process-anime .cube-a {
-      position: absolute;
-      left: 50%;
-      background: rgba(53,53,53,.3);
-      width: 130px;
-      height: 130px;
-      border-radius: 50px;
-      animation: fx-rotate 15s infinite linear;
-      transform-origin: 50% 50%;
-      transition: .5s;
-    }
-    .process-anime .cube-b {
-      position: absolute;
-      left: 50%;
-      background: #fff;
-      width: 130px;
-      height: 130px;
-      border-radius: 50px;
-      animation: fx-rotate 10s infinite reverse linear;
-      transform-origin: 50% 50%;
-      transition: .5s;
-    }
-
-    @keyframes fx-rotate {
-      0% {
-        transform: translate(-50%) rotate(0);
-      }
-      100% {
-        transform: translate(-50%,2px) rotate(365deg);
-      }
-    }
-  </style>
-
-</head>
-<body>
-
-<!--<div id="drag-ball"></div>-->
-
-<div class="process-area" id="drag-ball">
-  <div class="process-anime">
-    <div class="cube-a" style="top: -70%;"></div>
-    <div class="cube-b" style="top: -70%;"></div><!----></div>
-
-  <!--<div data-v-93100324="" class="done">-->
-  <!--<svg xmlns="http://www.w3.org/2000/svg" class="done-icon checkmark">-->
-  <!--<path d="M14.1 27.2l7.1 7.2 16.7-16.8" class="checkmark__check" style="fill: transparent;"></path>-->
-  <!--</svg>-->
-  <!--</div>-->
-</div>
-
-<script>
-
-  // 自动吸附距离
-  var marginOffset = 100;
-
-  var ball = document.querySelector('#drag-ball');
-  var ballWidth = ball.offsetWidth;
-  var ballHeight = ball.offsetHeight;
-  var cuntWidth = 0;
-  var cuntHeight = 0;
-  // ball.style.left = parseInt(Math.random() * (document.body.offsetWidth - ballWidth)) + 'px';
-  // ball.style.top = parseInt(Math.random() * (document.body.offsetHeight - ballHeight)) + 'px';
-
-  function move(obj, w, h) {
-    if (obj.direction === 'left') {
-      obj.style.left = 0 - w + 'px';
-    } else if (obj.direction === 'right') {
-      obj.style.left = document.body.offsetWidth - ballWidth + w + 'px';
-    }
-    if (obj.direction === 'top') {
-      obj.style.top = 0 - h + 'px';
-    } else if (obj.direction === 'bottom') {
-      obj.style.top = document.body.offsetHeight - ballHeight + h + 'px';
-    }
-  }
-
-  function rate(obj, a) {
-    obj.style.transform = ' rotate(' + a + ')'
-  }
-
-  function action(obj) {
-
-    var dir = obj.direction;
-
-    switch (dir) {
-      case 'left':
-        rate(obj, '90deg');
-        break;
-      case 'right':
-        rate(obj, '-90deg');
-        break;
-      case 'top':
-        rate(obj, '-180deg');
-        break;
-      default:
-        rate(obj, '-0');
-        break;
-    }
-
-  }
-
-  function ballMove(ballDynamicLeft,ballDynamicTop) {
-    cuntWidth = 0;
-    cuntHeight = 0;
-    ball.direction = '';
-    ball.style.transition = '';
-    ball.style.left = ballDynamicLeft + 'px';
-    ball.style.top = ballDynamicTop + 'px';
-    if (ballDynamicLeft < marginOffset) {
-      ball.direction = 'left';
-      if (ballDynamicLeft < 1) {
-        move(ball, 0, 0);
-      }
-    }
-    if (ballDynamicTop < marginOffset) {
-      ball.direction = 'top';
-      if (ballDynamicTop < 1) {
-        move(ball, 0, 0);
-      }
-    }
-    if (ballDynamicLeft > document.body.offsetWidth - ballWidth - marginOffset) {
-      ball.direction = 'right';
-      if (ballDynamicLeft > document.body.offsetWidth - ballWidth - 1) {
-        move(ball, 0, 0);
-      }
-    }
-    if (ballDynamicTop > document.body.offsetHeight - ballHeight - marginOffset) {
-      ball.direction = 'bottom';
-      if (ballDynamicTop > document.body.offsetHeight - ballHeight - 1) {
-        move(ball, 0, 0);
-      }
-    }
-  }
-
-  /***
-   * 移动端
-   */
-  ball.addEventListener('touchstart', function (e) {
-    var ballLeft = e.touches[0].clientX - ball.offsetLeft;
-    var ballTop = e.touches[0].clientY - ball.offsetTop;
-    move(this, 0, 0);
-    rate(this, 0)
-    document.addEventListener('touchmove', function (e) {
-      var ballDynamicLeft = e.touches[0].clientX - ballLeft
-      var ballDynamicTop = e.touches[0].clientY - ballTop
-      ballMove(ballDynamicLeft,ballDynamicTop)
-    })
-  })
-
-  ball.addEventListener('touchend', function () {
-    this.style.transition = '.5s';
-    move(this, ballWidth / 2, ballHeight / 2);
-    action(this);
-  })
-
-
-  /***
-   * pc端
-   */
-  ball.onmousedown = function (e) {
-    console.log('onmousedown')
-    var ballLeft = e.clientX - ball.offsetLeft;
-    var ballTop = e.clientY - ball.offsetTop;
-    document.onmousemove = function (e) {
-      console.log('onmousemove')
-      cuntWidth = 0;
-      cuntHeight = 0;
-      var ballDynamicLeft = e.clientX - ballLeft
-      var ballDynamicTop = e.clientY - ballTop
-      ballMove(ballDynamicLeft,ballDynamicTop)
-    }
-  }
-
-  ball.onclick = function() {
-    console.log('click')
-  }
-
-  ball.onmouseover = function () {
-    console.log('onmouseover')
-    move(this, 0, 0);
-    rate(this, 0)
-  }
-
-  ball.onmouseout = function () {
-    console.log('onmouseout')
-    move(this, ballWidth / 2, ballHeight / 2);
-    // action(this);
-  }
-
-  ball.onmouseup = function () {
-    console.log('onmouseup')
-    document.onmousemove = null;
-    this.style.transition = '.5s';
-    move(this, ballWidth / 2, ballHeight / 2);
-    // action(this);
-  }
-
-  window.onresize = function () {
-    var bodyH = document.body.offsetHeight;
-    var ballTop = ball.offsetTop;
-    var bodyW = document.body.offsetWidth;
-    var ballLeft = ball.offsetLeft;
-
-    if (ballTop + ballHeight > bodyH) {
-      ball.style.top = bodyH - ballHeight + 'px';
-      cuntHeight++;
-    }
-    if (bodyH > ballTop && cuntHeight > 0) {
-      ball.style.top = bodyH - ballHeight + 'px';
-    }
-    if (ballLeft + ballWidth > bodyW) {
-      ball.style.left = bodyW - ballWidth + 'px';
-      cuntWidth++;
-    }
-    if (bodyW > ballLeft && cuntWidth > 0) {
-      ball.style.left = bodyW - ballWidth + 'px';
-    }
-    move(ball, ballWidth / 2, ballHeight / 2);
-  }
-
-
-
-</script>
-</body>
-</html>
diff --git a/src/views/test/拖拽.html b/src/views/test/拖拽.html
deleted file mode 100644
index ddae795..0000000
--- a/src/views/test/拖拽.html
+++ /dev/null
@@ -1,53 +0,0 @@
-<!DOCTYPE html>
-<html lang=en>
-<title>Example of DataTransfer.setDragImage()</title>
-<meta name="viewport" content="width=device-width">
-<style>
-  div {
-    margin: 0em;
-    padding: 2em;
-  }
-  #source {
-    color: blue;
-    border: 1px solid black;
-  }
-  #target {
-    border: 1px solid black;
-  }
-</style>
-<script>
-  function dragstart_handler(ev) {
-    console.log("dragStart");
-    // 设置拖动的格式和数据。使用事件目标的id作为数据
-    // ev.dataTransfer.setData("text/plain", ev.target.id);
-    // 创建一个图像并且使用它作为拖动图像
-    // 请注意： 改变 "example.gif" 为一个已经存在的图片
-    // 或者，一个还没有创建出来的图片，那么浏览器将会使用默认的拖动图片
-    // 译者注：默认的拖动图片与拖动对象没有联系。一般是一个小型文件图标
-    let img = new Image();
-    img.src = 'https://www.google.com.hk/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png';
-    ev.dataTransfer.setDragImage(img, 10, 10);
-  }
-
-  function dragover_handler(ev) {
-    console.log("dragOver");
-    ev.preventDefault();
-  }
-
-  function drop_handler(ev) {
-    console.log("Drop");
-    ev.preventDefault();
-    // 获取拖放目标的id数据
-    let data = ev.dataTransfer.getData("text");
-    ev.target.appendChild(document.getElementById(data));
-  }
-</script>
-<body>
-<h1>Example of <code>DataTransfer.setDragImage()</code></h1>
-<div>
-  <p id="source" ondragstart="dragstart_handler(event);" draggable="true">
-    Select this element, drag it to the Drop Zone and then release the selection to move the element.</p>
-</div>
-<div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">Drop Zone</div>
-</body>
-</html>
diff --git a/src/views/test/画矩形.html b/src/views/test/画矩形.html
deleted file mode 100644
index 55e4326..0000000
--- a/src/views/test/画矩形.html
+++ /dev/null
@@ -1,76 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
-<head>
-  <title>鼠标拖动画矩形</title>
-  <meta http-equiv="content-type" content="text/htmlcharset=utf-8">
-  <style type="text/css">
-    /*body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0padding:0}*/
-    /*html{color:#000overflow-y:scolloverflow:-moz-scrollbars-vertical}*/
-    /*.draw-rectangle{position:absolute border:1px dashed #2898ff width:0px height:0pxleft:0px top:0px overflow:hidden}*/
-    /*.retc{position:absolute border:1px solid #CCCCCC overflow:hidden background:#EFEFEF}*/
-  </style>
-</head>
-<body style="text-align:center;">
-  <div id="ddd" style="margin:0 auto;margin-top:100px;text-align: center;width: 500px;height: 5000px; border:1px solid #000000;"></div>
-</body>
-<script language = "javascript">
-
-  let $$ = function(id){
-    return document.getElementById(id)
-  }
-  let draw = $$('ddd')
-  let wId = "rectangle1"
-  let startX = 0, startY = 0
-  let flag = false
-  let retcLeft = 0, retcTop = 0, retcHeight = 0, retcWidth = 0
-  draw.onmousedown = function(e){
-
-    flag = true
-    let evt = window.event || e
-    console.log('evt',evt)
-    let scrollTop = draw.scrollTop || draw.scrollTop
-    let scrollLeft = draw.scrollLeft || draw.scrollLeft
-    startX = evt.clientX + scrollLeft
-    startY = evt.clientY + scrollTop
-    let div = document.createElement("div")
-    div.id = wId
-    div.className = "draw-rectangle"
-    div.style.left = evt.x + "px"
-    div.style.top = evt.y + "px"
-    div.style.position = 'absolute'
-    div.style.border = '1px dashed #2898ff'
-    div.style.width = '0px'
-    div.style.height = '0px'
-    div.style.left = '0px'
-    div.style.top = '0px'
-    div.style.overflow = 'hidden'
-    draw.appendChild(div)
-
-    document.onmousemove = function(e){
-      if(flag){
-        let evt = window.event || e
-        let scrollTop = document.body.scrollTop || document.documentElement.scrollTop
-        let scrollLeft = document.body.scrollLeft || document.documentElement.scrollLeft
-        retcLeft = (startX - evt.clientX - scrollLeft > 0 ? evt.clientX + scrollLeft : startX)
-        retcTop = (startY - evt.clientY - scrollTop > 0 ? evt.clientY + scrollTop : startY)
-        retcHeight = Math.abs(startY - evt.clientY - scrollTop)
-        retcWidth = Math.abs(startX - evt.clientX - scrollLeft)
-        $$(wId).style.left = retcLeft + 'px'
-        $$(wId).style.top = retcTop + 'px'
-        $$(wId).style.width = retcWidth + 'px'
-        $$(wId).style.height = retcHeight + 'px'
-        $$(wId).style.backgroundColor = '#f2f5fa55'
-      }
-    }
-
-  }
-  document.onmouseup = function(){
-    flag = false
-    if($$(wId)){
-      console.log('left',retcLeft, 'top',retcTop, 'width',retcWidth, 'hieght',retcHeight)
-      // draw.removeChild($$(wId))
-    }
-  }
-</script>
-</html>
diff --git a/src/views/tree/index.vue b/src/views/tree/index.vue
deleted file mode 100644
index 89c6b01..0000000
--- a/src/views/tree/index.vue
+++ /dev/null
@@ -1,78 +0,0 @@
-<template>
-  <div class="app-container">
-    <el-input v-model="filterText" placeholder="Filter keyword" style="margin-bottom:30px;" />
-
-    <el-tree
-      ref="tree2"
-      :data="data2"
-      :props="defaultProps"
-      :filter-node-method="filterNode"
-      class="filter-tree"
-      default-expand-all
-    />
-
-  </div>
-</template>
-
-<script>
-export default {
-
-  data() {
-    return {
-      filterText: '',
-      data2: [{
-        id: 1,
-        label: 'Level one 1',
-        children: [{
-          id: 4,
-          label: 'Level two 1-1',
-          children: [{
-            id: 9,
-            label: 'Level three 1-1-1'
-          }, {
-            id: 10,
-            label: 'Level three 1-1-2'
-          }]
-        }]
-      }, {
-        id: 2,
-        label: 'Level one 2',
-        children: [{
-          id: 5,
-          label: 'Level two 2-1'
-        }, {
-          id: 6,
-          label: 'Level two 2-2'
-        }]
-      }, {
-        id: 3,
-        label: 'Level one 3',
-        children: [{
-          id: 7,
-          label: 'Level two 3-1'
-        }, {
-          id: 8,
-          label: 'Level two 3-2'
-        }]
-      }],
-      defaultProps: {
-        children: 'children',
-        label: 'label'
-      }
-    }
-  },
-  watch: {
-    filterText(val) {
-      this.$refs.tree2.filter(val)
-    }
-  },
-
-  methods: {
-    filterNode(value, data) {
-      if (!value) return true
-      return data.label.indexOf(value) !== -1
-    }
-  }
-}
-</script>
-
diff --git a/src/views/upload/index.vue b/src/views/upload/index.vue
deleted file mode 100644
index f74d133..0000000
--- a/src/views/upload/index.vue
+++ /dev/null
@@ -1,65 +0,0 @@
-<template>
-  <!-- 背景图高斯模糊效果 -->
-  <div class="bgFilter">
-    <div class="box">
-      <img src="http://t8.baidu.com/it/u=2247852322,986532796&fm=79&app=86&size=h300&n=0&g=4n&f=jpeg?sec=1582723247&t=3060bfc4978e78d3accef89c1eb7dc8e" alt="img" class="bg">
-      <div class="content">
-        <!-- <img src="http://t8.baidu.com/it/u=2247852322,986532796&fm=79&app=86&size=h300&n=0&g=4n&f=jpeg?sec=1582723247&t=3060bfc4978e78d3accef89c1eb7dc8e" alt="img"> -->
-        <div class="text">我是文字我是文字我是文字</div>
-      </div>
-    </div>
-  </div>
-</template>
-<script>
-  export default {
-    name: "bgFilter"
-  };
-</script>
-<style lang="scss" scoped>
-  .bgFilter {
-    width: 100%;
-    height: 100%;
-    background-color: #000;
-    .box {
-      width: 700px;
-      height: 500px;
-      position: relative;
-      // 我是模糊的背景
-      .bg {
-        width: 100%;
-        height: 100%;
-        position: absolute;
-        left: 0;
-        top: 0;
-        overflow: hidden;
-        -webkit-filter: blur(8px);
-        -moz-filter: blur(8px);
-        -o-filter: blur(8px);
-        -ms-filter: blur(8px);
-        filter: blur(8px);
-      }
-      // 我是图片和上面的文字
-      .content {
-        .text {
-          width: 100%;
-          padding: 30px;
-          box-sizing: border-box;
-          background-color: rgba(255, 255, 255, 0.7);
-          position: absolute;
-          top: 50%;
-          left: 50%;
-          transform: translate(-50%, -50%);
-          z-index: 1;
-          text-align: right;
-        }
-        img {
-          position: absolute;
-          top: 50%;
-          left: 5%;
-          transform: translate(0, -50%);
-          z-index: 2;
-        }
-      }
-    }
-  }
-</style>