diff --git a/src/layout/index.vue b/src/layout/index.vue
index a8da8d500c861a3b7d32a8b3acf79b1efab5ef52..1c525b45705953dea265b4af60f68d49a54b7e30 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -1471,10 +1471,7 @@ export default {
       // 删除之前先暂停当前上传
       this.pause(file)
       // 删除 element 上传组件维护的上传列队
-      let uploadFiles = this.$refs.elementUpload.uploadFiles
-      let index = uploadFiles.findIndex(item => item.uid === file.uid)
-      uploadFiles.splice(index, 1)
-
+      this.$refs.elementUpload.handleRemove(file)
       // 删除当前上传列队中的文件数据
       this.uploadedFilesList.splice(this.uploadedFilesList.findIndex(item => item.uid === file.uid), 1)
     },
@@ -1482,6 +1479,17 @@ export default {
      * 上传重试事件
      */
     retry (file) {
+      // 先删除 element 上传组件维护的上传列队
+      this.$refs.elementUpload.handleRemove(file)
+      // 再 push 一条记录
+      this.$refs.elementUpload.uploadFiles.push({
+        status: 'ready',
+        name: file.name,
+        size: file.request.file.size,
+        percentage: 0,
+        uid: file.uid,
+        raw: file.request.file
+      })
       this.resume(file)
     },
     /**
diff --git a/src/utils/utils.js b/src/utils/utils.js
index d9bbccf4a5eaa82273b565c4e743d4e9d020b189..7bc5f3f044c5ab9bdd9c956f7b5de686596c9e22 100644
--- a/src/utils/utils.js
+++ b/src/utils/utils.js
@@ -61,6 +61,7 @@ const typeToSvg = {
   'audio/amr': 'file-list-audio',
   'application/mathml+xml': 'file',
   'text/html': 'file-list-html',
+  'text/x-sh': 'file-list-html',
   'message/rfc822': 'file-list-html',
   'multipart/related': 'file-list-html',
   'application/x-iso9660-image': 'file-list-cd',
@@ -165,6 +166,8 @@ const typeToSvg = {
   'application/rdf+xml': 'file',
   'video/x-ms-wvx': 'file',
   'audio/mpeg': 'file-list-audio',
+  'audio/mp3': 'file-list-audio',
+  'audio/x-m4a': 'file-list-audio',
   'video/x-ms-wmv': 'file-list-video',
   'application/vnd.oasis.opendocument.text': 'file',
   'application/x-bcpio': 'file',
diff --git a/src/views/file/index.vue b/src/views/file/index.vue
index 04cdf9179ad20df1ca1d28178e100c2ff0fbd281..d47d7436085f67472be6557e995b6c6ccef283d5 100644
--- a/src/views/file/index.vue
+++ b/src/views/file/index.vue
@@ -91,12 +91,19 @@
       </div>
     </div>
 
+    <!-- 登录页的Dialog弹窗 -->
+    <el-dialog :visible.sync="login.show"
+               customClass="loginDialog" :before-close="closeLoginModel">
+      <loginPanel :hopRouting="false" @loginSuccessfully="loginSuccessfully"></loginPanel>
+    </el-dialog>
+
   </div>
 </template>
 
 <script>
 import {storageUnitConversion, timeDifference, mimeTypes, fileCategory, downloadByUrl} from '@/utils/utils'
 import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
+import loginPanel from '@/views/login/index'
 import previewVideo from 'vue-dplayer'
 import 'vue-dplayer/dist/vue-dplayer.css'
 import cookies from 'js-cookie'
@@ -120,7 +127,7 @@ export default {
     }
   },
   components: {
-    ElImageViewer, previewVideo
+    ElImageViewer, previewVideo, loginPanel
   },
   data () {
     return {
@@ -174,6 +181,15 @@ export default {
             downloadUrl: ''
           }
         }
+      },
+      // 当前登录页弹窗model
+      login: {
+        // 是否显示(文件下载、转存时校验当前登录状态)
+        show: false,
+        // 弹窗model关闭后执行的方法名称
+        method: '',
+        // 弹窗model关闭后执行的方法所对应的参数
+        parameter: ''
       }
     }
   },
@@ -222,8 +238,15 @@ export default {
       // 获取cookie缓存中的用户信息
       let token = cookies.get('userInfo')
       if (token === undefined) {
-        // 如果在未登录的情况下使用，则跳转登录页面
-        this.$router.push({name: 'login'})
+        // 如果在未登录的情况下使用，则打开登录页面弹窗
+        this.login = {
+          // 是否显示(文件下载、转存时校验当前登录状态)
+          show: true,
+          // 弹窗model关闭后执行的方法名称
+          method: 'doubleClick',
+          // 弹窗model关闭后执行的方法所对应的参数
+          parameter: item
+        }
         return
       }
       let userInfo = JSON.parse(token)
@@ -478,6 +501,34 @@ export default {
       this.$refs.previewVideo.dp.pause()
       // 跳转到视频指定的时间
       this.$refs.previewVideo.dp.seek(0)
+    },
+    /**
+     * 关闭登录页面model
+     * @param done 是否完成
+     */
+    closeLoginModel: function (done) {
+      if (done !== false) {
+        this.login = {
+          // 是否显示(文件下载、转存时校验当前登录状态)
+          show: false,
+          // 弹窗model关闭后执行的方法名称
+          method: '',
+          // 弹窗model关闭后执行的方法所对应的参数
+          parameter: ''
+        }
+      }
+    },
+    /**
+     * 登录model登录成功后的跳转
+     */
+    loginSuccessfully: function () {
+      this.login.show = false
+      this[this.login.method](this.login.parameter)
+      this.login = {
+        show: false,
+        method: '',
+        parameter: ''
+      }
     }
   }
 }
