Skip to content

N
national_museum_vod
Commit 0d7119b8 authored by Your Name's avatar Your Name
Browse files
Options

新建学习内容添加备选资料清单

parent 0c7ef795
Hide whitespace changes
Inline Side-by-side
Showing with 175 additions and 70 deletions
package.json
View file @ 0d7119b8
...@@ -24,6 +24,7 @@ ...@@ -24,6 +24,7 @@
"qs": "^6.5.2", "qs": "^6.5.2",
"qs-stringify": "^1.1.0", "qs-stringify": "^1.1.0",
"swiper": "^5.4.5", "swiper": "^5.4.5",
"v-viewer": "^1.6.3",
"video.js": "^7.11.4", "video.js": "^7.11.4",
"vue": "^2.5.2", "vue": "^2.5.2",
"vue-awesome-swiper": "^4.1.1", "vue-awesome-swiper": "^4.1.1",
......
src/page/check/display/index.vue
View file @ 0d7119b8
...@@ -169,7 +169,7 @@ ...@@ -169,7 +169,7 @@
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="宣传图" :label-width="formLabelWidth"> <el-form-item label="宣传图" :label-width="formLabelWidth">
<img class="imgSize" :src="editForm.cover" alt /> <img v-viewer class="imgSize" :src="editForm.cover" alt />
</el-form-item> </el-form-item>
<el-form-item label="二维码" :label-width="formLabelWidth"> <el-form-item label="二维码" :label-width="formLabelWidth">
<img class="imgSize" :src="editForm.qrcodeUrl" alt /> <img class="imgSize" :src="editForm.qrcodeUrl" alt />
...@@ -188,8 +188,22 @@ ...@@ -188,8 +188,22 @@
<el-form-item label="展板音频" :label-width="formLabelWidth"> <el-form-item label="展板音频" :label-width="formLabelWidth">
<div class="audio-box"> <div class="audio-box">
<div class="audio-item" v-for="(item, index) in editForm.audioList" :key="index"> <div class="audio-item" v-for="(item, index) in editForm.audioList" :key="index">
<audio :src="item.fileUrl" controls controlsList='nodownload' oncontextmenu="return false"/> <audio v-if="item.fileExtName ==='mp3'" :src="item.fileUrl" controls controlsList='nodownload' oncontextmenu="return false"/>
<span v-if="item.fileExtName ==='mp3'">{{ item.fileName }}</span>
</div>
</div>
</el-form-item>
<el-form-item label="参考资料" :label-width="formLabelWidth">
<div class="audio-box">
<div class="audio-item ckzl" v-for="(item, index) in editForm.datumList" :key="index">
<div>
<iframe class="imgSize" v-if="item.fileExtName === 'pdf'" :src="item.fileUrl" controls controlsList='nodownload' oncontextmenu="return false"/>
<img :src="item.fileUrl" v-else-if="item.fileExtName === 'jpg' || item.fileExtName === 'png' || item.fileExtName === 'docx'" class="imgSize"/>
<video :src="item.fileUrl" v-else="item.fileExtName === 'mp4'" class="imgSize" controls />
</div>
<div>
<span>{{ item.fileName }}</span> <span>{{ item.fileName }}</span>
</div>
</div> </div>
</div> </div>
</el-form-item> </el-form-item>
...@@ -203,6 +217,9 @@ ...@@ -203,6 +217,9 @@
</template> </template>
<script> <script>
let Base64 = require('js-base64').Base64 let Base64 = require('js-base64').Base64
import Viewer from 'v-viewer';
export default { export default {
data() { data() {
var checkIsNull = (rule, value, callback) => { var checkIsNull = (rule, value, callback) => {
...@@ -706,6 +723,10 @@ export default { ...@@ -706,6 +723,10 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
.ckzl {
display: flex;
flex-direction: column;
}
.imgSize { .imgSize {
width: 160px; width: 160px;
height: 100px; height: 100px;
......
src/page/content/components/dialog/videoDialog.vue
View file @ 0d7119b8
<template> <template>
<!--新增弹框--> <!--新增弹框-->
<el-dialog <el-dialog
custom-class="party-dialog" custom-class="party-dialog"
title="视频详情" title="视频详情"
width="400px" width="400px"
:visible.sync="dialogVisible" :visible.sync="dialogVisible"
:before-close="close" :before-close="close"
@contextmenu.prevent @contextmenu.prevent
> >
<span v-for="(item,index) in videoList" :key="index"> <template v-if="videoList && videoList.length > 0">
<video <span v-for="(item,index) in videoList" :key="index">
:preload="preload" <video
:poster="item.cover" :preload="preload"
:height="height" :poster="item.cover"
:width="width" :height="height"
align="center" :width="width"
controls controlsList='nodownload noremote footbar' align="center"
> controls controlsList='nodownload noremote footbar'
<source :src="item.fileUrl" /> >
</video> <source :src="item.fileUrl" />
<span>&nbsp;&nbsp;&nbsp;&nbsp; </span> </video>
</span> <span>&nbsp;&nbsp;&nbsp;&nbsp; </span>
</el-dialog> </span>
</template> </template>
<template v-else>
<script> <div style="text-align:center;font-size:14px">未关联视频</div>
export default { </template>
data() { </el-dialog>
return { </template>
videoList:[],
dialogVisible: false, <script>
// videoSrc: 'https://video.pearvideo.com/mp4/short/20200209/cont-1650197-14888002-hd.mp4', export default {
// videoImg: 'https://sm.ms/image/ueRFCZfk2xTONGb', data() {
videoSrc: "", return {
videoImg: "", videoList:[],
playStatus: "", dialogVisible: false,
muteStatus: "", // videoSrc: 'https://video.pearvideo.com/mp4/short/20200209/cont-1650197-14888002-hd.mp4',
isMute: true, // videoImg: 'https://sm.ms/image/ueRFCZfk2xTONGb',
isPlay: false, videoSrc: "",
width: "320", // 设置视频播放器的显示宽度（以像素为单位） videoImg: "",
height: "200", // 设置视频播放器的显示高度（以像素为单位） playStatus: "",
preload: "auto", // 建议浏览器是否应在<video>加载元素后立即开始下载视频数据。 muteStatus: "",
controls: true, // 确定播放器是否具有用户可以与之交互的控件。没有控件，启动视频播放的唯一方法是使用autoplay属性或通过Player API。 isMute: true,
autoplay: "", isPlay: false,
}; width: "320", // 设置视频播放器的显示宽度（以像素为单位）
}, height: "200", // 设置视频播放器的显示高度（以像素为单位）
methods: { preload: "auto", // 建议浏览器是否应在<video>加载元素后立即开始下载视频数据。
// 新增关闭 controls: true, // 确定播放器是否具有用户可以与之交互的控件。没有控件，启动视频播放的唯一方法是使用autoplay属性或通过Player API。
close() { autoplay: "",
// 为防止关闭后继续播放 };
this.videoList = [] },
this.dialogVisible = false; methods: {
}, // 新增关闭
}, close() {
}; // 为防止关闭后继续播放
</script> this.videoList = []
this.dialogVisible = false;
<style> },
},
};
</script>
<style>
</style> </style>
\ No newline at end of file
src/page/content/display/content/add.vue
View file @ 0d7119b8
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
</el-form-item> --> </el-form-item> -->
<el-form-item label="展板名称" prop="name" class="w100"> <el-form-item label="展板名称" prop="name" class="w100">
<el-input oninput="value = value.trim()" v-model="ruleForm.name" maxlength="30"></el-input> <el-input oninput="value = value.trim()" v-model="ruleForm.name"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="展板版权方" class="w50" prop="boardCopyrightOwnerId"> <el-form-item label="展板版权方" class="w50" prop="boardCopyrightOwnerId">
...@@ -67,7 +67,8 @@ ...@@ -67,7 +67,8 @@
<upload-qrcode :fileList="ruleForm.qrcodeList" @qrcodeUrl="qrcodeUrl" ></upload-qrcode> <upload-qrcode :fileList="ruleForm.qrcodeList" @qrcodeUrl="qrcodeUrl" ></upload-qrcode>
</el-form-item> </el-form-item>
<el-form-item label="展板简介" style="width:100%" prop="remarks"> <el-form-item label="展板简介" style="width:100%" prop="remarks">
<el-input type="textarea" v-model="ruleForm.remarks" maxlength="2000"></el-input> <el-input type="textarea" v-model="ruleForm.remarks" class="indet"></el-input>
<!-- @keyup.enter.native="onSubmit" -->
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-collapse-item> </el-collapse-item>
...@@ -224,7 +225,7 @@ export default { ...@@ -224,7 +225,7 @@ export default {
{ required: true, message: "请上传参考资料", trigger: "blur" } { required: true, message: "请上传参考资料", trigger: "blur" }
], ],
remarks: [ remarks: [
{ min: 1, max: 100, message: "请输入1到100个字" }, { min: 1, max: 2000, message: "最多只能输入2000个字"},
], ],
}, },
...@@ -478,6 +479,9 @@ export default { ...@@ -478,6 +479,9 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.indet /deep/ textarea{
text-indent: 2em;
}
.info-add { .info-add {
/deep/.el-collapse-item__wrap { /deep/.el-collapse-item__wrap {
padding: 16px; padding: 16px;
......
src/page/content/learn/content/add.vue
View file @ 0d7119b8
...@@ -126,7 +126,25 @@ ...@@ -126,7 +126,25 @@
</el-table> </el-table>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="展板参考资料备选清单" class="w100" prop="fileList">
<div class="party-table">
<el-table
border
@selection-change="handleSelectionChange1"
style="width: 100%"
max-height="400"
ref="multipleTable1"
:data="tableData1"
>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" width="120" label="序号">
</el-table-column>
<el-table-column show-overflow-tooltip label="展板名称" prop="boardName"></el-table-column>
<el-table-column show-overflow-tooltip label="参考资料名称" prop="fileName"></el-table-column>
<el-table-column show-overflow-tooltip label="参考资料类型" prop="fileType"></el-table-column>
</el-table>
</div>
</el-form-item>
</el-form> </el-form>
<!--新增弹框--> <!--新增弹框-->
...@@ -219,6 +237,7 @@ export default { ...@@ -219,6 +237,7 @@ export default {
paddingRight: "10px" paddingRight: "10px"
}, },
tableData: [], tableData: [],
tableData1: [],
ruleForm: { ruleForm: {
name: "", //学习内容名称 name: "", //学习内容名称
applicableScope: "", //适用范围 applicableScope: "", //适用范围
...@@ -227,7 +246,8 @@ export default { ...@@ -227,7 +246,8 @@ export default {
learningProjectId: "", //所属学习项目 learningProjectId: "", //所属学习项目
exhibitionBoardCatIdList: [], //展板类别 exhibitionBoardCatIdList: [], //展板类别
copyrightOwnerIdList: [], //版权方 copyrightOwnerIdList: [], //版权方
exhibitionBoardIdList: [] // 展板备选 exhibitionBoardIdList: [], // 展板备选
fileList:[] // 展板资料备选
}, },
rules: { rules: {
name: [ name: [
...@@ -275,6 +295,7 @@ export default { ...@@ -275,6 +295,7 @@ export default {
] ]
}, },
multipleSelection: [], multipleSelection: [],
multipleSelection1:[],
userType: "" userType: ""
}; };
}, },
...@@ -364,6 +385,22 @@ export default { ...@@ -364,6 +385,22 @@ export default {
}); });
}); });
}, },
setSelctTable1() {
// console.log(this.multipleSelection1)
if (!this.multipleSelection1.length) {
return false;
}
let _this = this;
let tableData1 = this.tableData1;
let multipleSelection1 = this.multipleSelection1;
tableData1.forEach(v => {
multipleSelection1.forEach(m => {
if (v.id == m.id) {
_this.$refs.multipleTable1.toggleRowSelection(v);
}
});
});
},
// 获取展板类别列表 // 获取展板类别列表
getAssetTypeData() { getAssetTypeData() {
let vm = this; let vm = this;
...@@ -444,13 +481,22 @@ export default { ...@@ -444,13 +481,22 @@ export default {
console.log(err); console.log(err);
}); });
}, },
// 多选赋值 // 展板多选赋值
handleSelectionChange(val) { async handleSelectionChange(val) {
this.multipleSelection = val; this.multipleSelection = val;
let newArray = val.map(item => { let newArray = val.map(item => {
return item.id; return item.id;
}); });
this.ruleForm.exhibitionBoardIdList = newArray; this.ruleForm.exhibitionBoardIdList = newArray;
await this.getTableParam1()
},
// 展板资料多选赋值
handleSelectionChange1(val) {
this.multipleSelection1 = this.multipleSelection1.concat(val);
let newArray = val.map(item => {
return item.id;
});
this.ruleForm.fileList = newArray;
}, },
// 新增 // 新增
submitForm(formName) { submitForm(formName) {
...@@ -560,6 +606,36 @@ export default { ...@@ -560,6 +606,36 @@ export default {
this.tableData = [] this.tableData = []
} }
}, },
// 筛选展板资料备选清单选项条件
getTableParam1(){
if((this.ruleForm.exhibitionBoardIdList.length>0)){
let vm = this;
vm.$https(
{
url: "asset/getAssetByBoard",
method: "get",
authType: this.backToken
},
{ boardList:vm.ruleForm.exhibitionBoardIdList.toString()}
)
.then(res => {
// alert(1)
const data = res.data.data;
// console.log(data)
vm.tableData1 = data;
// 选中表格数据
vm.multipleSelection1 = res.data.data
setTimeout(() => {
vm.setSelctTable1();
}, 1000);
})
.catch(function(err) {
console.log(err);
});
}else{
this.tableData1 = []
}
},
// 根据展板类别，版权方获取展板备选清单 // 根据展板类别，版权方获取展板备选清单
getTableData(param, type) { getTableData(param, type) {
...@@ -588,7 +664,6 @@ export default { ...@@ -588,7 +664,6 @@ export default {
console.log(err); console.log(err);
}); });
}, },
selectAllThing() { selectAllThing() {
// debugger // debugger
......
src/page/content/learn/content/details.vue
View file @ 0d7119b8
...@@ -161,7 +161,6 @@ export default { ...@@ -161,7 +161,6 @@ export default {
.then(res => { .then(res => {
let data = res.data.data; let data = res.data.data;
this.checkForm = data; this.checkForm = data;
}) })
.catch(function(err) { .catch(function(err) {
console.log(err); console.log(err);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment