文档上传功能完善

src/components/Selects/SelectResource.vue

 <template>
-  <el-dialog :model-value="visible" :append-to-body="true" :title="title" width="600px" @close="handleClose">
+  <el-dialog :model-value="visible" :append-to-body="true" :title="title" width="800px" @close="handleClose">
     <el-form class="filter-container" inline label-width="100px" size="mini">
       <el-form-item label="资源名称">
         <el-input v-model="queryParams.resourceName"/>
@@ -16,7 +16,8 @@
       <el-table-column label="资源类型" prop="resourceType" :width="200">
         <template #default="scope">
           <span>{{ resourceTypeEnums[scope.row.resourceType] }}</span><br>
-          <span>{{ formatDuring(scope.row.videoLength * 1000) }}</span>
+          <span v-if="scope.row.resourceType<3">{{ formatDuring(scope.row.videoLength * 1000) }}</span>
+          <span v-else>{{ scope.row.docPage }} 页</span>
         </template>
       </el-table-column>
       <el-table-column label="操作" width="100">

src/components/Upload/FixedUploadPanel.vue

@@ -6,32 +6,41 @@
         <div class="upload_text">{{ $t('uploader.upload') }}（{{ successList.length }}/{{ fileList.length }}）</div>
         <div class="dialog_btn">
           <el-icon v-if="hideList" class="" :title="$t('uploader.showList')"
-            @click="hideList = false"><FullScreen /></el-icon>
+                   @click="hideList = false"
+          >
+            <FullScreen/>
+          </el-icon>
           <el-icon v-else class="ctrl_min_btn" :title="$t('uploader.min')" @click="hideList = true">
-            <Connection />
+            <Connection/>
           </el-icon>
           <el-icon class="close_btn" :title="$t('uploader.closeList')" @click="handleClosePanel">
-            <Close />
+            <Close/>
           </el-icon>
         </div>
       </div>
       <div v-show="!hideList" class="upload_file_list">
         <div v-for="item in fileList" :key="item.uid" class="upload_file_item">
-          <div class="file_type"><i :class="item.type | fileType" /></div>
+          <div class="file_type"><i :class="item.type | fileType"/></div>
           <div class="file_name">{{ item.name }}</div>
           <div class="file_size">{{ getSize(item.size) }}</div>
           <div class="file_progress_number">{{ item.progress }} %</div>
           <div class="file_status c-brand">{{ tipList[item.status] }}</div>
           <div v-if="item.status === 'uploading'" class="file_ctrl_btn" @click.stop="stopUpload(item)">
-            <el-icon class=""><el-icon-video-pause /></el-icon>
+            <el-icon class="">
+              <el-icon-video-pause/>
+            </el-icon>
           </div>
           <div v-if="item.status === 'fail'" class="file_ctrl_btn" @click.stop="startUpload(item)">
-            <el-icon class=""><el-icon-video-play /></el-icon>
+            <el-icon class="">
+              <el-icon-video-play/>
+            </el-icon>
           </div>
           <div v-if="item.status === 'stop'" class="file_ctrl_btn" @click.stop="resumeUpload(item)">
-            <el-icon class=""><el-icon-video-play /></el-icon>
+            <el-icon class="">
+              <el-icon-video-play/>
+            </el-icon>
           </div>
-          <div class="file_progress" :style="{ width: item.progress + '%' }" />
+          <div class="file_progress" :style="{ width: item.progress + '%' }"/>
         </div>
       </div>
     </div>
@@ -41,14 +50,14 @@
 <script>
 import uploadVideo from '@/utils/mixin/uploadVideo';
 import uploadFiles from '@/utils/mixin/UploadFiles';
-import { getSize } from '@/utils/utils';
-import { saveResource } from '@/api/upload';
+import {getSize} from '@/utils/utils';
+import {saveResource} from '@/api/upload';
 import bus from '@/utils/bus';