@@ -746,6 +797,32 @@ p {
   top: 10%;
 }
 
+/deep/ .loginDialog {
+  max-width: 600px;
+  margin-top: 10%;
+}
+
+/deep/ .loginDialog > .el-dialog__header {
+  padding: 0;
+}
+
+/deep/ .loginDialog > .el-dialog__body {
+  padding: 1px;
+}
+
+/deep/ .loginDialog > .el-dialog__body > div > .login-box {
+  border: 0;
+  padding: 0;
+  box-shadow: none;
+  width: 86%;
+}
+
+@media (max-width: 780px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    top: 5%;
+  }
+}
+
 @media (max-width: 769px) {
   #listing.list .item .name {
     width: 17em;
@@ -777,24 +854,199 @@ p {
   #listing.list .item .name {
     width: 15em;
   }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 80%;
+    height: 60%;
+    left: 10%;
+    top: 10%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 42%;
+    max-width: 16em;
+  }
+
+  /deep/ .el-dialog__headerbtn {
+    z-index: 999;
+    top: -32px;
+    right: -55px;
+  }
+}
+
+@media (max-width: 450px) and (min-height: 631px) {
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 49%;
+    max-width: 22em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    height: 66%;
+    top: 9%;
+  }
 }
 
 @media (max-width: 415px) {
   #listing.list .item .name {
     width: 17em;
   }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 80%;
+    height: 60%;
+    left: 10%;
+    top: 10%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 45%;
+    max-width: 21em;
+  }
+
+  /deep/ .el-dialog__headerbtn {
+    z-index: 999;
+    top: -32px;
+    right: -55px;
+  }
+}
+
+@media (max-width: 412px) {
+  @media (min-height: 800px) {
+    /deep/ .loginDialog > .el-dialog__body > #login form {
+      top: 42%;
+      max-width: 21em;
+    }
+
+    /deep/ .loginDialog > .el-dialog__body > #login {
+      height: 54%;
+    }
+  }
+}
+
+@media (max-width: 380px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 86%;
+    height: 62%;
+    left: 7%;
+    top: 8%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 46%;
+    max-width: 16em;
+  }
 }
 
 @media (max-width: 376px) {
   #listing.list .item .name {
     width: 14em;
   }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 86%;
+    height: 55%;
+    left: 7%;
+    top: 8%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 41%;
+    max-width: 16em;
+  }
+}
+
+@media (max-width: 376px) and (min-height: 631px) {
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 46%;
+    max-width: 19em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    height: 66%;
+  }
+}
+
+@media (max-width: 376px) and (min-height: 811px) {
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 40%;
+    max-width: 19em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    height: 55%;
+  }
+}
+
+@media (max-width: 361px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 86%;
+    height: 66%;
+    left: 7%;
+    top: 8%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 46%;
+    max-width: 18em;
+  }
 }
 
 @media (max-width: 331px) {
   #listing.list .item .name {
     width: 10em;
   }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 90%;
+    height: 50%;
+    left: 5%;
+    top: 10%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 38%;
+    max-width: 16em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login img {
+    margin-top: 3vh;
+  }
+}
+
+@media (max-width: 321px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 90%;
+    height: 70%;
+    left: 5%;
+    top: 8%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 47%;
+    max-width: 16em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login img {
+    margin-top: 3vh;
+  }
+}
+
+@media (max-width: 321px) and (min-height: 650px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 90%;
+    height: 58%;
+    left: 5%;
+    top: 8%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 42%;
+    max-width: 16em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login img {
+    margin-top: 3vh;
+  }
 }
 
 </style>
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 6756f70d8edd681b2c633dbeab8b0f9de04f3719..211f691decba5921bd72ad67be441d707f281524 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -54,10 +54,20 @@
 import {validWeChatId, validEmail, validUsername} from '@/utils/validate'
 import {login} from '@/api/login'
 import {asyncRoutes} from '@/router/routers'
