预览word,img前后移动

src/main/vue/package.json

@@ -20,7 +20,7 @@
     "date-fns": "^2.14.0",
     "echarts": "^5.1.1",
     "echarts-gl": "^2.0.4",
-    "element-ui": "^2.13.2",
+    "element-ui": "2.15.2",
     "normalize.css": "^8.0.1",
     "qs": "^6.10.1",
     "resolve-url": "^0.2.1",

src/main/vue/src/components/FileUpload.vue

@@ -26,6 +26,16 @@
                         v-if="file.status === 'success' && isImage(file)"
                         @click="preview(file)"
                     ></i>
+                    <i
+                        class="opt-icon el-icon-search"
+                        v-if="file.status === 'success' && isPdf(file)"
+                        @click="previewPdf(file)"
+                    ></i>
+                    <i
+                        class="opt-icon el-icon-search"
+                        v-if="file.status === 'success' && isDoc(file)"
+                        @click="previewDoc(file)"
+                    ></i>
                     <i class="opt-icon el-icon-download" v-if="file.status === 'success'" @click="download(file)"></i>
                     <i class="opt-icon el-icon-delete" @click="removeFile(file)" v-if="!readonly"></i>
                 </i>
@@ -38,8 +48,7 @@
                 class="upload-progress"
             ></el-progress>
         </div>
-        <el-image style="width:0;height:0;" :src="previewUrl" :preview-src-list="[previewUrl]" ref="preview">
-        </el-image>
+        <el-image style="width:0;height:0;" :src="previewUrl" :preview-src-list="previewList" ref="preview"> </el-image>
     </el-upload>
 </template>
 
@@ -95,6 +104,15 @@ export default {
         },
         disabled() {
             return this.fileList.length >= this.limit;
+        },
+        previewList() {
+            return [...this.fileList]
+                .filter(item => {
+                    return this.isImage(item);
+                })
+                .map(item => {
+                    return item.url;
+                });
         }
     },
     created() {
@@ -156,9 +174,21 @@ export default {
                 this.$refs.preview.clickHandler();
             });
         },
+        previewDoc(file) {
+            window.open('https://view.officeapps.live.com/op/view.aspx?src=' + file.url, '_blank');
+        },
+        previewPdf(file) {
+            window.open(this.$baseUrl + '/pdf/web/viewer.html?file=' + file.url, '_blank');
+        },
         isImage(file) {
             return /\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(file.url);
         },
+        isPdf(file) {
+            return /\.(pdf)$/i.test(file.url);
+        },
+        isDoc(file) {
+            return /\.(docx|doc)$/i.test(file.url);
+        },
         emit() {
             this.emitting = true;
             if (this.filesLimit === 1) {

src/main/vue/src/plugins/http.js

@@ -5,7 +5,7 @@ import qs from 'qs';
 let baseUrl = 'http://localhost:8080';
 switch (process.env.NODE_ENV) {
     case 'development':
-        baseUrl = 'http://192.168.50.190:8080/';
+        baseUrl = 'http://192.168.50.190:8080';
         // baseUrl = 'http://wlj.izouma.com';
         break;
     case 'test':

src/main/vue/yarn.lock

@@ -3257,10 +3257,10 @@ element-resize-detector@^1.1.15:
   dependencies:
     batch-processor "1.0.0"
 
-element-ui@^2.13.2:
-  version "2.13.2"
-  resolved "https://registry.npm.taobao.org/element-ui/download/element-ui-2.13.2.tgz?cache=0&sync_timestamp=1589795164194&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Felement-ui%2Fdownload%2Felement-ui-2.13.2.tgz#582bf47aaaaaafe23ea1958fae217a687ad06447"
-  integrity sha1-WCv0eqqqr+I+oZWPriF6aHrQZEc=
+element-ui@2.15.2:
+  version "2.15.2"
+  resolved "https://registry.yarnpkg.com/element-ui/-/element-ui-2.15.2.tgz#1b4c4af582a37061de7d8146047a34f0099b52cc"
+  integrity sha512-S66VvOt1AR698uzxAnJeajnIPI1eIzlkKXHx2F2v94PAs/8JuyRcLOUGy100mJHIIaSkRlxVOtI+As2XTB8Oew==
   dependencies:
     async-validator "~1.8.1"
     babel-helper-vue-jsx-merge-props "^2.0.0"