Browse Source

更新 DiskFile.vue 中对 pdf 文件类型的显示

reghao 6 months ago
parent
commit
3c96e58a8e
1 changed files with 20 additions and 5 deletions
  1. 20 5
      src/views/disk/DiskFile.vue

+ 20 - 5
src/views/disk/DiskFile.vue

@@ -47,19 +47,25 @@
             <span v-if="scope.row.fileType === 1000" class="el-icon-folder">
               <a style="text-decoration-line: none" href="javascript:void(0)" @click="onClickFilename(scope.row)">{{ scope.row.filename }}</a>
             </span>
-            <span v-if="scope.row.fileType === 1001" class="el-icon-picture">
+            <span v-else-if="scope.row.fileType === 1001" class="el-icon-picture">
               <a style="text-decoration-line: none" href="javascript:void(0)" @click="onClickFilename(scope.row)">{{ scope.row.filename }}</a>
             </span>
-            <span v-if="scope.row.fileType === 1002" class="el-icon-film">
+            <span v-else-if="scope.row.fileType === 1002" class="el-icon-film">
               <a style="text-decoration-line: none" href="javascript:void(0)" @click="onClickFilename(scope.row)">{{ scope.row.filename }}</a>
             </span>
-            <span v-if="scope.row.fileType === 1003" class="el-icon-headset">
+            <span v-else-if="scope.row.fileType === 1003" class="el-icon-headset">
               <a style="text-decoration-line: none" href="javascript:void(0)" @click="onClickFilename(scope.row)">{{ scope.row.filename }}</a>
             </span>
-            <span v-if="scope.row.fileType === 1004" class="el-icon-document">
+            <span v-else-if="scope.row.fileType === 1004" class="el-icon-document">
               <a style="text-decoration-line: none" href="javascript:void(0)" @click="onClickFilename(scope.row)">{{ scope.row.filename }}</a>
             </span>
-            <span v-if="scope.row.fileType === 1005" class="el-icon-files">
+            <span v-else-if="scope.row.fileType === 1005" class="el-icon-files">
+              <a style="text-decoration-line: none" href="javascript:void(0)" @click="onClickFilename(scope.row)">{{ scope.row.filename }}</a>
+            </span>
+            <span v-else-if="scope.row.fileType === 1006" class="el-icon-files">
+              <a style="text-decoration-line: none" href="javascript:void(0)" @click="onClickFilename(scope.row)">{{ scope.row.filename }}</a>
+            </span>
+            <span v-else class="el-icon-files">
               <a style="text-decoration-line: none" href="javascript:void(0)" @click="onClickFilename(scope.row)">{{ scope.row.filename }}</a>
             </span>
           </template>
@@ -138,6 +144,12 @@
           <el-col v-else-if="fileType === 1005" :md="12">
             文件
           </el-col>
+          <el-col v-else-if="fileType === 1006" :md="12">
+            <iframe :src="getPdfUrl(fileDetail.url)" width="100%" height="480px"></iframe>
+          </el-col>
+          <el-col v-else :md="12">
+            未知文件类型
+          </el-col>
         </el-row>
       </div>
     </el-dialog>
@@ -504,6 +516,9 @@ export default {
         })
       }
     },
+    getPdfUrl(url) {
+      return '/pdfjs/web/viewer.html?file=' + encodeURIComponent(url)
+    },
     // ****************************************************************************************************************
     onCreateFolder() {
       this.showCreateFolderDialog = true