Pārlūkot izejas kodu

Merge branch 'master' of http://60.205.254.193:3000/GCLS/GCLS_Page_Textbook

dusenyao 1 gadu atpakaļ
vecāks
revīzija
89885f5e6a

+ 3 - 38
src/views/book/courseware/create/components/base/audio/Audio.vue

@@ -2,7 +2,7 @@
   <ModuleBase :type="data.type">
     <template #content>
       <UploadFile
-        id="AudioUploadPage"
+        :id="data.id"
         :module-data="data"
         :label-text="labelText"
         :accept-file-type="acceptFileType"
@@ -25,7 +25,7 @@ export default {
   data() {
     return {
       data: getAudioData(),
-      file_info_list: [],
+      file_list: [],
       labelText: '音频',
       acceptFileType: '.mp3,.acc,.wma',
       uploadTip: '支持上传mp3、acc、wma,等格式音频文件,单个文件最大100MB,总文件体积不超1G。',
@@ -33,42 +33,7 @@ export default {
     };
   },
   computed: {},
-  methods: {
-    onFileChange(file, fileList) {
-      console.log(fileList);
-      this.file_info_list = fileList;
-    },
-    removeFile(file, i) {
-      this.$refs.upload.handleRemove(file);
-      this.file_info_list.splice(i, 1);
-    },
-    beforeAudioUpload(file) {
-      const fileName = file.name;
-      const suffix = fileName.slice(fileName.lastIndexOf('.') + 1, fileName.length).toLowerCase();
-      const isNeedType = ['mp3', 'acc', 'wma'].includes(suffix);
-      if (!isNeedType) {
-        this.$message.error('音频文件只能是 mp3、acc、wma 格式!');
-        return false;
-      }
-
-      const isLt100M = file.size / 1024 / 1024 < 100;
-      if (!isLt100M) {
-        this.$message.error('单个音频文件大小不能超过 100MB!');
-        return false;
-      }
-
-      const isExceed1GB =
-        file.size + (this.$refs.upload.uploadFiles || []).reduce((acc, cur) => acc + cur.size, 0) > 1024 * 1024 * 1024;
-      // 限制总文件大小为 1GB
-      if (isExceed1GB) {
-        this.$message.error('总文件大小不能超过 1GB');
-        return false;
-      }
-    },
-    uploadAudio() {
-      this.$refs.upload.submit();
-    },
-  },
+  methods: {},
 };
 </script>
 

+ 5 - 1
src/views/book/courseware/create/components/base/audio/AudioSetting.vue

@@ -3,7 +3,7 @@
     <el-form :model="property" :label-position="labelPosition" label-width="72px">
       <el-form-item label="序号" class="serial-number">
         <el-input v-model="property.serial_number" />
-        <SvgIcon icon-class="switch" size="14" @click="switchSerialNumber(property)" />
+        <SvgIcon icon-class="switch" size="16" @click="switchSerialNumber(property)" />
       </el-form-item>
       <el-form-item>
         <el-radio
@@ -159,6 +159,10 @@ export default {
       align-items: center;
       justify-content: space-between;
     }
+
+    .svg-icon {
+      cursor: pointer;
+    }
   }
 
   .el-input {

+ 28 - 13
src/views/book/courseware/create/components/base/common/UploadFile.vue

@@ -21,14 +21,15 @@
     <el-divider />
     <div class="upload-tip">{{ uploadTip }}</div>
     <ul slot="file-list" class="file-list">
-      <li v-for="(file, i) in file_info_list" :key="i">
+      <li v-for="(file, i) in file_list" :key="i">
         <div class="file-name">
           <span>
             <SvgIcon :icon-class="iconClass" size="12" />
             <span>{{ file.file_name ?? file.name }}</span>
             <!-- <span>({{ file.size }})</span> -->
           </span>
-          <span v-show="file.progress > 0"> {{ file.progress }}% </span>
+          <span v-show="file.progress > 0 && file.progress < 100"> {{ file.progress }}% </span>
+          <span v-show="file.file_id"> 完成 </span>
         </div>
         <SvgIcon icon-class="delete-black" size="12" @click="removeFile(file, i)" />
         <SvgIcon v-show="moduleData.type == 'picture'" icon-class="mark" size="12" @click="viewDialog(file)" />
@@ -79,7 +80,8 @@ export default {
     return {
       curFile: null,
       conversionSize,
-      file_info_list: [],
+      file_id_list: [],
+      file_list: [],
       visible: false,
     };
   },
@@ -89,13 +91,13 @@ export default {
     // 显示自定义样式文件列表
     onFileChange(file, fileList) {
       this.afterSelectFile(file);
-
+      console.log(123);
       fileList.forEach((file) => {
         if (!file.progress || file.progress <= 0) file.progress = 0;
         if (!file.title) file.title = '';
         if (!file.describe) file.describe = '';
       });
-      this.file_info_list = fileList;
+      this.file_list = fileList;
     },
 
     // 删除文件
@@ -107,7 +109,10 @@ export default {
       })
         .then(() => {
           this.$refs.upload.handleRemove(file);
-          // this.file_info_list.splice(i, 1);
+          if (this.file_list[i].file_id) {
+            this.file_list.splice(i, 1);
+            this.file_id_list.splice(i, 1);
+          }
         })
         .catch(() => {});
     },