-import { FullScreen, Close, Connection } from '@element-plus/icons-vue'
+import {FullScreen, Close, Connection} from '@element-plus/icons-vue'
 
 export default {
   name: 'FixedUploadPanel',
-  components: { FullScreen, Close, Connection },
+  components: {FullScreen, Close, Connection},
   filters: {
     fileType(val) {
       if (val === 'image') {
@@ -65,7 +74,7 @@ export default {
   data() {
     return {
       that: this,
-      fileTypeInt: { 'video': 1, 'audio': 2, 'document': 3, 'zip': 5, 'image': 4 },
+      fileTypeInt: {'video': 1, 'audio': 2, 'document': 3, 'zip': 5, 'image': 4},
       hideList: false,
       files: [],
       tipList: {
@@ -107,7 +116,7 @@ export default {
   mounted() {
     // console.log(this.$store.getters)
     const _that = this
-    window.onbeforeunload = function (e) {
+    window.onbeforeunload = function(e) {
       const event = window.event || e;
       if (_that.successList.length !== _that.fileList.length) {
         event.returnValue = (_that.$t('uploader.noUploadSuccess'));
@@ -147,12 +156,10 @@ export default {
         resourceType: this.fileTypeInt[fileInfo.type],
         resourceName: data.materialName,
         resourceSize: fileInfo.materialSize,
-        resourceUrl: data.materialUrl,
-        vodModel: fileInfo.vodModel,
-        countPage: data.pageCount,
+        resourceUrl: data.materialUrl || data.docUrl,
+        docPage: data.pageCount,
         width: data.width,
         height: data.height,
-        videoVid: '',
         ...fileInfo.custom
       }
       if (data.vid || data.fid) {
@@ -261,6 +268,7 @@ export default {
   .dialog_btn {
     text-align: right;
     width: 100px;
+
     .ctrl_min_btn {
       transform: rotateX(180deg);
     }

src/components/Upload/UploaderBtn.vue

@@ -356,6 +356,8 @@ export default {
         }
         if (data.vid) {
           form.videoVid = data.vid
+        } else {
+          form.resourceUrl = data.url
         }
         fileInfo.status = 'save'
         saveResource(form).then(res => {
@@ -384,7 +386,7 @@ export default {
         if (data.vid) {
           form.vid = data.vid
         } else {
-          form.ossUrl = data.url
+          form.resourceUrl = data.url
         }
         fileInfo.status = 'save'
         saveResource(form).then(res => {

src/utils/mixin/UploadFiles.js

@@ -45,7 +45,6 @@ export default {
           materialUrl: res.fileUrl,
           materialName: _file.name,
           pageCount: res.pageCount,
-          entConfigType: 1,
           ...res
         }
         console.log(res, _data)

src/views/course/list/chapter/index.vue

@@ -18,7 +18,10 @@
         <template #default="scope">
           <span>{{ scope.row.chapterName }}</span>
           <span>{{ scope.row.periodName }}</span>
-          <span v-if="scope.row.resourceViewResp"> 【{{ resourceTypeEnums[scope.row.resourceViewResp.resourceType] }}：{{ scope.row.resourceViewResp.resourceName }} | {{ formatDuring(scope.row.resourceViewResp.videoLength*1000) }} 】</span>
+          <span v-if="scope.row.resourceViewResp"> 【{{ resourceTypeEnums[scope.row.resourceViewResp.resourceType] }}：{{ scope.row.resourceViewResp.resourceName }} |
+            <span v-if="scope.row.resourceViewResp.resourceType<3">{{ formatDuring(scope.row.resourceViewResp.videoLength * 1000) }}</span>
+            <span v-else>{{ scope.row.resourceViewResp.docPage }} 页</span> 】
+          </span>
         </template>
       </el-table-column>
       <!-- <el-table-column label="章节描述" prop="chapterDesc"/>-->
@@ -62,7 +65,7 @@ import {defineComponent, onMounted, reactive, toRefs} from 'vue';
 import {useStore} from 'vuex';
 import {useRoute} from 'vue-router';
 import {courseChapterDelete, courseChapterEdit, courseChapterPage} from '@/api/course.js'
-import { formatDuring} from '@/utils/utils.js'
+import {formatDuring} from '@/utils/utils.js'
 import Edit from './edit.vue';
 import Add from './add.vue';
 

src/views/course/resource/index.vue

@@ -29,17 +29,20 @@
       <el-table-column label="资源类型" prop="resourceType" :width="200">
         <template #default="scope">
           <span>{{ resourceTypeEnums[scope.row.resourceType] }}</span><br>
-          <span>{{ formatDuring(scope.row.videoLength * 1000) }}</span>
+          <span v-if="scope.row.resourceType<3">{{ formatDuring(scope.row.videoLength * 1000) }}</span>
+          <span v-else>{{ scope.row.docPage }} 页</span>
         </template>
       </el-table-column>
-      <el-table-column label="视频状态" prop="resourceType" :width="100">
+      <el-table-column label="状态" prop="videoStatus" :width="100">
         <template #default="scope">
-          <span>{{ videoStatusEnums[scope.row.videoStatus] }}</span>
+          <span v-if="scope.row.resourceType<3">{{ videoStatusEnums[scope.row.videoStatus] }}</span>
+          <span v-else>成功</span>
         </template>
       </el-table-column>
-      <el-table-column label="视频平台" prop="vodPlatform" :width="100">
+      <el-table-column label="平台" prop="vodPlatform" :width="100">
         <template #default="scope">
-          <span>{{ vodPlatformEnums[scope.row.vodPlatform] }}</span>
+          <span v-if="scope.row.resourceType<3">{{ vodPlatformEnums[scope.row.vodPlatform] }}</span>
+          <span v-else>{{ storagePlatformEnums[scope.row.storagePlatform] }}</span>
         </template>
       </el-table-column>
       <el-table-column label="排序" prop="sort" :width="100"/>
@@ -114,6 +117,7 @@ export default defineComponent({
       statusIdEnums: {},
       resourceTypeEnums: {},
       vodPlatformEnums: {},
+      storagePlatformEnums: {},
       videoStatusEnums: {}
     });
     const store = useStore();
@@ -146,6 +150,9 @@ export default defineComponent({
       store.dispatch('GetOpts', {enumName: 'VodPlatformEnum', type: 'obj'}).then((res) => {
         state.vodPlatformEnums = res;
       });
+      store.dispatch('GetOpts', {enumName: 'StoragePlatformEnum', type: 'obj'}).then((res) => {
+        state.storagePlatformEnums = res;
+      });
       store.dispatch('GetOpts', {enumName: 'VideoStatusEnum', type: 'obj'}).then((res) => {
         state.videoStatusEnums = res;
       });