Przeglądaj źródła

update views/disk/DiskFile.vue

reghao 3 dni temu
rodzic
commit
15f4dfe110
1 zmienionych plików z 60 dodań i 67 usunięć
  1. 60 67
      src/views/disk/DiskFile.vue

+ 60 - 67
src/views/disk/DiskFile.vue

@@ -113,7 +113,7 @@
           </div>
         </template>
 
-        <template v-else-if="fileType === 1006">
+        <template v-else-if="fileType === 1007">
           <iframe :src="getPdfUrl(fileDetail.url)" width="100%" height="600px" frameborder="0" />
         </template>
 
@@ -149,7 +149,6 @@
         class="uploader-app"
         @file-added="onFileAdded"
         @file-success="onFileSuccess"
-        @file-progress="onFileProgress"
         @file-error="onFileError"
         @complete="onUploadComplete"
       >
@@ -353,41 +352,79 @@ export default {
     // 动态图标映射
     getFileIcon(type) {
       const iconMap = {
-        1000: 'el-icon-folder-opened',
-        1001: 'el-icon-picture-outline',
-        1002: 'el-icon-video-play',
-        1003: 'el-icon-headset',
-        1004: 'el-icon-document',
-        1005: 'el-icon-files'
+        1000: 'el-icon-folder', // Folder
+        1001: 'el-icon-picture', // Image
+        1002: 'el-icon-video-camera', // Video
+        1003: 'el-icon-headset', // Audio
+        1004: 'el-icon-document', // Text
+        1005: 'el-icon-set-up', // Other (Application / 应用程序/设置)
+        1006: 'el-icon-files', // Any (*/* / 所有文件通配)
+        1007: 'el-icon-document-checked', // DocPdf (PDF / 带有校验感的特殊文档)
+        1008: 'el-icon-document-copy', // DocWord (Word / 复合文档)
+        1009: 'el-icon-data-analysis', // DocExcel (Excel / 数据图表)
+        1010: 'el-icon-monitor' // DocPpt (PPT / 演示文稿/显示器投影)
       }
       return iconMap[type] || 'el-icon-files'
     },
-
     getIconStyle(type) {
       const colorMap = {
-        1000: '#ffca28', // 文件夹黄
-        1001: '#4caf50', // 图片绿
-        1002: '#f44336', // 视频红
-        1003: '#9c27b0' // 音频紫
+        1000: '#f59e0b', // Folder (琥珀黄 - 经典的文件夹色)
+        1001: '#10b981', // Image (翡翠绿 - 代表多媒体图片)
+        1002: '#ef4444', // Video (番茄红 - 视频/播放按钮常用色)
+        1003: '#8b5cf6', // Audio (熏衣紫 - 音乐/声波律动色)
+        1004: '#6b7280', // Text (中性灰 - 代表纯文本/代码)
+        1005: '#3b82f6', // Other/Application (天空蓝 - 操作系统与应用软件常用色)
+        1006: '#9ca3af', // Any (浅灰色 - 代表通配或未知类型)
+        1007: '#dc2626', // DocPdf (正红色 - 契合 Adobe PDF 的标准标志色)
+        1008: '#2563eb', // DocWord (深蓝色 - 契合 Microsoft Word 的官方蓝色)
+        1009: '#16a34a', // DocExcel (深绿色 - 契合 Microsoft Excel 的官方绿色)
+        1010: '#ea580c' // DocPpt (橘红色 - 契合 Microsoft PPT 的官方橙色)
       }
-      return { color: colorMap[type] || '#909399', fontSize: '22px', marginRight: '12px' }
+      return { color: colorMap[type] || '#64748b', fontSize: '24px' }
     },
     // ****************************************************************************************************************
+    // Simple Uploader 文件上传
+    // ****************************************************************************************************************
+    onClickUpload() {
+      // 确保上传到当前正在浏览的目录
+      this.uploadForm.pid = this.currentPid
+
+      getDiskChannelInfo().then(resp => {
+        if (resp.code === 0) {
+          const respData = resp.data
+          this.uploadForm.channelCode = respData.channelCode
+          this.options = {
+            target: resp.data.ossUrl,
+            chunkSize: 1024 * 1024 * 10, // 手机端改为 5M 切片更稳定
+            maxChunkRetries: 2,
+            fileParameterName: 'file',
+            testChunks: false, // 不发送 GET 请求获取已上传的分片
+            // 服务器分片校验函数, 秒传及断点续传基础
+            checkChunkUploadedByResponse: (chunk, message) => {
+              // 上传文件到 oss 后的响应
+              const obj = JSON.parse(message)
+              return obj.data.uploaded
+              // return (obj.data.uploaded || []).indexOf(chunk.offset + 1) >= 0
+            },
+            query: () => ({ channelCode: resp.data.channelCode, multiparts: '' }),
+            headers: { Authorization: 'Bearer ' + resp.data.token }
+          }
+
+          this.showUploadDialog = true
+        } else {
+          this.$message.error('获取 OSS 服务器地址失败, 暂时无法上传文件')
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
     onFileAdded(file) {
       if (file.file.size > 1024 * 1024 * 1024 * 20) {
         this.$message.warning('上传的文件应小于 20GB')
         return
       }
       file.pause()
-      hashFile(file.file).then(result => {
-        this.startUpload(result.sha256sum, file)
-      })
-    },
-    startUpload(sha256sum, file) {
-      file.uniqueIdentifier = sha256sum
-      file.resume()
-    },
-    onFileProgress(rootFile, file, chunk) {
+      hashFile(file.file).then(res => { file.uniqueIdentifier = res.sha256sum; file.resume() })
     },
     onFileSuccess(rootFile, file, response, chunk) {
       const resp = JSON.parse(response)
@@ -418,55 +455,11 @@ export default {
         this.changeDirectory(this.queryForm.path)
       }, 1000)
     },
-
     // 修改原来的 handleUploadClose
     handleUploadClose() {
       this.showUploadDialog = false
       // 可以在这里提示:关闭弹窗不会停止后台上传(取决于 simple-uploader 配置)
     },
-    onClickUpload() {
-      // 确保上传到当前正在浏览的目录
-      this.uploadForm.pid = this.currentPid
-
-      getDiskChannelInfo().then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.uploadForm.channelCode = respData.channelCode
-          this.options = {
-            target: respData.ossUrl,
-            // 分块大小 10MB
-            chunkSize: 1024 * 1024 * 10,
-            // 失败自动重传次数
-            maxChunkRetries: 3,
-            fileParameterName: 'file',
-            testChunks: true,
-            // 服务器分片校验函数, 秒传及断点续传基础
-            checkChunkUploadedByResponse: (chunk, message) => {
-              // 上传文件到 oss 后的响应
-              const obj = JSON.parse(message)
-              return obj.data.uploaded
-              // return (obj.data.uploaded || []).indexOf(chunk.offset + 1) >= 0
-            },
-            query: (file, chunk) => {
-              return {
-                channelCode: respData.channelCode,
-                multiparts: ''
-              }
-            },
-            headers: {
-              Authorization: 'Bearer ' + respData.token
-            },
-            withCredentials: false
-          }
-
-          this.showUploadDialog = true
-        } else {
-          this.$message.error('获取 OSS 服务器地址失败, 暂时无法上传文件')
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
     // ****************************************************************************************************************
     handleDownload(file) {
       if (!file || !file.url) return