huoran
/
FE_middlePlatform_server
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 15 Wiki Activity

阿里云oss

Browse Source
dev_review
yujialong 1 year ago
parent f1c6f571f8
commit 4597a8919e
4 changed files with 956 additions and 871 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      src/components/upload/index.vue
  2. 72
      src/views/course/contentSettings.vue
  3. 3
      src/views/match/list/index.vue
  4. 374
      src/views/theoreticalCourse/contentSettings/index.vue

4
src/components/upload/index.vue
Unescape View File

@ -111,7 +111,7 @@ export default {
}); });
this.uploading = false this.uploading = false
const url = 'http://huoran.oss-cn-shenzhen.aliyuncs.com/' + name const url = 'https://huoran.oss-cn-shenzhen.aliyuncs.com/' + name
this.changeFileList && this.$emit('update:fileList', [ this.changeFileList && this.$emit('update:fileList', [
...this.fileList, ...this.fileList,
{ {
@ -124,7 +124,7 @@ export default {
this.$emit('onSuccess', { this.$emit('onSuccess', {
format: util.getFileExt(file.name), format: util.getFileExt(file.name),
name: file.name, name: file.name,
url: url, url,
size: file.size, size: file.size,
}) })
} catch (error) { } } catch (error) { }

72
src/views/course/contentSettings.vue
Unescape View File

@ -169,25 +169,6 @@
<p>视频请上传MP4格式，大小不超过150M；office文件大小不要超过10M</p> <p>视频请上传MP4格式，大小不超过150M；office文件大小不要超过10M</p>
</template> </template>
</Upload> </Upload>
<!-- <el-upload :before-upload="beforeUpload"
:on-remove="handleRemove"
:on-error="uploadError"
:before-remove="beforeRemove"
:limit="1"
:on-exceed="handleExceed"
:action="this.api.fileupload"
:file-list="uploadList"
:headers="headers"
:http-request="handleRequest"
name="file">
<el-button size="small"><img src="@/assets/img/upload.png"
alt=""> 上传资源</el-button>
<div slot="tip"
class="el-upload__tip">视频请上传MP4格式，大小不超过150M；office文件大小不要超过10M</div>
</el-upload>
<el-progress v-if="showProgress"
:stroke-width="3"
:percentage="progressPercent"></el-progress> -->
</el-form-item> </el-form-item>
<el-form-item label="小节名称"> <el-form-item label="小节名称">
<el-input placeholder="请输入小节名称" <el-input placeholder="请输入小节名称"
@ -216,24 +197,6 @@
@onSuccess="uploadSuccess"> @onSuccess="uploadSuccess">
<div slot="tip"></div> <div slot="tip"></div>
</Upload> </Upload>
<!-- <el-upload :before-upload="beforeUpload"
:on-remove="handleRemove"
:on-error="uploadError"
:before-remove="beforeRemove"
:limit="1"
:on-exceed="handleExceed"
:action="this.api.fileupload"
:file-list="uploadList"
:headers="headers"
:http-request="handleRequest"
name="file">
<el-button size="small"><img src="@/assets/img/upload.png"
alt=""> 上传资源</el-button>
</el-upload>
<el-progress v-if="showProgress"
:stroke-width="3"
:percentage="progressPercent"></el-progress> -->
</div> </div>
<span slot="footer" <span slot="footer"
class="dialog-footer"> class="dialog-footer">
@ -277,7 +240,7 @@
style="transform: scale(1) rotate(0deg);margin-top: -1px; max-height: 100%; max-width: 100%;"> style="transform: scale(1) rotate(0deg);margin-top: -1px; max-height: 100%; max-width: 100%;">
</div> </div>
</div> </div>
<div v-show="iframeSrc" <div v-show="iframeSrc || videoSrc"
class="el-image-viewer__wrapper" class="el-image-viewer__wrapper"
:class="{active: iframeSrc}" :class="{active: iframeSrc}"
style="z-index: 2000"> style="z-index: 2000">
@ -293,6 +256,16 @@
id="fileIframe" id="fileIframe"
:src="iframeSrc" :src="iframeSrc"
frameborder="0"></iframe> frameborder="0"></iframe>
<video v-if="videoSrc"
class="video"
width="1200"
height="600"
autoplay
controls>
<source :src="videoSrc"
type="video/mp4">
您的浏览器不支持 video 标签。
</video>
<template v-if="showMask"> <template v-if="showMask">
<div class="mask" <div class="mask"
style="width: 200px;height: 30px;top: 53px;right: 320px"></div> style="width: 200px;height: 30px;top: 53px;right: 320px"></div>
@ -412,6 +385,7 @@ export default {
fileUrl: "", fileUrl: "",
originalFileName: "", originalFileName: "",
fileType: "", fileType: "",
videoSrc: '',
playAuth: "", playAuth: "",
player: null, player: null,
previewImg: "", previewImg: "",
@ -548,6 +522,7 @@ export default {
}, },
uploadSuccess (file) { uploadSuccess (file) {
this.uploading = false this.uploading = false
this.fileId = ''
this.fileType = file.format this.fileType = file.format
this.fileUrl = file.url this.fileUrl = file.url
this.fileName = file.name this.fileName = file.name
@ -802,18 +777,18 @@ export default {
}, },
// 下载资源 // 下载资源
download (row) { download (row) {
const { fileType } = row const { fileType, fileId } = row
// 下载ppt // 下载ppt
if (fileType === 'pptx') { if (fileType === 'pptx') {
this.downloadFile(row.name, row.fileUrl) this.downloadFile(row.name, row.fileUrl)
} else if (fileType === 'mp4') { } else if (fileId) {
// 下载视频，先生成视频，再拿到视频地址去下载 // 阿里云点播视频，先生成视频，再拿到视频地址去下载（现在已经去掉视频点播的方法，但是还需要兼容历史数据）
this.$get(`${this.api.getPlayAuth}/${row.fileId}`).then(res => { this.$get(`${this.api.getPlayAuth}/${fileId}`).then(res => {
const player = new Aliplayer({ new Aliplayer({
id: "playerDownload", id: "playerDownload",
width: "100%", width: "100%",
autoplay: false, autoplay: false,
vid: row.fileId, vid: fileId,
playauth: res.data.playAuth, playauth: res.data.playAuth,
encryptType: 1 //当播放私有加密流时需要设置。 encryptType: 1 //当播放私有加密流时需要设置。
}, player => { }, player => {
@ -826,6 +801,8 @@ export default {
}, },
preview (row) { preview (row) {
if (this.transferType(row.fileType) == "视频") { if (this.transferType(row.fileType) == "视频") {
// 阿里云视频点播
if (row.fileId) {
this.$get(`${this.api.getPlayAuth}/${row.fileId}`).then(res => { this.$get(`${this.api.getPlayAuth}/${row.fileId}`).then(res => {
this.playAuth = res.data.playAuth; this.playAuth = res.data.playAuth;
if (this.player) { if (this.player) {
@ -840,8 +817,10 @@ export default {
encryptType: 1 //当播放私有加密流时需要设置。 encryptType: 1 //当播放私有加密流时需要设置。
}); });
} }
}).catch(res => { }).catch(res => { });
}); } else {
this.videoSrc = row.fileUrl
}
} else if (this.transferType(row.fileType) == "图片") { } else if (this.transferType(row.fileType) == "图片") {
this.previewImg = row.fileUrl; this.previewImg = row.fileUrl;
} else if (row.fileType == "pdf") { } else if (row.fileType == "pdf") {
@ -984,6 +963,7 @@ export default {
}, },
closeIframe () { closeIframe () {
this.iframeSrc = ""; this.iframeSrc = "";
this.videoSrc = ''
this.showMask = false; this.showMask = false;
this.showMask1 = false; this.showMask1 = false;
this.showMask2 = false; this.showMask2 = false;

3
src/views/match/list/index.vue
Unescape View File

@ -423,7 +423,8 @@ export default {
}) })
this.$post(this.api.editCompetitionContent, { this.$post(this.api.editCompetitionContent, {
competitionContents: data competitionContents: data
}).then(res => { }).then(async res => {
await this.$post(`${this.api.refreshPageNotification}?content=1`)
util.successMsg('修改成功') util.successMsg('修改成功')
this.modifyVisible = false this.modifyVisible = false
this.getData() this.getData()

374
src/views/theoreticalCourse/contentSettings/index.vue
Unescape View File

@ -1,213 +1,332 @@
<template> <template>
<div> <div>
<el-card shadow="hover" class="m-b-20"> <el-card shadow="hover"
class="m-b-20">
<div class="flex-between"> <div class="flex-between">
<el-page-header @back="goBack" :content="'课程内容/' + (sorting ? '更改排序' : '内容设置')"></el-page-header> <el-page-header @back="goBack"
:content="'课程内容/' + (sorting ? '更改排序' : '内容设置')"></el-page-header>
</div> </div>
</el-card> </el-card>
<!--内容设置--> <!--内容设置-->
<el-card shadow="hover" class="m-b-20"> <el-card shadow="hover"
class="m-b-20">
<div class="page"> <div class="page">
<div class="relative"> <div class="relative">
<div class="p-title">内容设置</div> <div class="p-title">内容设置</div>
<div class="btns" style="top: -10px"> <div class="btns"
style="top: -10px">
<template v-if="!sorting"> <template v-if="!sorting">
<el-button type="primary" round @click="addChapter">添加章节</el-button> <el-button type="primary"
<el-button type="primary" round @click="sort">编辑顺序</el-button> round
@click="addChapter">添加章节</el-button>
<el-button type="primary"
round
@click="sort">编辑顺序</el-button>
</template> </template>
<template v-else> <template v-else>
<el-button type="primary" round @click="move">批量移动</el-button> <el-button type="primary"
<el-button type="primary" round @click="cancelSort">取消</el-button> round
<el-button type="primary" round @click="saveSort">保存</el-button> @click="move">批量移动</el-button>
<el-button type="primary"
round
@click="cancelSort">取消</el-button>
<el-button type="primary"
round
@click="saveSort">保存</el-button>
</template> </template>
</div> </div>
</div> </div>
<el-divider></el-divider> <el-divider></el-divider>
<div class="page-content"> <div class="page-content">
<div class="m-b-20" v-for="(chapter,index) in chapters" :key="chapter.id"> <div class="m-b-20"
v-for="(chapter,index) in chapters"
:key="chapter.id">
<div class="flex j-between a-center m-b-10"> <div class="flex j-between a-center m-b-10">
<div>{{ chapter.name }}</div> <div>{{ chapter.name }}</div>
<div> <div>
<template v-if="!sorting"> <template v-if="!sorting">
<el-button class="action-btn" type="primary" round @click="editChapter(chapter)">修改章节名称</el-button> <el-button class="action-btn"
<el-button class="action-btn" type="primary" round @click="addSection(chapter.id)">添加小节</el-button> type="primary"
<el-button class="action-btn" type="primary" round @click="delChapter(chapter.id)">删除</el-button> round
@click="editChapter(chapter)">修改章节名称</el-button>
<el-button class="action-btn"
type="primary"
round
@click="addSection(chapter.id)">添加小节</el-button>
<el-button class="action-btn"
type="primary"
round
@click="delChapter(chapter.id)">删除</el-button>
</template> </template>
<template v-else> <template v-else>
<i class="el-icon-top sort-icon" :class="{disabled: index == 0}" style="margin-right: 5px" @click="sortChapter(chapter,'up',index == 0,index)"></i> <i class="el-icon-top sort-icon"
<i class="el-icon-bottom sort-icon" :class="{disabled: index == chapters.length-1}" @click="sortChapter(chapter,'down',index == chapter.length-1,index)"></i> :class="{disabled: index == 0}"
style="margin-right: 5px"
@click="sortChapter(chapter,'up',index == 0,index)"></i>
<i class="el-icon-bottom sort-icon"
:class="{disabled: index == chapters.length-1}"
@click="sortChapter(chapter,'down',index == chapter.length-1,index)"></i>
</template> </template>
</div> </div>
</div> </div>
<el-table :data="chapter.subsectionList" class="table" stripe header-align="center"> <el-table :data="chapter.subsectionList"
<el-table-column v-if="sorting" width="55" align="center"> class="table"
stripe
header-align="center">
<el-table-column v-if="sorting"
width="55"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-checkbox v-model="scope.row.check"></el-checkbox> <el-checkbox v-model="scope.row.check"></el-checkbox>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column> <el-table-column type="index"
<el-table-column prop="name" label="资源名称" min-width="200"> width="100"
label="序号"
align="center"></el-table-column>
<el-table-column prop="name"
label="资源名称"
min-width="200">
</el-table-column> </el-table-column>
<el-table-column prop="fileType" label="资源类型" min-width="120" align="center"> <el-table-column prop="fileType"
label="资源类型"
min-width="120"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
{{ transferType(scope.row.fileType) }} {{ transferType(scope.row.fileType) }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="fileType" label="格式" min-width="120" align="center"> <el-table-column prop="fileType"
label="格式"
min-width="120"
align="center">
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" width="300"> <el-table-column label="操作"
align="center"
width="300">
<template slot-scope="scope"> <template slot-scope="scope">
<template v-if="!sorting"> <template v-if="!sorting">
<el-button type="text" @click="preview(scope.row)">查看</el-button> <el-button type="text"
<el-button type="text" @click="delSection(scope.row)">删除</el-button> @click="preview(scope.row)">查看</el-button>
<el-button type="text" @click="editSectionName(scope.row,chapter.id)">修改小节名称</el-button> <el-button type="text"
<el-button type="text" @click="switchFile(scope.row,chapter.id)">更换文件</el-button> @click="delSection(scope.row)">删除</el-button>
<el-button type="text"
@click="editSectionName(scope.row,chapter.id)">修改小节名称</el-button>
<el-button type="text"
@click="switchFile(scope.row,chapter.id)">更换文件</el-button>
</template> </template>
<template v-else> <template v-else>
<i class="el-icon-top sort-icon" :class="{disabled: scope.$index == 0}" style="margin-right: 5px" @click="sortSection(index,'up',scope.$index == 0,scope.$index)"></i> <i class="el-icon-top sort-icon"
<i class="el-icon-bottom sort-icon" :class="{disabled: scope.$index == chapter.subsectionList.length-1}" @click="sortSection(index,'down',scope.$index == chapter.subsectionList.length-1,scope.$index)"></i> :class="{disabled: scope.$index == 0}"
style="margin-right: 5px"
@click="sortSection(index,'up',scope.$index == 0,scope.$index)"></i>
<i class="el-icon-bottom sort-icon"
:class="{disabled: scope.$index == chapter.subsectionList.length-1}"
@click="sortSection(index,'down',scope.$index == chapter.subsectionList.length-1,scope.$index)"></i>
</template> </template>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<el-dialog :title="chapterId ? '编辑章节' : '新增章节'" :visible.sync="chapterVisible" width="540px" :close-on-click-modal="false"> <el-dialog :title="chapterId ? '编辑章节' : '新增章节'"
:visible.sync="chapterVisible"
width="540px"
:close-on-click-modal="false">
<el-form> <el-form>
<el-form-item> <el-form-item>
<el-input placeholder="请输入章节名称，便于对小节归类" v-model="chapterName" maxlength="50"></el-input> <el-input placeholder="请输入章节名称，便于对小节归类"
v-model="chapterName"
maxlength="50"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer"
class="dialog-footer">
<el-button @click="chapterVisible = false">取消</el-button> <el-button @click="chapterVisible = false">取消</el-button>
<el-button type="primary" @click="chapterSubmit">确定</el-button> <el-button type="primary"
@click="chapterSubmit">确定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<el-dialog title="添加小节" :visible.sync="sectionVisible" width="540px" @close="closeSection" :close-on-click-modal="false"> <el-dialog title="添加小节"
:visible.sync="sectionVisible"
width="540px"
@close="closeSection"
:close-on-click-modal="false">
<el-form label-width="80px"> <el-form label-width="80px">
<el-form-item label="资源添加"> <el-form-item label="资源添加">
<el-upload <Upload :max-size="100000"
:before-upload="beforeUpload" @beforeUpload="beforeUpload"
:on-remove="handleRemove" @onSuccess="uploadSuccess">
:on-error="uploadError" <template slot="tip">
:on-success="uploadSuccess" <p>视频请上传MP4格式</p>
:before-remove="beforeRemove" </template>
:limit="1" </Upload>
:on-exceed="handleExceed"
:action="this.api.fileupload"
:file-list="uploadList"
:headers="headers"
:http-request="handleRequest"
name="file"
>
<el-button size="small"><img src="@/assets/img/upload.png" alt=""> 上传资源</el-button>
<div slot="tip" class="el-upload__tip">视频请上传MP4格式</div>
</el-upload>
<el-progress v-if="showProgress" :stroke-width="3" :percentage="progressPercent"></el-progress>
</el-form-item> </el-form-item>
<el-form-item label="小节名称"> <el-form-item label="小节名称">
<el-input placeholder="请输入小节名称" v-model="sectionName" maxlength="50"></el-input> <el-input placeholder="请输入小节名称"
v-model="sectionName"
maxlength="50"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer"
class="dialog-footer">
<el-button @click="sectionVisible = false">取消</el-button> <el-button @click="sectionVisible = false">取消</el-button>
<el-button type="primary" @click="sectionSubmit">确定</el-button> <el-button type="primary"
@click="sectionSubmit">确定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<el-dialog title="更换文件" :visible.sync="switchVisible" width="540px" :close-on-click-modal="false" @close="closeSwitch"> <el-dialog title="更换文件"
:visible.sync="switchVisible"
width="540px"
:close-on-click-modal="false"
@close="closeSwitch">
<div style="text-align: center"> <div style="text-align: center">
<el-upload <Upload :max-size="100000"
:before-upload="beforeUpload" @beforeUpload="beforeUpload"
:on-remove="handleRemove" @onSuccess="uploadSuccess">
:on-error="uploadError" <template slot="tip">
:on-success="uploadSuccess" <p>视频请上传MP4格式</p>
:before-remove="beforeRemove" </template>
:limit="1" </Upload>
:on-exceed="handleExceed"
:action="this.api.fileupload"
:file-list="uploadList"
:headers="headers"
:http-request="handleRequest"
name="file"
>
<el-button size="small"><img src="@/assets/img/upload.png" alt=""> 上传资源</el-button>
</el-upload>
<el-progress v-if="showProgress" :stroke-width="3" :percentage="progressPercent"></el-progress>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer"
class="dialog-footer">
<el-button @click="switchVisible = false">取消</el-button> <el-button @click="switchVisible = false">取消</el-button>
<el-button type="primary" @click="switchSubmit">确定</el-button> <el-button type="primary"
@click="switchSubmit">确定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<el-dialog title="修改小节名称" :visible.sync="sectionNameVisible" width="540px" :close-on-click-modal="false"> <el-dialog title="修改小节名称"
:visible.sync="sectionNameVisible"
width="540px"
:close-on-click-modal="false">
<el-form> <el-form>
<el-form-item> <el-form-item>
<el-input placeholder="请输入小节名称" v-model="sectionName" maxlength="50"></el-input> <el-input placeholder="请输入小节名称"
v-model="sectionName"
maxlength="50"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer"
class="dialog-footer">
<el-button @click="sectionNameVisible = false">取消</el-button> <el-button @click="sectionNameVisible = false">取消</el-button>
<el-button type="primary" @click="sectionNameSubmit">确定</el-button> <el-button type="primary"
@click="sectionNameSubmit">确定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<div v-show="previewImg" class="el-image-viewer__wrapper" :class="{active: previewImg}" style="z-index: 2000"> <div v-show="previewImg"
class="el-image-viewer__wrapper"
:class="{active: previewImg}"
style="z-index: 2000">
<div class="el-image-viewer__mask"></div> <div class="el-image-viewer__mask"></div>
<span class="el-image-viewer__btn el-image-viewer__close" @click="previewImg = ''"><i class="el-icon-circle-close" style="color: #fff"></i></span> <span class="el-image-viewer__btn el-image-viewer__close"
@click="previewImg = ''"><i class="el-icon-circle-close"
style="color: #fff"></i></span>
<div class="el-image-viewer__canvas"> <div class="el-image-viewer__canvas">
<img :src="previewImg" class="el-image-viewer__img" style="transform: scale(1) rotate(0deg);margin-top: -1px; max-height: 100%; max-width: 100%;"> <img :src="previewImg"
class="el-image-viewer__img"
style="transform: scale(1) rotate(0deg);margin-top: -1px; max-height: 100%; max-width: 100%;">
</div> </div>
</div> </div>
<div v-show="iframeSrc" class="el-image-viewer__wrapper" :class="{active: iframeSrc}" style="z-index: 2000"> <div v-show="iframeSrc || videoSrc"
class="el-image-viewer__wrapper"
:class="{active: iframeSrc}"
style="z-index: 2000">
<div class="el-image-viewer__mask"></div> <div class="el-image-viewer__mask"></div>
<span class="el-image-viewer__btn el-image-viewer__close" :class="{'doc-close': isWord}" :style="{top: isWord ? '50px' : '5px'}" @click="closeIframe"><i class="el-icon-circle-close" style="color: #fff"></i></span> <span class="el-image-viewer__btn el-image-viewer__close"
:class="{'doc-close': isWord}"
:style="{top: isWord ? '50px' : '5px'}"
@click="closeIframe"><i class="el-icon-circle-close"
style="color: #fff"></i></span>
<div class="el-image-viewer__canvas"> <div class="el-image-viewer__canvas">
<iframe v-if="iframeSrc" class="fileIframe" id="fileIframe" :src="iframeSrc" frameborder="0"></iframe> <iframe v-if="iframeSrc"
class="fileIframe"
id="fileIframe"
:src="iframeSrc"
frameborder="0"></iframe>
<video v-if="videoSrc"
class="video"
width="1200"
height="600"
autoplay
controls>
<source :src="videoSrc"
type="video/mp4">
您的浏览器不支持 video 标签。
</video>
<template v-if="showMask"> <template v-if="showMask">
<div class="mask" style="width: 200px;height: 30px;top: 53px;right: 320px"></div> <div class="mask"
<div class="mask" style="width: 175px;height: 30px;top: 53px;right: 5px"></div> style="width: 200px;height: 30px;top: 53px;right: 320px"></div>
<div class="mask"
style="width: 175px;height: 30px;top: 53px;right: 5px"></div>
</template> </template>
<template v-if="showMask1"> <template v-if="showMask1">
<div class="word-mask1" style="width: 200px;height: 50px;"></div> <div class="word-mask1"
<div class="word-mask" style="height: 40px;top: 48px;"></div> style="width: 200px;height: 50px;"></div>
<div class="word-mask2" style="top: 55px;left: 28%;width: 44%;height: calc(100% - 80px);"></div> <div class="word-mask"
style="height: 40px;top: 48px;"></div>
<div class="word-mask2"
style="top: 55px;left: 28%;width: 44%;height: calc(100% - 80px);"></div>
</template> </template>
<template v-if="showMask2 && iframeSrc"> <template v-if="showMask2 && iframeSrc">
<div class="excel-mask1" style="height: 48px;"></div> <div class="excel-mask1"
style="height: 48px;"></div>
</template> </template>
</div> </div>
</div> </div>
<div v-show="playAuth" class="el-image-viewer__wrapper" :class="{active: playAuth}" style="z-index: 2000"> <div v-show="playAuth"
class="el-image-viewer__wrapper"
:class="{active: playAuth}"
style="z-index: 2000">
<div class="el-image-viewer__mask"></div> <div class="el-image-viewer__mask"></div>
<span class="el-image-viewer__btn el-image-viewer__close" @click="closePlayer"><i class="el-icon-circle-close" style="color: #fff"></i></span> <span class="el-image-viewer__btn el-image-viewer__close"
<div class="player" id="player"></div> @click="closePlayer"><i class="el-icon-circle-close"
style="color: #fff"></i></span>
<div class="player"
id="player"></div>
</div> </div>
<pdf :visible.sync="pdfVisible" :src.sync="pdfSrc"></pdf> <pdf :visible.sync="pdfVisible"
:src.sync="pdfSrc"></pdf>
</div> </div>
</div> </div>
</el-card> </el-card>
<el-dialog title="资源移动" :visible.sync="moveVisible" :close-on-click-modal="false" width="330px"> <el-dialog title="资源移动"
:visible.sync="moveVisible"
:close-on-click-modal="false"
width="330px">
<el-form> <el-form>
<el-form-item label="目标章节"> <el-form-item label="目标章节">
<el-select v-model="moveForm.id" placeholder="请选择目标章节" @change="chapterChange"> <el-select v-model="moveForm.id"
<el-option v-for="(item, i) in chapters" :key="i" :label="item.name" :value="item.id"></el-option> placeholder="请选择目标章节"
@change="chapterChange">
<el-option v-for="(item, i) in chapters"
:key="i"
:label="item.name"
:value="item.id"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="目标排序"> <el-form-item label="目标排序">
<el-select v-model="moveForm.sort" placeholder="请选择目标排序"> <el-select v-model="moveForm.sort"
<el-option v-for="(item, i) in sortList" :key="i" :label="item.name" :value="item.id"></el-option> placeholder="请选择目标排序">
<el-option v-for="(item, i) in sortList"
:key="i"
:label="item.name"
:value="item.id"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer"
class="dialog-footer">
<el-button @click="moveVisible = false">取消</el-button> <el-button @click="moveVisible = false">取消</el-button>
<el-button type="primary" @click="moveConfirm">确定</el-button> <el-button type="primary"
@click="moveConfirm">确定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
@ -218,6 +337,7 @@ import util from "@/libs/util";
import Setting from "@/setting"; import Setting from "@/setting";
import { Loading } from "element-ui"; import { Loading } from "element-ui";
import pdf from "@/components/pdf"; import pdf from "@/components/pdf";
import Upload from '@/components/upload';
import axios from 'axios' import axios from 'axios'
export default { export default {
@ -246,6 +366,7 @@ export default {
fileUrl: "", fileUrl: "",
originalFileName: "", originalFileName: "",
fileType: "", fileType: "",
videoSrc: '',
playAuth: "", playAuth: "",
player: null, player: null,
previewImg: "", previewImg: "",
@ -283,7 +404,7 @@ export default {
moved: false // 是否移动过 moved: false // 是否移动过
}; };
}, },
components: { pdf }, components: { pdf, Upload },
mounted () { mounted () {
this.insertScript(); this.insertScript();
this.id = this.$route.query.id; this.id = this.$route.query.id;
@ -366,15 +487,6 @@ export default {
}, },
// 上传文件 // 上传文件
beforeUpload (file) { beforeUpload (file) {
// let type = this.transferType(file.name.substring(file.name.lastIndexOf(".") + 1));
// if (type != "视频" && type != "图片" && type != "pdf" && (file.size / 1024 / 1024) > 10) {
// util.errorMsg("请上传10M以内的文件");
// return false;
// }
// if (type == "视频" && (file.size / 1024 / 1024) > 30) {
// util.errorMsg("请上传30M以内的视频");
// return false;
// }
this.uploading = true; this.uploading = true;
this.originalFileName = file.name; this.originalFileName = file.name;
if (this.isAddSection) this.sectionName = file.name.substring(0, file.name.lastIndexOf(".")); if (this.isAddSection) this.sectionName = file.name.substring(0, file.name.lastIndexOf("."));
@ -415,12 +527,12 @@ export default {
this.fileName = ossFileName this.fileName = ossFileName
}) })
}, },
uploadSuccess(res, file, fileList) { uploadSuccess (file) {
this.uploading = false; this.uploading = false;
this.fileId = res.data.filesResult.fileId; this.fileId = ''
this.fileType = res.data.filesResult.fileType; this.fileType = file.format;
this.fileUrl = res.data.filesResult.fileUrl; this.fileUrl = file.url;
this.fileName = res.data.filesResult.ossFileName; this.fileName = file.name;
}, },
uploadError (err, file, fileList) { uploadError (err, file, fileList) {
this.$message({ this.$message({
@ -647,6 +759,8 @@ export default {
}, },
preview (row) { preview (row) {
if (this.transferType(row.fileType) == "视频") { if (this.transferType(row.fileType) == "视频") {
// 阿里云视频点播
if (row.fileId) {
this.$get(`${this.api.getPlayAuth}/${row.fileId}`).then(res => { this.$get(`${this.api.getPlayAuth}/${row.fileId}`).then(res => {
this.playAuth = res.data.playAuth; this.playAuth = res.data.playAuth;
if (this.player) { if (this.player) {
@ -661,8 +775,10 @@ export default {
encryptType: 1 //当播放私有加密流时需要设置。 encryptType: 1 //当播放私有加密流时需要设置。
}); });
} }
}).catch(res => { }).catch(res => { });
}); } else {
this.videoSrc = row.fileUrl
}
} else if (this.transferType(row.fileType) == "图片") { } else if (this.transferType(row.fileType) == "图片") {
this.previewImg = row.fileUrl; this.previewImg = row.fileUrl;
} else if (row.fileType == "pdf") { } else if (row.fileType == "pdf") {
@ -742,20 +858,7 @@ export default {
switchSubmit () { switchSubmit () {
if (this.uploading) return util.warningMsg("资源正在上传中，请稍候"); if (this.uploading) return util.warningMsg("资源正在上传中，请稍候");
if (!this.fileUrl && !this.fileId) return util.warningMsg("请上传资源"); if (!this.fileUrl && !this.fileId) return util.warningMsg("请上传资源");
if (this.transferType(this.curFile.fileType) == "视频") {
let data = {
videoIdList: [this.sectionId]
};
this.$del(`${this.api.removeVideo}/${this.curFile.fileId}`).then(res => {
this.switchSubmitFile(); this.switchSubmitFile();
}).catch(res => {
});
} else {
this.$del(`${this.api.fileDeletion}?keys=${this.curFile.fileName}`).then(res => {
this.switchSubmitFile();
}).catch(res => {
});
}
}, },
delSection (row) { delSection (row) {
this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", { this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", {
@ -819,6 +922,7 @@ export default {
}, },
closeIframe () { closeIframe () {
this.iframeSrc = ""; this.iframeSrc = "";
this.videoSrc = ''
this.showMask = false; this.showMask = false;
this.showMask1 = false; this.showMask1 = false;
this.showMask2 = false; this.showMask2 = false;
@ -858,15 +962,15 @@ export default {
&.disabled { &.disabled {
color: #ccc; color: #ccc;
cursor: not-allowed cursor: not-allowed;
} }
} }
.el-image-viewer__wrapper { .el-image-viewer__wrapper {
transform: translateY(-10px); transform: translateY(-10px);
transition: transform .5s; transition: transform 0.5s;
&.active { &.active {
transform: translateY(0) transform: translateY(0);
} }
} }
@ -939,7 +1043,7 @@ export default {
background-color: #107c41; background-color: #107c41;
} }
.el-button--primary.action-btn { .el-button--primary.action-btn {
color: #9076FF !important; color: #9076ff !important;
font-size: 14px !important; font-size: 14px !important;
background-color: #fff !important; background-color: #fff !important;
border-radius: 4px !important; border-radius: 4px !important;

Write Preview
Loading…
Cancel
Save