+import {resetRouter} from '@/router/index'
 import cookies from 'js-cookie'
 
 export default {
   name: 'login',
+  props: {
+    // 登录成功后是否进行路由跳转(默认跳转home路由)
+    hopRouting: {
+      type: Boolean,
+      default () {
+        return true
+      }
+    }
+  },
   data () {
     // 用户名校验
     const validateUsername = (rule, value, callback) => {
@@ -136,9 +146,14 @@ export default {
               localStorage.setItem('username', this.form.username)
               localStorage.setItem('password', this.form.password)
               localStorage.setItem('userEmail', response.data.userInfo.userEmail)
+              // 先重置路由
+              resetRouter()
               // 动态添加路由数据
               this.$router.addRoutes(asyncRoutes)
-              this.$router.push({name: 'home'})
+              this.$emit('loginSuccessfully')
+              if (this.hopRouting) {
+                this.$router.push({name: 'home'})
+              }
             }
           }).catch((err) => {
             console.log(err)
diff --git a/src/views/share/share-list.vue b/src/views/share/share-list.vue
index 9f3aea05ba25521ac640fc9a9c39a8893776e18a..1494605b3320c709979b9ec2dace896c2b380c33 100644
--- a/src/views/share/share-list.vue
+++ b/src/views/share/share-list.vue
@@ -41,11 +41,18 @@
                @card-close="cardClose" @card-confirm="cardConfirm"
                @card-folder-previous="cardFolderPrevious" @card-folder-next="cardFolderNext"></file-card>
 
+    <!-- 登录页的Dialog弹窗 -->
+    <el-dialog :visible.sync="login.show"
+               customClass="loginDialog" :before-close="closeLoginModel">
+      <loginPanel :hopRouting="false" @loginSuccessfully="loginSuccessfully"></loginPanel>
+    </el-dialog>
+
   </div>
 </template>
 
 <script>
 import filePanel from '@/views/file/index'
+import loginPanel from '@/views/login/index'
 import {copyFile} from '@/api/file'
 import {search} from '@/api/share'
 import fileCard from '@/components/fileCard/fileCard'
@@ -87,7 +94,7 @@ export default {
     }
   },
   components: {
-    filePanel, fileCard
+    filePanel, fileCard, loginPanel
   },
   data () {
     return {
@@ -113,6 +120,15 @@ export default {
           userFileName: '/',
           userFileId: 0
         }]
+      },
+      // 当前登录页弹窗model
+      login: {
+        // 是否显示(文件下载、转存时校验当前登录状态)
+        show: false,
+        // 弹窗model关闭后执行的方法名称
+        method: '',
+        // 弹窗model关闭后执行的方法所对应的参数
+        parameter: ''
       }
     }
   },
@@ -246,8 +262,15 @@ export default {
       // 获取cookie中缓存的用户信息
       let token = cookies.get('userInfo')
       if (token === undefined) {
-        // 如果在未登录的情况下使用，则跳转登录页面
-        this.$router.push({name: 'login'})
+        // 如果在未登录的情况下使用，则打开登录页面弹窗
+        this.login = {
+          // 是否显示(文件下载、转存时校验当前登录状态)
+          show: true,
+          // 弹窗model关闭后执行的方法名称
+          method: 'cardConfirm',
+          // 弹窗model关闭后执行的方法所对应的参数
+          parameter: currentlySelectedValue
+        }
         return
       }
 
@@ -318,8 +341,15 @@ export default {
       // 获取cookie中缓存的用户信息
       let token = cookies.get('userInfo')
       if (token === undefined) {
-        // 如果在未登录的情况下使用，则跳转登录页面
-        this.$router.push({name: 'login'})
+        // 如果在未登录的情况下使用，则打开登录页面弹窗
+        this.login = {
+          // 是否显示(文件下载、转存时校验当前登录状态)
+          show: true,
+          // 弹窗model关闭后执行的方法名称
+          method: 'saveToMine',
+          // 弹窗model关闭后执行的方法所对应的参数
+          parameter: ''
+        }
         return
       }
 
@@ -332,6 +362,34 @@ export default {
         userFileName: '/',
         userFileId: 0
       }]
+    },
+    /**
+     * 关闭登录页面model
+     * @param done 是否完成
+     */
+    closeLoginModel: function (done) {
+      if (done !== false) {
+        this.login = {
+          // 是否显示(文件下载、转存时校验当前登录状态)
+          show: false,
+          // 弹窗model关闭后执行的方法名称
+          method: '',
+          // 弹窗model关闭后执行的方法所对应的参数
+          parameter: ''
+        }
+      }
+    },
+    /**
+     * 登录model登录成功后的跳转
+     */
+    loginSuccessfully: function () {
+      this.login.show = false
+      this[this.login.method](this.login.parameter)
+      this.login = {
+        show: false,
+        method: '',
+        parameter: ''
+      }
     }
   }
 }
