资源上传下载按钮

src/views/book/courseware/create/components/common/ResourcesOperate.vue

@@ -0,0 +1,147 @@
+<template>
+  <div class="resources-operate">
+    <el-tooltip effect="dark" placement="top" content="提交到资源库">
+      <SvgIcon
+        v-if="isEnable(projectResourcePopedom.is_can_upload) && data.file_id"
+        icon-class="upload"
+        @click="handleSubmitToResource(data)"
+      />
+    </el-tooltip>
+    <SvgIcon
+      v-if="isEnable(projectResourcePopedom.is_can_download) && data.file_id"
+      icon-class="download"
+      @click="downLoad(data)"
+    />
+    <el-dialog
+      :visible.sync="visibleSubmitResource"
+      width="500px"
+      append-to-body
+      :show-close="true"
+      title="提交到资源库"
+      :close-on-click-modal="false"
+    >
+      <el-form ref="resourceForm" :model="resourceForm" :rules="resourceRules" label-width="60px">
+        <el-form-item prop="position" label="位置">
+          <el-radio-group v-model="resourceForm.position" size="medium">
+            <el-radio border v-for="node in node_list" :label="node.node_id">{{ node.node_name }}</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item prop="name" label="名称">
+          <el-input v-model="resourceForm.name" placeholder="请输入名称" />
+        </el-form-item>
+        <el-form-item prop="label" label="标签">
+          <el-input v-model="resourceForm.label" placeholder="请输入标签" />
+        </el-form-item>
+        <el-form-item prop="intro" label="简介">
+          <el-input v-model="resourceForm.intro" type="textarea" :rows="4" placeholder="请输入简介" />
+        </el-form-item>
+      </el-form>
+
+      <template #footer>
+        <el-button @click="visibleSubmitResource = false">取 消</el-button>
+        <el-button :loading="loading" type="primary" @click="SubmitToResource">确 定</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { SubmitFileToResourceStore, GetBookCoursewarePath } from '@/api/book';
+import { getToken } from '@/utils/auth';
+import { isEnable } from '@/views/book/courseware/data/common';
+
+export default {
+  name: 'ResourcesOperate',
+  props: ['data'],
+  inject: ['courseware_id', 'project_id', 'getProjectResourcePopedom'],
+
+  data() {
+    return {
+      isEnable,
+      visibleSubmitResource: false,
+      node_list: [],
+      resourceForm: {
+        position: '',
+        name: '',
+        label: '',
+        intro: '',
+      },
+      resourceRules: {
+        position: [{ required: true, message: '请选择位置', trigger: 'blur' }],
+        name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
+      },
+    };
+  },
+  computed: {
+    projectResourcePopedom() {
+      return this.getProjectResourcePopedom();
+    },
+  },
+  methods: {
+    // 提交到资源库
+    handleSubmitToResource(file) {
+      this.visibleSubmitResource = true;
+      this.curFile = file;
+      this.resourceForm = {
+        position: '',
+        name: file.name || '',
+        label: file.label || '',
+        intro: file.intro || '',
+      };
+      GetBookCoursewarePath({ id: this.courseware_id }).then((res) => {
+        this.node_list = res.path_list;
+      });
+    },
+    SubmitToResource() {
+      this.$refs.resourceForm.validate((valid) => {
+        if (valid) {
+          this.loading = true;
+          let data = {
+            project_id: this.project_id,
+            book_chapter_node_id: this.resourceForm.position || '',
+            file_id: this.curFile.file_id,
+            resource_info: {
+              name: this.resourceForm.name,
+              label: this.resourceForm.label,
+              intro: this.resourceForm.intro,
+            },
+          };
+
+          SubmitFileToResourceStore(data)
+            .then((res) => {
+              this.$message.success('操作成功!');
+              this.visibleSubmitResource = false;
+            })
+            .catch(() => {
+              this.loading = false;
+            })
+            .finally(() => {
+              this.loading = false;
+            });
+        }
+      });
+    },
+    // 下载文件
+    downLoad(file) {
+      let userInfor = getToken();
+      let AccessToken = '';
+      if (userInfor) {
+        AccessToken = userInfor.access_token;
+      }
+      let FileID = file.file_id;
+      let data = {
+        AccessToken,
+        FileID,
+      };
+      location.href = `${process.env.VUE_APP_EEP}/FileServer/WebFileDownload?AccessToken=${data.AccessToken}&FileID=${data.FileID}`;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.resources-operate {
+  display: flex;
+  column-gap: 12px;
+}
+</style>

src/views/book/courseware/create/components/question/article/Article.vue

@@ -5,7 +5,7 @@
       <div v-loading="loading" class="article-wrapper">
         <el-input v-model="data.content" placeholder="输入" type="textarea" />
         <div class="btn-box">
-          <SelectUpload label="课文音频" type="audio" width="500px" @uploadSuccess="uploadAudioSuccess" />
+          <SelectUpload label="课文音频" type="audio" @uploadSuccess="uploadAudioSuccess" />
           <el-button :loading="autoLoading" @click="handleAutoAudio">自动生成音频</el-button>
         </div>
         <div v-if="data.mp3_list.length > 0" class="upload-file">
@@ -16,6 +16,7 @@
             </span>
           </div>
           <SvgIcon icon-class="delete-black" size="12" @click="removeFile" />
+          <ResourcesOperate :data="data.mp3_list[0]"></ResourcesOperate>
         </div>
         <span v-if="data.content" class="tips">说明：需先点击“生成分词”按钮后，再进行文章校对或生成字幕节点</span>
         <div v-if="data.content" class="btn-box">
@@ -132,6 +133,7 @@ import NewWord from './NewWord.vue';
 import Notes from './Notes.vue';
 import CheckPic from './CheckPic.vue';
 import CheckSubtitles from '@/views/book/courseware/create/components/question/voice_matrix/CheckSubtitles.vue';
+import ResourcesOperate from '../../common/ResourcesOperate.vue';
 
 import { getArticleData } from '@/views/book/courseware/data/article';
 import { TextToAudioFile } from '@/api/app';
@@ -156,6 +158,7 @@ export default {
     Notes,
     CheckPic,
     CheckSubtitles,
+    ResourcesOperate,
   },
   mixins: [ModuleMixin],
   data() {
@@ -367,8 +370,16 @@ export default {
       }
     },
     removeFile() {
-      this.data.mp3_list = [];
-      this.data.file_id_list = [];
+      this.$confirm('是否删除当前文件？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.data.mp3_list = [];
+          this.data.file_id_list = [];
+        })
+        .catch(() => {});
     },
     // 校对文章
     checkArticle() {

src/views/book/courseware/create/components/question/article/NewWord.vue

@@ -205,7 +205,6 @@
       <SelectUpload
         label="生词音频"
         type="audio"
-        width="500px"
         :style="{ marginBottom: data.audio_data.url.length === 0 ? '5px' : '' }"
         @uploadSuccess="uploadAudioSuccess"
       />
@@ -219,8 +218,9 @@
         </span>
       </div>
       <SvgIcon icon-class="delete-black" size="12" @click="removeFile('audio')" />
+      <ResourcesOperate :data="data.audio_data"></ResourcesOperate>
     </div>
-    <SelectUpload label="音频字幕(lrc)文件" :limit="1" type="lrc" width="500px" @uploadSuccess="uploadLrcSuccess" />
+    <SelectUpload label="音频字幕(lrc)文件" :limit="1" type="lrc" @uploadSuccess="uploadLrcSuccess" />
     <div v-if="data.lrc_data.url.length > 0" class="upload-file">
       <div class="file-name">
         <span>
@@ -229,6 +229,7 @@
         </span>
       </div>
       <SvgIcon icon-class="delete-black" size="12" @click="removeFile('lrc')" />
+      <ResourcesOperate :data="data.lrc_data"></ResourcesOperate>
     </div>
     <div class="lrc-box" style="margin: 5px 0">
       <div v-if="data.lrc_arr && data.lrc_arr.length > 0" class="lrc-box">
@@ -314,6 +315,8 @@ import SoundRecord from '@/views/book/courseware/create/components/question/fill
 import UploadAudio from '@/views/book/courseware/create/components/question/fill/components/UploadAudio.vue';
 import SelectUpload from '@/views/book/courseware/create/components/common/SelectUpload.vue';
 import UploadPicture from '../new_word/components/UploadPicture.vue';
+import ResourcesOperate from '../../common/ResourcesOperate.vue';
+
 import { getWordTime, prepareTranscribe, fileToBase64Text, getWordTimes } from '@/api/article';
 import { GetStaticResources, TextToAudioFile, GetTextToAudioConfParamList } from '@/api/app';
 import { PinyinBuild_OldFormat } from '@/api/book';
@@ -338,6 +341,7 @@ export default {
     RichText,
     UploadPicture,
     CheckSubtitles,
+    ResourcesOperate,
   },
   props: ['dataNewWord', 'unifiedAttrib'],
   mixins: [ModuleMixin],
@@ -473,25 +477,33 @@ export default {
      * @param {'audio' | 'lrc'} type
      */
     removeFile(type) {
-      if (type === 'audio') {
-        this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.audio_data.file_id);
-        this.data.audio_data = {
-          name: '',
-          media_duration: 0,
-          temporary_url: '',
-          url: '',
-          file_id: '',
-        };
-      } else if (type === 'lrc') {
-        this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.lrc_data.file_id);
-        this.data.lrc_data = {
-          name: '',
-          url: '',
-          id: '',
-          file_id: '',
-        };
-      }
-      this.data.lrc_arr = [];
+      this.$confirm('是否删除当前文件？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          if (type === 'audio') {
+            this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.audio_data.file_id);
+            this.data.audio_data = {
+              name: '',
+              media_duration: 0,
+              temporary_url: '',
+              url: '',
+              file_id: '',
+            };
+          } else if (type === 'lrc') {
+            this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.lrc_data.file_id);
+            this.data.lrc_data = {
+              name: '',
+              url: '',
+              id: '',
+              file_id: '',
+            };
+          }
+          this.data.lrc_arr = [];
+        })
+        .catch(() => {});
     },
     uploads(file_id, index) {
       this.data.new_word_list[index].mp3_list = file_id;

src/views/book/courseware/create/components/question/dialogue_article/Article.vue

@@ -129,7 +129,7 @@
           <el-button type="primary" size="small" @click="handleNotice">插入语境</el-button>
         </div>
         <div class="btn-box">
-          <SelectUpload label="课文音频" type="audio" width="500px" @uploadSuccess="uploadAudioSuccess" />
+          <SelectUpload label="课文音频" type="audio" @uploadSuccess="uploadAudioSuccess" />
           <el-button :loading="autoLoading" @click="handleAutoAudio">自动生成音频</el-button>
         </div>
         <div v-if="data.mp3_list.length > 0" class="upload-file">
@@ -140,6 +140,7 @@
             </span>
           </div>
           <SvgIcon icon-class="delete-black" size="12" @click="removeFile" />
+          <ResourcesOperate :data="data.mp3_list[0]"></ResourcesOperate>
         </div>
         <span class="tips">说明：需先点击“生成分词”按钮后，再进行文章校对或生成字幕节点</span>
         <div v-if="data.detail.length > 0" class="btn-box">
@@ -344,6 +345,7 @@ import CompareTime from '../article/CompareTime.vue';
 import NewWord from '../article/NewWord.vue';
 import Notes from '../article/Notes.vue';
 import CheckSubtitles from '@/views/book/courseware/create/components/question/voice_matrix/CheckSubtitles.vue';
+import ResourcesOperate from '../../common/ResourcesOperate.vue';
 
 import { getArticleData } from '@/views/book/courseware/data/dialogueArticle';
 import { fileUpload, TextToAudioFile } from '@/api/app';
@@ -367,6 +369,7 @@ export default {
     NewWord,
     Notes,
     CheckSubtitles,
+    ResourcesOperate,
   },
   mixins: [ModuleMixin],
   data() {
@@ -732,7 +735,15 @@ export default {
       }
     },
     removeFile() {
-      this.data.mp3_list = [];
+      this.$confirm('是否删除当前文件？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.data.mp3_list = [];
+        })
+        .catch(() => {});
     },
     // 校对文章
     checkArticle() {

src/views/book/courseware/create/components/question/image_text/ImageText.vue

@@ -24,7 +24,7 @@
           :max="800"
         />
       </div>
-      <SelectUpload label="音频" type="audio" width="500px" @uploadSuccess="uploadAudioSuccess" />
+      <SelectUpload label="音频" type="audio" @uploadSuccess="uploadAudioSuccess" />
       <div v-if="data.mp3_list.length > 0" class="upload-files">
         <div class="file-name">
           <span>
@@ -34,6 +34,7 @@
           <span> 完成 </span>
         </div>
         <SvgIcon icon-class="delete-black" size="12" @click="removeFile" />
+        <ResourcesOperate :data="data.mp3_list[0]"></ResourcesOperate>
       </div>
       <el-button v-if="data.mp3_list.length > 0" type="primary" size="small" @click="handleTimes">{{
         data.word_time.length === 0 ? '自动生成字幕时间' : '重新生成字幕时间'
@@ -278,6 +279,7 @@ import { getImageTextData, isEnable } from '@/views/book/courseware/data/imageTe
 import SelectUpload from '@/views/book/courseware/create/components/common/SelectUpload.vue';
 import CompareTime from '../article/CompareTime.vue';
 import CheckArticle from './CheckArticle.vue';
+import ResourcesOperate from '../../common/ResourcesOperate.vue';
 
 import { GetFileURLMap } from '@/api/app';
 import { fileToBase64Text, prepareTranscribe, getWordTime, getWordTimes } from '@/api/article';
@@ -285,7 +287,7 @@ import cnchar from 'cnchar';
 
 export default {
   name: 'ImageTextPage',
-  components: { UploadFile, SelectUpload, CompareTime, CheckArticle },
+  components: { UploadFile, SelectUpload, CompareTime, CheckArticle, ResourcesOperate },
   mixins: [ModuleMixin],
   data() {
     return {
@@ -368,8 +370,16 @@ export default {
       }
     },
     removeFile() {
-      this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.mp3_list[0].file_id);
-      this.data.mp3_list = [];
+      this.$confirm('是否删除当前文件？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.mp3_list[0].file_id);
+          this.data.mp3_list = [];
+        })
+        .catch(() => {});
     },
     startSelection(event) {
       this.isSelecting = true;

src/views/book/courseware/create/components/question/new_word/NewWord.vue

@@ -350,7 +350,6 @@
         <SelectUpload
           label="生词音频"
           type="audio"
-          width="500px"
           :style="{ marginBottom: data.audio_data.url.length === 0 ? '5px' : '' }"
           @uploadSuccess="uploadAudioSuccess"
         />
@@ -365,8 +364,9 @@
           </span>
         </div>
         <SvgIcon icon-class="delete-black" size="12" @click="removeFile('audio')" />
+        <ResourcesOperate :data="data.audio_data"></ResourcesOperate>
       </div>
-      <SelectUpload label="音频字幕(lrc)文件" :limit="1" type="lrc" width="500px" @uploadSuccess="uploadLrcSuccess" />
+      <SelectUpload label="音频字幕(lrc)文件" :limit="1" type="lrc" @uploadSuccess="uploadLrcSuccess" />
       <div v-if="data.lrc_data.url.length > 0" class="upload-file">
         <div class="file-name">
           <span>
@@ -375,6 +375,7 @@
           </span>
         </div>
         <SvgIcon icon-class="delete-black" size="12" @click="removeFile('lrc')" />
+        <ResourcesOperate :data="data.lrc_data"></ResourcesOperate>
       </div>
       <div class="lrc-box" style="margin: 5px 0">
         <div v-if="data.lrc_arr && data.lrc_arr.length > 0" class="lrc-box">
@@ -419,6 +420,8 @@ import CheckSubtitles from '@/views/book/courseware/create/components/question/v
 
 import { getNewWordData, getOption } from '@/views/book/courseware/data/newWord';
 import SelectUpload from '@/views/book/courseware/create/components/common/SelectUpload.vue';
+import ResourcesOperate from '../../common/ResourcesOperate.vue';
+
 import { GetStaticResources, TextToAudioFile } from '@/api/app';
 import cnchar from 'cnchar';
 import { ChapterGetBookChapterStruct, PinyinBuild_OldFormat } from '@/api/book';
@@ -432,6 +435,7 @@ export default {
     UploadAudio,
     UploadPicture,
     CheckSubtitles,
+    ResourcesOperate,
   },
   mixins: [ModuleMixin],
   data() {
@@ -548,25 +552,33 @@ export default {
      * @param {'audio' | 'lrc'} type
      */
     removeFile(type) {
-      if (type === 'audio') {
-        this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.audio_data.file_id);
-        this.data.audio_data = {
-          name: '',
-          media_duration: 0,
-          temporary_url: '',
-          url: '',
-          file_id: '',
-        };
-      } else if (type === 'lrc') {
-        this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.lrc_data.file_id);
-        this.data.lrc_data = {
-          name: '',
-          url: '',
-          id: '',
-          file_id: '',
-        };
-      }
-      this.data.lrc_arr = [];
+      this.$confirm('是否删除当前文件？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          if (type === 'audio') {
+            this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.audio_data.file_id);
+            this.data.audio_data = {
+              name: '',
+              media_duration: 0,
+              temporary_url: '',
+              url: '',
+              file_id: '',
+            };
+          } else if (type === 'lrc') {
+            this.data.file_id_list = this.data.file_id_list.filter((item) => item !== this.data.lrc_data.file_id);
+            this.data.lrc_data = {
+              name: '',
+              url: '',
+              id: '',
+              file_id: '',
+            };
+          }
+          this.data.lrc_arr = [];
+        })
+        .catch(() => {});
     },
     uploads(file_id, index) {
       this.data.new_word_list[index].mp3_list = file_id;

src/views/book/courseware/create/components/question/voice_matrix/VoiceMatrix.vue

@@ -29,13 +29,7 @@
           </div>
         </div>
 
-        <SelectUpload
-          label="矩阵音频"
-          type="audio"
-          width="600px"
-          :is-show-resource="false"
-          @uploadSuccess="uploadAudioSuccess"
-        />
+        <SelectUpload label="矩阵音频" type="audio" :is-show-resource="false" @uploadSuccess="uploadAudioSuccess" />
         <div v-if="data.audio_data.url.length > 0" class="upload-file">
           <div class="file-name">
             <span>
@@ -44,6 +38,7 @@
             </span>
           </div>
           <SvgIcon icon-class="delete-black" size="12" @click="removeFile('audio')" />
+          <ResourcesOperate :data="data.audio_data"></ResourcesOperate>
         </div>
 
         <div class="upload-lrc">
@@ -51,7 +46,6 @@
             label="音频字幕(lrc)文件"
             :limit="1"
             type="lrc"
-            width="500px"
             :is-show-resource="false"
             @uploadSuccess="uploadLrcSuccess"
           />
@@ -66,6 +60,7 @@
             </span>
           </div>
           <SvgIcon icon-class="delete-black" size="12" @click="removeFile('lrc')" />
+          <ResourcesOperate :data="data.lrc_data"></ResourcesOperate>
         </div>
       </div>
 
@@ -100,6 +95,7 @@
 import ModuleMixin from '../../common/ModuleMixin';
 import SelectUpload from '@/views/book/courseware/create/components/common/SelectUpload.vue';
 import CheckSubtitles from './CheckSubtitles.vue';
+import ResourcesOperate from '../../common/ResourcesOperate.vue';
 
 import { getVoiceMatrixData, getOption } from '@/views/book/courseware/data/voiceMatrix';
 import { GetStaticResources } from '@/api/app';
@@ -109,6 +105,7 @@ export default {
   components: {
     SelectUpload,
     CheckSubtitles,
+    ResourcesOperate,
   },
   mixins: [ModuleMixin],
   data() {
@@ -210,22 +207,30 @@ export default {
      * @param {'audio' | 'lrc'} type
      */
     removeFile(type) {
-      if (type === 'audio') {
-        this.data.audio_data = {
-          name: '',
-          media_duration: 0,
-          temporary_url: '',
-          url: '',
-          file_id: '',
-        };
-      } else if (type === 'lrc') {
-        this.data.lrc_data = {
-          name: '',
-          url: '',
-          id: '',
-          file_id: '',
-        };
-      }
+      this.$confirm('是否删除当前文件？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          if (type === 'audio') {
+            this.data.audio_data = {
+              name: '',
+              media_duration: 0,
+              temporary_url: '',
+              url: '',
+              file_id: '',
+            };
+          } else if (type === 'lrc') {
+            this.data.lrc_data = {
+              name: '',
+              url: '',
+              id: '',
+              file_id: '',
+            };
+          }
+        })
+        .catch(() => {});
     },
     BatchSetFormat(text) {
       this.$refs.richText.forEach((richText) => {