@@ -115,6 +120,7 @@ export default {
     // 文件校验
     afterSelectFile(file) {
       const fileName = file.name;
+      console.log(this.moduleData.single_size);
       let singleSizeTip = `文件[${fileName}]大小超过 ${conversionSize(this.moduleData.single_size)},被移除!`;
 
       if (file.size > this.moduleData.single_size * 1024 * 1024) {
@@ -145,27 +151,34 @@ export default {
 
     // 上传文件
     uploadFiles() {
-      const files = this.$refs.upload.uploadFiles || [];
+      const files = (this.file_list || []).filter((file) => file.uid);
+      if (files.length <= 0) {
+        this.$message.error('没有需要上传的文件!');
+        return false;
+      }
       const totalSize = files.reduce((sum, cur) => sum + Number(cur.size || 0), 0);
       if (totalSize > this.moduleData.total_size * 1024 * 1024) {
         this.$message.error(`文件总大小不能超过${conversionSize(this.moduleData.total_size)}`);
         return false;
       }
+
       files.forEach((file) => {
         let form = new FormData();
         form.append(file.name, file.raw, file.name);
         fileUpload('Mid', form, {
           handleUploadProgress: (progressEvent) => {
-            let en = this.file_info_list.find((p) => p.uid === file.uid);
             let per = Number((progressEvent.progress * 100).toFixed(2) || 0);
+            let en = this.file_list.find((p) => p.uid === file.uid);
             if (en) {
               en.progress = per;
               this.$forceUpdate();
             }
           },
         }).then(({ file_info_list }) => {
-          if (file_info_list.length > 0) {
-            this.file_info_list = file_info_list;
+          let file_index = this.file_list.findIndex((p) => p.uid === file.uid);
+          if (file_index > -1) {
+            this.file_list[file_index] = file_info_list[0];
+            this.file_id_list.push(file_info_list[0].file_id);
           }
         });
       });
@@ -175,12 +188,11 @@ export default {
     viewDialog(file) {
       this.visible = true;
       this.curFile = file;
-      console.info(file);
     },
 
     // 给文件加介绍
     fillDescribeToFile(file) {
-      let en = this.file_info_list.find((p) => p.uid === file.uid);
+      let en = this.file_list.find((p) => p.uid === file.uid);
       if (en) {
         Object.assign(en, file);
       }
@@ -258,7 +270,6 @@ export default {
         column-gap: 14px;
         align-items: center;
         justify-content: space-between;
-        width: 360px;
         max-width: 360px;
         padding: 8px 12px;
         font-size: 14px;
@@ -271,6 +282,10 @@ export default {
           align-items: center;
         }
       }
+
+      .svg-icon {
+        cursor: pointer;
+      }
     }
   }
 }

+ 4 - 4
src/views/book/courseware/create/components/common/FillDescribe.vue

@@ -1,7 +1,7 @@
 <template>
   <el-dialog :visible="visible" width="260px" top="38vh" :show-close="false" @close="dialogClose">
-    <el-input v-model="form.title" autocomplete="off" placeholder="标题" />
-    <el-input v-model="form.describe" type="textarea" placeholder="介绍" />
+    <el-input v-model="form.file_title" autocomplete="off" placeholder="标题" />
+    <el-input v-model="form.file_describe" type="textarea" placeholder="介绍" />
     <template slot="footer">
       <el-button size="medium" @click="dialogClose">取消</el-button>
       <el-button type="primary" size="medium" @click="confirm">确定</el-button>
@@ -26,8 +26,8 @@ export default {
     return {
       form: {
         uid: '',
-        title: '',
-        describe: '',
+        file_title: '',
+        file_describe: '',
       },
     };
   },

+ 9 - 1
src/views/book/courseware/data/audio.js

@@ -5,7 +5,7 @@ export function getAudioData() {
     id: '1',
     type: 'audio',
     title: '音频',
-    single_size: 10, // 单位MB
+    single_size: 1000, // 单位MB
     total_size: 1024, // 单位MB
     property: {
       serial_number: 1, // 序号
@@ -14,5 +14,13 @@ export function getAudioData() {
       sn_generation_method: snGenerationMethodList[0].value, // 序号生成方式:recalculate重新计算 follow 跟随
       view_method: audioViewMethodList[0].value, // 查看方式:independent独立 list列表 icon图标
     },
+    file_id_list: [], // 文件 id['20032-121212', '20032-121216']
+    // 内容中包含的文件列表,
+    file_list: [
+      {
+        file_id: '',
+        file_url: '',
+      },
+    ],
   };
 }

+ 11 - 1
src/views/book/courseware/data/picture.js

@@ -9,10 +9,20 @@ export function getPictureData() {
     total_size: 100, // 单位MB
     property: {
       serial_number: 1, // 序号
-      sn_type: 'letter', //序号类型:letter字母 number数字  capital大写字母 bracket_number括号数字
+      sn_type: 'letter', // 序号类型:letter字母 number数字  capital大写字母 bracket_number括号数字
       sn_position: 'top-start', // 序号位置:top-start top top-end,left-start left left-end等
       sn_generation_method: snGenerationMethodList[0].value, // 序号生成方式:recalculate重新计算 follow跟随
       view_method: viewMethodList[0].value, // 查看方式:independent独立 list列表 icon图标
     },
+    file_id_list: [], // 文件 id['20032-121212', '20032-121216']
+    // 内容中包含的文件列表,
+    file_list: [
+      {
+        file_id: '',
+        file_url: '',
+        file_title: '', // 标题
+        file_describe: '', // 介绍
+      },
+    ],
   };
 }