@@ -422,6 +480,32 @@ main {
   display: none;
 }
 
+/deep/ .loginDialog {
+  max-width: 600px;
+  margin-top: 10%;
+}
+
+/deep/ .loginDialog > .el-dialog__header {
+  padding: 0;
+}
+
+/deep/ .loginDialog > .el-dialog__body {
+  padding: 1px;
+}
+
+/deep/ .loginDialog > .el-dialog__body > div > .login-box {
+  border: 0;
+  padding: 0;
+  box-shadow: none;
+  width: 86%;
+}
+
+@media (max-width: 780px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    top: 5%;
+  }
+}
+
 @media screen and (max-width: 480px) {
   #code-button {
     display: none;
@@ -438,4 +522,180 @@ main {
     width: 12em;
   }
 }
+
+@media (max-width: 450px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 80%;
+    height: 60%;
+    left: 10%;
+    top: 10%;
+  }
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 42%;
+    max-width: 16em;
+  }
+  /deep/ .el-dialog__headerbtn{
+    z-index: 999;
+    top: -32px;
+    right: -55px;
+  }
+}
+
+@media (max-width: 450px) and (min-height: 631px) {
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 49%;
+    max-width: 22em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    height: 66%;
+    top: 9%;
+  }
+}
+
+@media (max-width: 415px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 80%;
+    height: 60%;
+    left: 10%;
+    top: 10%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 45%;
+    max-width: 21em;
+  }
+
+  /deep/ .el-dialog__headerbtn{
+    z-index: 999;
+    top: -32px;
+    right: -55px;
+  }
+}
+
+@media (max-width: 412px) {
+  @media (min-height: 800px) {
+    /deep/ .loginDialog > .el-dialog__body > #login form {
+      top: 42%;
+      max-width: 21em;
+    }
+
+    /deep/ .loginDialog > .el-dialog__body > #login {
+      height: 54%;
+    }
+  }
+}
+
+@media (max-width: 380px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 86%;
+    height: 62%;
+    left: 7%;
+    top: 8%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 46%;
+    max-width: 16em;
+  }
+}
+
+@media (max-width: 376px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 86%;
+    height: 55%;
+    left: 7%;
+    top: 8%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 41%;
+    max-width: 16em;
+  }
+}
+
+@media (max-width: 376px) and (min-height: 631px) {
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 46%;
+    max-width: 19em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    height: 66%;
+  }
+}
+
+@media (max-width: 376px) and (min-height: 811px) {
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 40%;
+    max-width: 19em;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    height: 55%;
+  }
+}
+
+@media (max-width: 361px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 86%;
+    height: 66%;
+    left: 7%;
+    top: 8%;
+  }
+
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 46%;
+    max-width: 18em;
+  }
+}
+
+@media (max-width: 330px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 90%;
+    height: 50%;
+    left: 5%;
+    top: 10%;
+  }
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 38%;
+    max-width: 16em;
+  }
+  /deep/ .loginDialog > .el-dialog__body > #login img {
+    margin-top: 3vh;
+  }
+}
+
+@media (max-width: 321px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 90%;
+    height: 70%;
+    left: 5%;
+    top: 8%;
+  }
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 47%;
+    max-width: 16em;
+  }
+  /deep/ .loginDialog > .el-dialog__body > #login img {
+    margin-top: 3vh;
+  }
+}
+
+@media (max-width: 321px) and (min-height: 650px) {
+  /deep/ .loginDialog > .el-dialog__body > #login {
+    width: 90%;
+    height: 58%;
+    left: 5%;
+    top: 8%;
+  }
+  /deep/ .loginDialog > .el-dialog__body > #login form {
+    top: 42%;
+    max-width: 16em;
+  }
+  /deep/ .loginDialog > .el-dialog__body > #login img {
+    margin-top: 3vh;
+  }
+}
+
 </style>