|
|
@@ -140,10 +140,16 @@
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="课节资源" prop="resource">
|
|
|
- <upload :datafileList="createCourseForm.resource" :changeFillId="handleAvatarSuccess" :fileName="'courseResource'" :filleNumber="99" tips="支持上传图片、文档、音频、视频等资料，单个最大200MB，总共不超1GB，支持预览功能" />
|
|
|
+ <upload :datafileList="createCourseForm.resource" :changeFillId="handleAvatarSuccess" :fileName="'courseResource'" :filleNumber="99" tips="支持上传图片、文档、音频、视频等资料，单个最大200MB，总共不超1GB，支持预览功能" :showList="true" />
|
|
|
+ <ul v-if="createCourseForm.resource.length>0" class="resource-list">
|
|
|
+ <li v-for="(itemR,indexR) in createCourseForm.resource" :key="indexR">
|
|
|
+ <a @click="handlePreview(itemR)"><svg-icon :icon-class="itemR.type" class="icon-logo"></svg-icon><span>{{itemR.name}}</span></a>
|
|
|
+ <i class="el-icon-delete" @click="handleDelResource(indexR)"></i>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <!-- <el-button size="small" @click="onCancel('createCourseForm')">取消</el-button> -->
|
|
|
+ <el-button size="small" @click="onCancel('createCourseForm')">取消</el-button>
|
|
|
<el-button type="primary" size="small" @click="handleSaveCourse('createCourseForm')"><svg-icon icon-class="save-line"></svg-icon> 保存</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
@@ -159,6 +165,20 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="resourceFlag"
|
|
|
+ :show-close="true"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :modal-append-to-body="false"
|
|
|
+ width="1000px"
|
|
|
+ class="login-dialog"
|
|
|
+ v-if="resourceFlag">
|
|
|
+ <iframe
|
|
|
+ :src="resourceUrl"
|
|
|
+ width="100%"
|
|
|
+ height="600px"
|
|
|
+ ></iframe>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -194,6 +214,7 @@ import "tinymce/plugins/contextmenu";
|
|
|
import "tinymce/plugins/textcolor";
|
|
|
import "tinymce/plugins/colorpicker";
|
|
|
import { getLogin } from "@/api/ajax";
|
|
|
+const Base64 = require("js-base64").Base64;
|
|
|
|
|
|
export default {
|
|
|
//import引入的组件需要注入到对象中才能使用
|
|
|
@@ -333,6 +354,9 @@ export default {
|
|
|
tabsList:['中英双语','少儿必读'],
|
|
|
recordedId: null, // 录播课id
|
|
|
itemsId: null, // 课节id
|
|
|
+ resourceUrl: '', // 课节资源预览地址
|
|
|
+ resourceFlag: false,
|
|
|
+ file_preview_url: 'https://docpreview.utschool.cn'
|
|
|
}
|
|
|
},
|
|
|
//计算属性 类似于data概念
|
|
|
@@ -390,20 +414,51 @@ export default {
|
|
|
handleAvatarSuccess(fileList,name) {
|
|
|
if(name==='cover'){
|
|
|
this.organizeForm.cover_image_list = fileList
|
|
|
- this.organizeForm.cover_image_id = fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_id:''
|
|
|
- this.organizeForm.cover_image_url = fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_url:''
|
|
|
+ this.organizeForm.cover_image_id = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_id:''
|
|
|
+ this.organizeForm.cover_image_url = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_url:''
|
|
|
}else if(name==='courseVideo'){
|
|
|
this.createCourseForm.videoResource = fileList
|
|
|
- this.createCourseForm.file_id = fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_id:''
|
|
|
- this.createCourseForm.file_url = fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_url:''
|
|
|
+ this.createCourseForm.file_id = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_id:''
|
|
|
+ this.createCourseForm.file_url = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_url:''
|
|
|
}else if(name==='courseAudio'){
|
|
|
this.createCourseForm.audioResource = fileList
|
|
|
- this.createCourseForm.file_id = fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_id:''
|
|
|
- this.createCourseForm.file_url = fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_url:''
|
|
|
+ this.createCourseForm.file_id = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_id:''
|
|
|
+ this.createCourseForm.file_url = fileList[0]&&fileList[0].response&&fileList[0].response.file_info_list&&fileList[0].response.file_info_list[0]?fileList[0].response.file_info_list[0].file_url:''
|
|
|
}else if(name==='courseResource'){
|
|
|
+ fileList.forEach(item=>{
|
|
|
+ if(item.response&&item.response.file_info_list&&item.response.file_info_list[0]){
|
|
|
+ let index = item.response.file_info_list[0].file_name.lastIndexOf('.');
|
|
|
+ item.name = item.response.file_info_list[0].file_name
|
|
|
+ let type = item.response.file_info_list[0].file_name.substring(index + 1).toLowerCase()
|
|
|
+ item.type = this.handleJudgeType(type)
|
|
|
+ item.file_id = item.response.file_info_list[0].file_id
|
|
|
+ }
|
|
|
+ })
|
|
|
this.createCourseForm.resource = fileList
|
|
|
}
|
|
|
},
|
|
|
+ // 判断文件类型
|
|
|
+ handleJudgeType(type){
|
|
|
+ let finalType = ''
|
|
|
+ if(type==='wav'){
|
|
|
+ finalType = 'mp3'
|
|
|
+ }else if(type==='png'||type==='jpg'||type==='jpeg'){
|
|
|
+ finalType = 'jpg'
|
|
|
+ }else if(type==='avi'||type==='wmv'||type==='mpeg'){
|
|
|
+ finalType = 'mp4'
|
|
|
+ }else if(type==='rar'||type==='jar'||type==='arj'||type==='z'||type==='jar'){
|
|
|
+ finalType = 'zip'
|
|
|
+ }else if(type==='docx'){
|
|
|
+ finalType = 'doc'
|
|
|
+ }else if(type==='xls'){
|
|
|
+ finalType = 'xlsx'
|
|
|
+ }else if(type==='pptx'){
|
|
|
+ finalType = 'ppt'
|
|
|
+ }else{
|
|
|
+ finalType = type
|
|
|
+ }
|
|
|
+ return finalType
|
|
|
+ },
|
|
|
// 取消 恢复到修改前状态
|
|
|
onCancel(formName){
|
|
|
this.$refs[formName].resetFields();
|
|
|
@@ -420,7 +475,9 @@ export default {
|
|
|
let form = this.createCourseForm
|
|
|
let resource_file_id_list = []
|
|
|
form.resource.forEach(item => {
|
|
|
- if(item.response&&item.response.file_info_list&&item.response.file_info_list[0]){
|
|
|
+ if(item.file_id){
|
|
|
+ resource_file_id_list.push(item.file_id)
|
|
|
+ }else if(item.response&&item.response.file_info_list&&item.response.file_info_list[0]){
|
|
|
resource_file_id_list.push(item.response.file_info_list[0].file_id)
|
|
|
}
|
|
|
|
|
|
@@ -475,6 +532,34 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
+ // 删除资源文件
|
|
|
+ handleDelResource(i){
|
|
|
+ this.$confirm("确定删除吗?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ }).then(() => {
|
|
|
+ this.createCourseForm.resource.splice(i, 1);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 预览文件
|
|
|
+ handlePreview(item){
|
|
|
+ let MethodName = '/FileServer/GetFileInfo'
|
|
|
+ let data = {
|
|
|
+ file_id: item.file_id
|
|
|
+ }
|
|
|
+ getLogin(MethodName, data)
|
|
|
+ .then((res) => {
|
|
|
+ if(res.status===1){
|
|
|
+ let path =
|
|
|
+ `${this.file_preview_url}/onlinePreview?url=` +
|
|
|
+ Base64.encode(res.file_url);
|
|
|
+ this.resourceUrl = path;
|
|
|
+ this.resourceFlag = true
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
// 查询机构列表
|
|
|
getOrgList(){
|
|
|
let MethodName = "/OrgServer/Manager/PageQuery/PageQueryOrgList";
|
|
|
@@ -585,6 +670,12 @@ export default {
|
|
|
name:'123'
|
|
|
}]
|
|
|
form.intro = res.lb_course_cs_item.intro
|
|
|
+ res.resource_file_list.forEach(item=>{
|
|
|
+ item.name = item.file_name
|
|
|
+ let index = item.file_name.lastIndexOf('.');
|
|
|
+ let type = item.file_name.substring(index + 1).toLowerCase()
|
|
|
+ item.type = this.handleJudgeType(type)
|
|
|
+ })
|
|
|
form.resource = res.resource_file_list
|
|
|
}
|
|
|
})
|
|
|
@@ -695,6 +786,48 @@ export default {
|
|
|
margin: 0;
|
|
|
}
|
|
|
}
|
|
|
+.resource-list{
|
|
|
+ list-style: none;
|
|
|
+ margin: 12px 0;
|
|
|
+ padding: 0;
|
|
|
+ li{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 16px;
|
|
|
+ a{
|
|
|
+ width: 360px;
|
|
|
+ padding: 7px 12px;
|
|
|
+ background: #F7F8FA;
|
|
|
+ border-radius: 2px;
|
|
|
+ color: #1D2129;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ span{
|
|
|
+ overflow:hidden;
|
|
|
+ text-overflow:ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ flex: 1;
|
|
|
+ display: block;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 22px;
|
|
|
+ }
|
|
|
+ .svg-icon{
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+ margin-right: 8px;
|
|
|
+ color: #4E5969;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-icon-delete{
|
|
|
+ color: #4E5969;
|
|
|
+ cursor: pointer;
|
|
|
+ margin-left: 12px;
|
|
|
+ &:hover{
|
|
|
+ color: #165DFF;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
|
|
|
|
|
<style lang="scss">
|
natasha
