update

src/components/upload/PublishFile.vue

@@ -4,38 +4,13 @@
       <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
         <el-card class="box-card">
           <div slot="header" class="clearfix">
-            <span>上传视频文件</span>
-          </div>
-          <div class="text item">
-            <uploader
-              class="uploader-example"
-              :options="options"
-              :auto-start="true"
-              @file-added="onFileAdded"
-              @file-success="onFileSuccess"
-              @file-progress="onFileProgress"
-              @file-error="onFileError"
-            >
-              <uploader-unsupport />
-              <uploader-drop>
-                <p>拖动视频文件到此处或</p>
-                <uploader-btn :attrs="attrs">选择视频文件</uploader-btn>
-              </uploader-drop>
-              <uploader-list />
-            </uploader>
-          </div>
-        </el-card>
-      </el-row>
-      <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-        <el-card class="box-card">
-          <div slot="header" class="clearfix">
-            <span>上传用户头像</span>
+            <span>上传 IM 图片</span>
           </div>
           <div class="text item">
             <el-tooltip class="item" effect="dark" content="点击上传图片" placement="top-end">
               <el-upload
                 class="avatar-uploader"
-                :action="actionUrl"
+                :action="imgOssUrl"
                 :headers="imgHeaders"
                 :data="imgData"
                 :with-credentials="true"
@@ -56,14 +31,14 @@
       <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
         <el-card class="box-card">
           <div slot="header" class="clearfix">
-            <span>文件地址</span>
+            <span>OSS 地址</span>
           </div>
           <div class="text item">
             <el-form ref="form" :model="form" label-width="80px">
-              <el-form-item label="文件地址">
+              <el-form-item label="视频地址">
                 <el-input v-model="form.fileUrl" style="padding-right: 1px" readonly />
               </el-form-item>
-              <el-form-item label="头像地址">
+              <el-form-item label="图片地址">
                 <el-input v-model="form.imageUrl" style="padding-right: 1px" readonly />
               </el-form-item>
             </el-form>
@@ -81,33 +56,12 @@ export default {
   name: 'PublishFile',
   data() {
     return {
-      actionUrl: process.env.VUE_APP_OSS_URL,
-      // ****************************************************************************************************************
-      options: {
-        target: process.env.VUE_APP_OSS_URL,
-        chunkSize: 1024 * 1024 * 1024 * 10, // 10GiB
-        fileParameterName: 'file',
-        testChunks: false,
-        query: (file, chunk) => {
-          return {
-            channelId: 2
-          }
-        },
-        headers: {
-          Authorization: ''
-        },
-        withCredentials: true
-      },
-      attrs: {
-        accept: 'video/*'
-      },
-      // ****************************************************************************************************************
       imgOssUrl: null,
       imgHeaders: {
         Authorization: ''
       },
       imgData: {
-        channelId: 4
+        channelId: process.env.VUE_APP_UPLOAD_IMIMG_CHANNEL
       },
       coverUrl: null,
       // ****************************************************************************************************************
@@ -118,30 +72,7 @@ export default {
     }
   },
   created() {
-    getServerInfo(2).then(res => {
-      if (res.code === 0) {
-        const resData = res.data
-        this.options.target = resData.ossUrl
-        this.options.chunkSize = resData.maxSize
-        this.options.headers.Authorization = 'Bearer ' + resData.token
-      } else {
-        this.$notify({
-          title: '提示',
-          message: '获取 OSS 服务器地址失败, 暂时无法上传文件',
-          type: 'error',
-          duration: 3000
-        })
-      }
-    }).catch(error => {
-      this.$notify({
-        title: '提示',
-        message: error.message,
-        type: 'warning',
-        duration: 3000
-      })
-    })
-
-    getServerInfo(4).then(res => {
+    getServerInfo(this.imgData.channelId).then(res => {
       if (res.code === 0) {
         const resData = res.data
         this.imgOssUrl = resData.ossUrl
@@ -166,49 +97,6 @@ export default {
   mounted() {
   },
   methods: {
-    // ****************************************************************************************************************
-    onFileAdded(file) {
-      if (file.file.size > 1024 * 1024 * 1024 * 5) {
-        file.cancel()
-        this.$notify({
-          title: '提示',
-          message: '视频文件应小于 5GiB',
-          type: 'warning',
-          duration: 3000
-        })
-        return
-      }
-    },
-    onFileProgress(rootFile, file, chunk) {
-    },
-    onFileSuccess(rootFile, file, response, chunk) {
-      const res = JSON.parse(response)
-      if (res.code === 0) {
-        const resData = res.data
-        this.form.fileUrl = resData.uploadId
-        this.$notify({
-          title: '提示',
-          message: '视频已上传',
-          type: 'warning',
-          duration: 3000
-        })
-      } else {
-        this.$notify({
-          title: '提示',
-          message: '视频文件上传失败',
-          type: 'warning',
-          duration: 3000
-        })
-      }
-    },
-    onFileError(rootFile, file, response, chunk) {
-      this.$notify({
-        title: '提示',
-        message: '文件上传错误',
-        type: 'warning',
-        duration: 3000
-      })
-    },
     // ****************************************************************************************************************
     beforeAvatarUpload(file) {
       const isJPG = file.type === 'image/jpeg'

src/views/disk/UploadFile.vue

@@ -27,7 +27,7 @@
         <el-card class="box-card">
           <div slot="header" class="clearfix">
             <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-              <span>存储节点: <span style="color: blue">{{ ossUrl }}</span></span>
+              <span>存储节点: <span style="color: red">{{ ossUrl }}</span></span>
             </el-row>
             <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
               <span>上传文件到目录: <span style="color: red">{{ currentDir }}</span></span>