From 1c87c73173b115eb09285843813a49991528749d Mon Sep 17 00:00:00 2001
From: jmal <zhushilun084@gmail.com>
Date: Mon, 8 Mar 2021 17:02:56 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=EF=BC=9A=E5=87=8F=E5=B0=91?=
 =?UTF-8?q?=E6=89=93=E5=8C=85=E5=90=8E=E7=9A=84=E4=BD=93=E7=A7=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                              | 13 +---
 public/index.html                         | 15 ++++
 src/App.vue                               |  2 +-
 src/assets/js/color-thief.min.js          | 30 --------
 src/components/ShowFile/ShowFile.vue      |  8 --
 src/components/input/UploadImageInput.vue |  1 -
 src/components/preview/AudioPreview.vue   | 90 ++++++++++++-----------
 src/components/preview/ImageViewer.vue    |  4 -
 src/components/preview/VideoPreview.vue   |  1 -
 src/main.js                               | 68 +++--------------
 src/utils/request.js                      | 11 ++-
 src/views/home/mobile/index.vue           | 27 +------
 src/views/public/share/shareList.vue      |  4 -
 src/views/share/index.vue                 |  8 +-
 14 files changed, 81 insertions(+), 201 deletions(-)
 delete mode 100644 src/assets/js/color-thief.min.js

diff --git a/package.json b/package.json
index 7e10d12..019305c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "jmal-cloud-view",
-  "version": "2.1.8",
+  "version": "2.1.9",
   "description": "jmal cloud",
   "author": "Jmal <zhushilun084@163.com>",
   "license": "MIT",
@@ -15,16 +15,10 @@
     "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"
   },
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.2.32",
-    "@fortawesome/free-solid-svg-icons": "^5.15.1",
-    "@fortawesome/vue-fontawesome": "^2.0.0",
-    "@moefe/vue-aplayer": "^2.0.0-beta.5",
     "ant-design-vue": "^1.6.5",
-    "axios": "0.21.1",
     "clipboard": "^2.0.6",
     "cropperjs": "^1.5.6",
     "e-vue-contextmenu": "^0.1.3",
-    "element-ui": "2.13.0",
     "gsap": "^3.2.6",
     "highlightjs-line-numbers.js": "^2.7.0",
     "htmlhint": "^0.13.0",
@@ -42,22 +36,17 @@
     "nprogress": "0.2.0",
     "path-to-regexp": "2.4.0",
     "pinyin": "^2.9.1",
-    "pl-table": "2.7.5",
     "scriptjs": "^2.5.9",
     "sortablejs": "^1.10.2",
     "spark-md5": "^3.0.0",
     "stompjs": "^2.3.3",
     "v-contextmenu": "^2.9.0",
     "v-viewer": "^1.5.1",
-    "vant": "2.5.0",
     "vditor": "^3.6.1",
-    "viewerjs": "^1.5.0",
     "vonic": "^1.1.3",
-    "vue": "2.6.10",
     "vue-aplayer": "^1.6.1",
     "vue-codemirror-lite": "^1.0.4",
     "vue-grid-layout": "^2.3.7",
-    "vue-router": "3.0.6",
     "vue-runtime-helpers": "^1.1.2",
     "vue-simple-uploader": "^0.7.4",
     "vue-touch": "^2.0.0-beta.4",
diff --git a/public/index.html b/public/index.html
index 6bee234..b3e494a 100644
--- a/public/index.html
+++ b/public/index.html
@@ -8,15 +8,30 @@
      <!--在 head 标签中添加 meta 标签，并设置 viewport-fit=cover 值-->
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
 
+    <!--vue.js-->
     <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
+    <!--vue-roter.js-->
     <script src="https://cdn.bootcss.com/vue-router/3.0.6/vue-router.js"></script>
+    <!--axios.js-->
     <script src="https://cdn.bootcss.com/axios/0.21.1/axios.min.js"></script>
+    <!--element-ui.js-->
     <link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.1/lib/theme-chalk/index.css">
     <script src="https://unpkg.com/element-ui@2.15.1/lib/index.js"></script>
+    <!--pl-table.js-->
+    <link rel="stylesheet" href="https://unpkg.com/pl-table@2.7.5/themes/index.css">
+    <script src="https://unpkg.com/pl-table@2.7.5/lib/index.js"></script>
+    <!--vant.js-->
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.12/lib/index.css"/>
+    <script src="https://cdn.jsdelivr.net/npm/vant@2.12/lib/vant.min.js"></script>
+    <!--viewer css-->
+    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/viewerjs/1.7.1/viewer.min.css">
+    <!--vue-aplayer-->
+    <script src="//cdn.jsdelivr.net/npm/vue-aplayer"></script>
 
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title><%= webpackConfig.name %></title>
     <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/5.13.0/css/all.min.css">
+    <script src="https://cdn.jsdelivr.net/npm/colorthief@2.0.2/src/color-thief.js"></script>
   </head>
   <body>
     <noscript>
diff --git a/src/App.vue b/src/App.vue
index 5f746a8..15355a4 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,7 +7,7 @@
 <script>
 
 const pcList = ['/','/s']
-const mobileList = ['/_m','/s_m']
+const mobileList = ['/_m','/_m/','/s_m','/s_m/']
 export default {
   name: 'App',
   components: {},
diff --git a/src/assets/js/color-thief.min.js b/src/assets/js/color-thief.min.js
deleted file mode 100644
index 7cbd667..0000000
--- a/src/assets/js/color-thief.min.js
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- * Color Thief v2.0
- * by Lokesh Dhakar - http://www.lokeshdhakar.com
- *
- * Thanks
- * ------
- * Nick Rabinowitz - For creating quantize.js.
- * John Schulz - For clean up and optimization. @JFSIII
- * Nathan Spady - For adding drag and drop support to the demo page.
- *
- * License
- * -------
- * Copyright 2011, 2015 Lokesh Dhakar
- * Released under the MIT license
- * https://raw.githubusercontent.com/lokesh/color-thief/master/LICENSE
- *
- * @license
- */
-var CanvasImage=function(a){this.canvas=document.createElement("canvas"),this.context=this.canvas.getContext("2d"),document.body.appendChild(this.canvas),this.width=this.canvas.width=a.width,this.height=this.canvas.height=a.height,this.context.drawImage(a,0,0,this.width,this.height)};CanvasImage.prototype.clear=function(){this.context.clearRect(0,0,this.width,this.height)},CanvasImage.prototype.update=function(a){this.context.putImageData(a,0,0)},CanvasImage.prototype.getPixelCount=function(){return this.width*this.height},CanvasImage.prototype.getImageData=function(){return this.context.getImageData(0,0,this.width,this.height)},CanvasImage.prototype.removeCanvas=function(){this.canvas.parentNode.removeChild(this.canvas)};var ColorThief=function(){};/*!
- * quantize.js Copyright 2008 Nick Rabinowitz.
- * Licensed under the MIT license: http://www.opensource.org/licenses/mit-license.php
- * @license
- */
-/*!
- * Block below copied from Protovis: http://mbostock.github.com/protovis/
- * Copyright 2010 Stanford Visualization Group
- * Licensed under the BSD License: http://www.opensource.org/licenses/bsd-license.php
- * @license
- */
-if(ColorThief.prototype.getColor=function(a,b){var c=this.getPalette(a,5,b),d=c[0];return d},ColorThief.prototype.getPalette=function(a,b,c){"undefined"==typeof b&&(b=10),("undefined"==typeof c||c<1)&&(c=10);for(var d,e,f,g,h,i=new CanvasImage(a),j=i.getImageData(),k=j.data,l=i.getPixelCount(),m=[],n=0;n<l;n+=c)d=4*n,e=k[d+0],f=k[d+1],g=k[d+2],h=k[d+3],h>=125&&(e>250&&f>250&&g>250||m.push([e,f,g]));var o=MMCQ.quantize(m,b),p=o?o.palette():null;return i.removeCanvas(),p},!pv)var pv={map:function(a,b){var c={};return b?a.map(function(a,d){return c.index=d,b.call(c,a)}):a.slice()},naturalOrder:function(a,b){return a<b?-1:a>b?1:0},sum:function(a,b){var c={};return a.reduce(b?function(a,d,e){return c.index=e,a+b.call(c,d)}:function(a,b){return a+b},0)},max:function(a,b){return Math.max.apply(null,b?pv.map(a,b):a)}};var MMCQ=function(){function a(a,b,c){return(a<<2*i)+(b<<i)+c}function b(a){function b(){c.sort(a),d=!0}var c=[],d=!1;return{push:function(a){c.push(a),d=!1},peek:function(a){return d||b(),void 0===a&&(a=c.length-1),c[a]},pop:function(){return d||b(),c.pop()},size:function(){return c.length},map:function(a){return c.map(a)},debug:function(){return d||b(),c}}}function c(a,b,c,d,e,f,g){var h=this;h.r1=a,h.r2=b,h.g1=c,h.g2=d,h.b1=e,h.b2=f,h.histo=g}function d(){this.vboxes=new b(function(a,b){return pv.naturalOrder(a.vbox.count()*a.vbox.volume(),b.vbox.count()*b.vbox.volume())})}function e(b){var c,d,e,f,g=1<<3*i,h=new Array(g);return b.forEach(function(b){d=b[0]>>j,e=b[1]>>j,f=b[2]>>j,c=a(d,e,f),h[c]=(h[c]||0)+1}),h}function f(a,b){var d,e,f,g=1e6,h=0,i=1e6,k=0,l=1e6,m=0;return a.forEach(function(a){d=a[0]>>j,e=a[1]>>j,f=a[2]>>j,d<g?g=d:d>h&&(h=d),e<i?i=e:e>k&&(k=e),f<l?l=f:f>m&&(m=f)}),new c(g,h,i,k,l,m,b)}function g(b,c){function d(a){var b,d,e,f,g,h=a+"1",j=a+"2",k=0;for(i=c[h];i<=c[j];i++)if(o[i]>n/2){for(e=c.copy(),f=c.copy(),b=i-c[h],d=c[j]-i,g=b<=d?Math.min(c[j]-1,~~(i+d/2)):Math.max(c[h],~~(i-1-b/2));!o[g];)g++;for(k=p[g];!k&&o[g-1];)k=p[--g];return e[j]=g,f[h]=e[j]+1,[e,f]}}if(c.count()){var e=c.r2-c.r1+1,f=c.g2-c.g1+1,g=c.b2-c.b1+1,h=pv.max([e,f,g]);if(1==c.count())return[c.copy()];var i,j,k,l,m,n=0,o=[],p=[];if(h==e)for(i=c.r1;i<=c.r2;i++){for(l=0,j=c.g1;j<=c.g2;j++)for(k=c.b1;k<=c.b2;k++)m=a(i,j,k),l+=b[m]||0;n+=l,o[i]=n}else if(h==f)for(i=c.g1;i<=c.g2;i++){for(l=0,j=c.r1;j<=c.r2;j++)for(k=c.b1;k<=c.b2;k++)m=a(j,i,k),l+=b[m]||0;n+=l,o[i]=n}else for(i=c.b1;i<=c.b2;i++){for(l=0,j=c.r1;j<=c.r2;j++)for(k=c.g1;k<=c.g2;k++)m=a(j,k,i),l+=b[m]||0;n+=l,o[i]=n}return o.forEach(function(a,b){p[b]=n-a}),d(h==e?"r":h==f?"g":"b")}}function h(a,c){function h(a,b){for(var c,d=1,e=0;e<k;)if(c=a.pop(),c.count()){var f=g(i,c),h=f[0],j=f[1];if(!h)return;if(a.push(h),j&&(a.push(j),d++),d>=b)return;if(e++>k)return}else a.push(c),e++}if(!a.length||c<2||c>256)return!1;var i=e(a),j=0;i.forEach(function(){j++});var m=f(a,i),n=new b(function(a,b){return pv.naturalOrder(a.count(),b.count())});n.push(m),h(n,l*c);for(var o=new b(function(a,b){return pv.naturalOrder(a.count()*a.volume(),b.count()*b.volume())});n.size();)o.push(n.pop());h(o,c-o.size());for(var p=new d;o.size();)p.push(o.pop());return p}var i=5,j=8-i,k=1e3,l=.75;return c.prototype={volume:function(a){var b=this;return b._volume&&!a||(b._volume=(b.r2-b.r1+1)*(b.g2-b.g1+1)*(b.b2-b.b1+1)),b._volume},count:function(b){var c=this,d=c.histo;if(!c._count_set||b){var e,f,g,h=0;for(e=c.r1;e<=c.r2;e++)for(f=c.g1;f<=c.g2;f++)for(g=c.b1;g<=c.b2;g++)index=a(e,f,g),h+=d[index]||0;c._count=h,c._count_set=!0}return c._count},copy:function(){var a=this;return new c(a.r1,a.r2,a.g1,a.g2,a.b1,a.b2,a.histo)},avg:function(b){var c=this,d=c.histo;if(!c._avg||b){var e,f,g,h,j,k=0,l=1<<8-i,m=0,n=0,o=0;for(f=c.r1;f<=c.r2;f++)for(g=c.g1;g<=c.g2;g++)for(h=c.b1;h<=c.b2;h++)j=a(f,g,h),e=d[j]||0,k+=e,m+=e*(f+.5)*l,n+=e*(g+.5)*l,o+=e*(h+.5)*l;k?c._avg=[~~(m/k),~~(n/k),~~(o/k)]:c._avg=[~~(l*(c.r1+c.r2+1)/2),~~(l*(c.g1+c.g2+1)/2),~~(l*(c.b1+c.b2+1)/2)]}return c._avg},contains:function(a){var b=this,c=a[0]>>j;return gval=a[1]>>j,bval=a[2]>>j,c>=b.r1&&c<=b.r2&&gval>=b.g1&&gval<=b.g2&&bval>=b.b1&&bval<=b.b2}},d.prototype={push:function(a){this.vboxes.push({vbox:a,color:a.avg()})},palette:function(){return this.vboxes.map(function(a){return a.color})},size:function(){return this.vboxes.size()},map:function(a){for(var b=this.vboxes,c=0;c<b.size();c++)if(b.peek(c).vbox.contains(a))return b.peek(c).color;return this.nearest(a)},nearest:function(a){for(var b,c,d,e=this.vboxes,f=0;f<e.size();f++)c=Math.sqrt(Math.pow(a[0]-e.peek(f).color[0],2)+Math.pow(a[1]-e.peek(f).color[1],2)+Math.pow(a[2]-e.peek(f).color[2],2)),(c<b||void 0===b)&&(b=c,d=e.peek(f).color);return d},forcebw:function(){var a=this.vboxes;a.sort(function(a,b){return pv.naturalOrder(pv.sum(a.color),pv.sum(b.color))});var b=a[0].color;b[0]<5&&b[1]<5&&b[2]<5&&(a[0].color=[0,0,0]);var c=a.length-1,d=a[c].color;d[0]>251&&d[1]>251&&d[2]>251&&(a[c].color=[255,255,255])}},{quantize:h}}();
\ No newline at end of file
diff --git a/src/components/ShowFile/ShowFile.vue b/src/components/ShowFile/ShowFile.vue
index 0360f26..835b3af 100644
--- a/src/components/ShowFile/ShowFile.vue
+++ b/src/components/ShowFile/ShowFile.vue
@@ -562,10 +562,6 @@
 </template>
 
 <script>
-import 'vant/lib/grid/style';
-import 'vant/lib/grid-item/style';
-import 'vant/lib/checkbox/style';
-import 'vant/lib/checkbox-group/style';
 import {mapGetters} from 'vuex'
 import {formatSize, formatTime} from '@/utils/number'
 import {suffix} from '@/utils/file-type'
@@ -586,8 +582,6 @@ import FileTree from "@/components/FileTree"
 
 import '@/utils/directives.js'
 
-import 'pl-table/themes/index.css';
-import {PlTable, PlTableColumn} from 'pl-table';
 import fileConfig from '@/utils/file-config'
 
 var rowStyleExecuting = false
@@ -595,8 +589,6 @@ export default {
   name: 'ShowFile',
   components: {
     MessageDialog, AudioPreview, VideoPreview, ImageViewer, SimTextPreview, IconFile, BreadcrumbFilePath, EmptyFile,
-    PlTable,
-    PlTableColumn,
     ButtonUpload,
     FileTree
   },
diff --git a/src/components/input/UploadImageInput.vue b/src/components/input/UploadImageInput.vue
index 065592f..5ebbbe9 100644
--- a/src/components/input/UploadImageInput.vue
+++ b/src/components/input/UploadImageInput.vue
@@ -63,7 +63,6 @@
 </template>
 <script>
 
-import axios from 'axios'
 import fileApi from '@/api/file-api'
 import fileConfig from "@/utils/file-config"
 import SelectFile from "@/components/ShowFile/SelectFile"
diff --git a/src/components/preview/AudioPreview.vue b/src/components/preview/AudioPreview.vue
index bd36d17..0bafa0e 100644
--- a/src/components/preview/AudioPreview.vue
+++ b/src/components/preview/AudioPreview.vue
@@ -1,19 +1,19 @@
 <template>
-<div ref="audioPreview" v-show="show">
+  <div ref="audioPreview" v-if="show">
   <div class="audio-player"
     v-aplayerDrag="{ x: transformX, y: transformY }"
     @mouseenter="closeBarShow = true" @mouseleave="closeBarShow = false">
-<!-- <div class="audio-player">  -->
-  <aplayer
-    ref="audioPlayer"
-    autoplay
-    listFolded
-    loop.sync="all"
-    order.sync="list"
-    :mini.sync="mini"
-    :audio="audio"
-    :lrc-type="0">
-  </aplayer>
+    <aplayer
+      ref="audioPlayer"
+      autoplay
+      listFolded
+      loop.sync="all"
+      order.sync="list"
+      :mini.sync="mini"
+      :music.sync="music"
+      :list="list"
+      :lrc-type="0">
+    </aplayer>
   <div v-show="closeBarShow" class="close-bar" @click="close">
     <svg-icon class="audio-player-close" icon-class="close"/>
   </div>
@@ -39,60 +39,66 @@ export default {
         transformY: 0,
         show: false,
         closeBarShow: false,
-        audio: [],
+        music: {
+          id: '',
+          src: '', // 音频文件的 URL
+          title: '', // 歌曲名称
+          artist: '', // 演唱者
+          pic: '', // 封面图片 URL
+          lrc: '', // LRC 歌词或者歌词文件的 URL
+          theme: '', // 歌曲的主题色，会覆盖播放器的主题色
+        },
+        list: [],
         mini: false,
+        audioPlayerDoc: undefined
+      }
+    },
+    watch: {
+      show(val) {
+        if (val && !this.audioPlayerDoc) {
+          this.$nextTick(() => {
+            this.audioPlayerDoc = document.querySelector('.audio-player')
+          })
+        }
       }
     },
     mounted() {
-      this.onPicClick = this.onPicClick.bind(this);
-      let pic = document.querySelector('.aplayer-pic')
-      pic.addEventListener('click', this.onPicClick);
       Bus.$on('onAddAudio',(newFile, audioCoverUrl) => {
         this.show = true
         let url = fileConfig.previewUrl(this.$store.state.user.name, newFile, this.$store.getters.token)
-        console.log(url)
         if(!this.$store.state.user.token){
           url = fileConfig.publicPreviewUrl(newFile.id, window.shareId);
         }
         let music = newFile.music
         let fileName = newFile.name.substring(0,newFile.name.length - newFile.suffix.length-1)
-        let musicOperation = {
+        this.music = {
           id: newFile.id,
-          name: music.songName ? music.songName : fileName,
+          src: url,
+          title: music.songName ? music.songName : fileName,
           artist: music.songName ? music.singer : fileName,
-          url: url,
-          type: newFile.contentType,
-          cover: music.songName ? audioCoverUrl+newFile.id :'',
+          pic: music.songName ? audioCoverUrl+newFile.id :'',
+          lrc: '',
+          theme: 'pic'
         }
-        let musicIndex = this.audio.findIndex(item => item.id===newFile.id)
+        let musicIndex = this.list.findIndex(item => item.id === newFile.id)
         if(musicIndex < 0){
-          if(this.audio.length === 1){
-            let loop = document.querySelector('.aplayer-icon.aplayer-icon-loop');
-            loop.style.display = 'inline'
-            let order = document.querySelector('.aplayer-icon.aplayer-icon-order');
-            order.style.display = 'inline'
-          }
-          this.audio.push(musicOperation)
+          this.list.push(this.music)
           this.$nextTick(()=>{
-            this.$refs.audioPlayer.switch(this.audio.length-1)
+            this.$refs.audioPlayer.play()
           })
-        }else{
-          this.$refs.audioPlayer.switch(musicIndex)
+        } else {
+          let listMusic = this.audioPlayerDoc.querySelectorAll('.aplayer-list ol li')[musicIndex]
+          listMusic.click()
         }
       })
     },
-    watch: {
-    },
     methods: {
       close(){
         this.show = false
-        this.$refs.audioPlayer.pause();
-        this.audio.splice(0,this.audio.length)
-      },
-      onPicClick() {
-        // this.mini = !this.mini
-        // console.log(this.$refs.audioPlayer)
-      },
+        this.audioPlayerDoc = undefined
+        this.$refs.audioPlayer.pause()
+        this.list.splice(0, this.list.length)
+      }
     },
     destroyed() {
       Bus.$off('onAddAudio')
diff --git a/src/components/preview/ImageViewer.vue b/src/components/preview/ImageViewer.vue
index 0ef77a1..a8cdbbc 100644
--- a/src/components/preview/ImageViewer.vue
+++ b/src/components/preview/ImageViewer.vue
@@ -8,18 +8,14 @@
     >
       <template slot-scope="scope">
         <div v-for="src in scope.images"  :key="src">
-          <!-- <video v-if="src.contentType === 'video'" :src="src.url"> -->
-          <!-- <video v-if="src.contentType === 'video'" controls="" name="media"><source :src="src.url" type="video/mp4"></video> -->
           <img :src="src">
         </div>
       </template>
     </viewer>
-    <!-- <button type="button" @click="show">Show</button> -->
 </div>
 </template>
 <script>
   import fileConfig from '@/utils/file-config'
-  import 'viewerjs/dist/viewer.css';
   import Bus from '@/assets/js/bus'
   export default {
     name: "ImageViewer",
diff --git a/src/components/preview/VideoPreview.vue b/src/components/preview/VideoPreview.vue
index b370091..751348e 100644
--- a/src/components/preview/VideoPreview.vue
+++ b/src/components/preview/VideoPreview.vue
@@ -28,7 +28,6 @@
 </template>
 
 <script>
-import 'vant/lib/overlay/style';
 import 'vue-video-player/src/custom-theme.css'
 import 'video.js/dist/video-js.css'
 import { videoPlayer } from 'vue-video-player'
diff --git a/src/main.js b/src/main.js
index 3d5c3d4..ee4d429 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,11 +1,5 @@
-// import Vue from 'vue'
-
 import 'normalize.css/normalize.css' // A modern alternative to CSS resets
 
-// import ElementUI from 'element-ui'
-// import 'element-ui/lib/theme-chalk/index.css'
-// import locale from 'element-ui/lib/locale/lang/en' // lang i18n
-
 import '@/styles/index.scss' // global css
 import uploader from 'vue-simple-uploader'
 import EVueContextmenu from 'e-vue-contextmenu'
@@ -13,9 +7,6 @@ import App from './App'
 import store from './store'
 import router from './router'
 import VueWechatTitle from 'vue-wechat-title'
-// import WeVue from 'we-vue'
-// import 'we-vue/lib/style.css'
-import { Popup,Search, Button, Cell, CellGroup, Image, List, PullRefresh, SwipeCell, Col, Row, Divider, Sticky, NavBar, Icon, Tabbar, TabbarItem, ActionSheet, Field, Overlay, Checkbox, CheckboxGroup, Grid, GridItem} from 'vant';
 
 
 // ant-design-vue
@@ -29,68 +20,28 @@ Vue.use(contentmenu)
 import '@/icons' // icon
 import '@/permission' // permission control
 
-import VueTouch from"vue-touch";
+import VueTouch from "vue-touch";
 import Viewer from 'v-viewer'
 
-import APlayer from '@moefe/vue-aplayer';
-Vue.use(APlayer, {
-  defaultCover: 'https://images.unsplash.com/photo-1511671782779-c97d3d27a1d4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60', // 设置播放器默认封面图片
-  productionTip: false, // 是否在控制台输出版本信息
-});
+// import APlayer from 'vue-aplayer';
+// Vue.use(APlayer, {
+//   defaultCover: 'https://images.unsplash.com/photo-1511671782779-c97d3d27a1d4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60', // 设置播放器默认封面图片
+//   productionTip: false, // 是否在控制台输出版本信息
+// });
 
 Vue.use(Viewer)
 Vue.use(VueTouch, {name:'v-touch'})
 
-/**
- * If you don't want to use mock-server
- * you want to use MockJs for mock api
- * you can execute: mockXHR()
- *
- * Currently MockJs will be used in the production environment,
- * please remove it before going online ! ! !
- */
-// if (process.env.NODE_ENV === 'production') {
-//   const { mockXHR } = require('../mock')
-//   mockXHR()
-// }
-
-// set ElementUI lang to EN
-// Vue.use(ElementUI, { locale })
-// 如果想要中文版 element-ui，按如下方式声明
-// Vue.use(ELEMENT)
-// Vue.use(WeVue)
 
 Vue.use(VueWechatTitle)
 
-// 有赞的移动UI
-Vue.use(Popup);
-Vue.use(Search);
-Vue.use(Button);
-Vue.use(Cell);
-Vue.use(CellGroup);
-Vue.use(Image);
-Vue.use(List);
-Vue.use(PullRefresh);
-Vue.use(SwipeCell);
-Vue.use(Col);
-Vue.use(Row);
-Vue.use(Divider);
-Vue.use(Sticky);
-Vue.use(NavBar);
-Vue.use(Icon);
-Vue.use(Tabbar);
-Vue.use(TabbarItem);
-Vue.use(ActionSheet);
-Vue.use(Field);
-Vue.use(Overlay);
-Vue.use(Checkbox);
-Vue.use(CheckboxGroup);
-Vue.use(Grid);
-Vue.use(GridItem);
 
 Vue.use(uploader)
 Vue.use(EVueContextmenu)
 
+Vue.component('Aplayer', VueAPlayer)
+VueAPlayer.disableVersionBadge = true
+
 Vue.config.productionTip = false
 
 new Vue({
@@ -100,7 +51,6 @@ new Vue({
   render: h => h(App),
 })
 import config from '../package.json'
-// import {ElementUIComponent} from "element-ui/types/component";
 console.log(
   `%c jmal-cloud-view %c v${config.version} %c`,
   'background:#35495e ; padding: 1px; border-radius: 3px 0 0 3px;  color: #fff',
diff --git a/src/utils/request.js b/src/utils/request.js
index 08e03b2..73b9eac 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -1,4 +1,3 @@
-import axios from 'axios'
 // import { MessageBox, Message } from 'element-ui'
 import store from '@/store'
 import { getToken } from '@/utils/auth'
@@ -44,7 +43,7 @@ service.interceptors.response.use(
     const res = response.data
     if (res.code !== 0) {
       if (res.code === -2) {
-        Message({
+        Vue.prototype.$message({
           message: res.message || '服务器开小差了...',
           type: 'warning',
           duration: 2 * 1000
@@ -54,7 +53,7 @@ service.interceptors.response.use(
         setTimeout(function () {
           const hasToken = getToken()
           if(hasToken){
-            MessageBox.confirm('登录已失效，请重新登录', '确认登出', {
+            Vue.prototype.$confirm('登录已失效，请重新登录', '确认登出', {
               confirmButtonText: '重新登录',
               cancelButtonText: '取消',
               type: 'warning'
@@ -66,7 +65,7 @@ service.interceptors.response.use(
           }
         },200)
       } else {
-        Message({
+        Vue.prototype.$message({
           message: res.message || '服务器开小差了...',
           type: 'error',
           duration: 3 * 1000
@@ -79,7 +78,7 @@ service.interceptors.response.use(
         message = res.message.toString()
       }
       if(message !== 'true'){
-        Message({
+        Vue.prototype.$message({
           message: res.message,
           type: 'success',
           duration: 1000
@@ -89,7 +88,7 @@ service.interceptors.response.use(
     }
   },
   error => {
-    Message({
+    Vue.prototype.$message({
       message: '哎呀！服务器出错了，请稍后再试！',
       type: 'error',
       duration: 5 * 1000
diff --git a/src/views/home/mobile/index.vue b/src/views/home/mobile/index.vue
index 39cf525..25e86b0 100644
--- a/src/views/home/mobile/index.vue
+++ b/src/views/home/mobile/index.vue
@@ -234,43 +234,18 @@
   </div>
 </template>
 <script>
-  import 'vant/lib/button/style';
-  import 'vant/lib/cell/style';
-  import 'vant/lib/cell-group/style'
-  import 'vant/lib/image/style';
-  import 'vant/lib/list/style';
-  import 'vant/lib/pull-refresh/style';
-  import 'vant/lib/swipe-cell/style';
-  import 'vant/lib/col/style';
-  import 'vant/lib/row/style';
-  import 'vant/lib/divider/style';
-  import 'vant/lib/sticky/style';
-  import 'vant/lib/nav-bar/style';
-  import 'vant/lib/icon/style';
-  import 'vant/lib/tabbar/style';
-  import 'vant/lib/tabbar-item/style';
-  import 'vant/lib/dialog/style';
-  import 'vant/lib/field/style';
-  import 'vant/lib/toast/style';
-  import 'vant/lib/overlay/style';
-  import 'vant/lib/notify/style';
-  import 'vant/lib/checkbox/style';
-  import 'vant/lib/checkbox-group/style';
-  import 'vant/lib/popup/style';
-  import 'vant/lib/search/style';
 
   import { mapGetters } from 'vuex'
   import {formatSize, formatTime, strlen, substring10} from '@/utils/number'
   import api from '@/api/file-api'
   import IconFile from "../../../components/Icon/IconFile";
   import Bus from '@/assets/js/bus'
-  import {Dialog, Notify, Toast} from 'vant';
   import {getPath, getPathList, removePath, setPath} from '@/utils/path'
   import fileConfig from "@/utils/file-config";
   let pinyin = require("pinyin");
 
   export default {
-    components: {IconFile,[Dialog.Component.name]: Dialog.Component},
+    components: {IconFile},
     computed: {
       ...mapGetters([
         'name',
diff --git a/src/views/public/share/shareList.vue b/src/views/public/share/shareList.vue
index 70d1d61..19a473e 100644
--- a/src/views/public/share/shareList.vue
+++ b/src/views/public/share/shareList.vue
@@ -229,10 +229,6 @@
 </template>
 
 <script>
-  import 'vant/lib/grid/style';
-  import 'vant/lib/grid-item/style';
-  import 'vant/lib/checkbox/style';
-  import 'vant/lib/checkbox-group/style';
   import { mapGetters } from 'vuex'
   import { strlen, substring10, formatTime, formatSize } from '@/utils/number'
   import Bus from '@/assets/js/bus'
diff --git a/src/views/share/index.vue b/src/views/share/index.vue
index a6818a7..88be314 100644
--- a/src/views/share/index.vue
+++ b/src/views/share/index.vue
@@ -161,14 +161,8 @@
   import { strlen, substring10, formatTime, formatSize } from '@/utils/number'
   import api from '@/api/file-api'
   import Clipboard from 'clipboard';
-  import 'pl-table/themes/index.css';
-  // import 'pl-table/themes/plTableStyle.css';
-  import { PlTable, PlTableColumn } from 'pl-table';
   export default {
-    components: { ShowFile, EmptyFile, IconFile,
-      PlTable,
-      PlTableColumn,
-    },
+    components: { ShowFile, EmptyFile, IconFile},
     props: {
       emptyStatus: {
         'type': String,