tianzeOrg
/
tianze-pro
8
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修复课程配置中上传本地资源无法实现，及上传转换成PDF，预览时的一些问题

Browse Source
beetlsql3-dev
yangdj 2 years ago
parent 9653fe234a
commit 4b89837095
5 changed files with 134 additions and 37 deletions
Show Stats Download Patch File Download Diff File

2
admin-core/src/main/resources/static/js/lib.js
Unescape Escape View File

@ -1092,6 +1092,8 @@ var Lib = {
}); });
layui.form.render(); layui.form.render();
},downloadFile:function (data){ //下载指定文件/或者预览文件 resourcesInfoType：资源类型(1视频 2课件(ppt 、pdf) 3附件) },downloadFile:function (data){ //下载指定文件/或者预览文件 resourcesInfoType：资源类型(1视频 2课件(ppt 、pdf) 3附件)
window.location.href = Common.ctxPath + "/jlw/resourcesInfo/previewData.do?resourcesInfoId="+data.resourcesInfoId;
return;
if(data.resourcesInfoType == 3){//前端下载文件 if(data.resourcesInfoType == 3){//前端下载文件
var a = document.createElement('a'); var a = document.createElement('a');
a.setAttribute('href', Common.ctxPath + data.resourcesInfoContent); //a.href='文件链接' a.setAttribute('href', Common.ctxPath + data.resourcesInfoContent); //a.href='文件链接'

2
admin-core/src/main/resources/static/plugins/jsZip/FileSaver.js
Unescape Escape View File

@ -102,7 +102,7 @@ var saveAs = saveAs
if (target_view) { if (target_view) {
target_view.location.href = object_url; target_view.location.href = object_url;
} else { } else {
window.open(object_url, "_blank"); `window.open(object_url, "_blank");`
} }
filesaver.readyState = filesaver.DONE; filesaver.readyState = filesaver.DONE;
dispatch_all(); dispatch_all();

1
web/src/main/java/com/ibeetl/jlw/web/ResourcesInfoController.java
Unescape Escape View File

@ -130,6 +130,7 @@ public class ResourcesInfoController{
ModelAndView view = new ModelAndView("/jlw/previewPage/previewData.html"); ModelAndView view = new ModelAndView("/jlw/previewPage/previewData.html");
ResourcesInfo resourcesInfo = resourcesInfoService.getById(resourcesInfoId); ResourcesInfo resourcesInfo = resourcesInfoService.getById(resourcesInfoId);
view.addObject("resourcesInfo", resourcesInfo); view.addObject("resourcesInfo", resourcesInfo);
view.addObject("resourcesInfoContent", resourcesInfo.getResourcesInfoContent().replaceAll("\\\\","/"));
return view; return view;
} }

124
web/src/main/resources/templates/jlw/courseInfo/courseConfigureNew.html
Unescape Escape View File

@ -5,7 +5,9 @@
.layui-table a { .layui-table a {
margin-right: 10px; margin-right: 10px;
} }
a{
cursor: pointer;
}
.shiping { .shiping {
color: red; color: red;
border: 2px solid red; border: 2px solid red;
@ -58,14 +60,16 @@
<table id="courseInfoTable" lay-filter="courseInfoTable"></table> <table id="courseInfoTable" lay-filter="courseInfoTable"></table>
<!--本地上传--> <!--本地上传-->
<div style="display: none;" id="resources_demo"> <div style="display: none;" id="resources_demo">
<div class="layui-col-xs6" style="padding: 20px;border-right:thin solid #f4f4f4;height:270px"> <div class="layui-col-xs6" style="padding: 20px;border-right:thin solid #f4f4f4;height:200px">
<div class="grid-demo"> <div class="grid-demo">
<div class="layui-upload-drag" id="resourcesUpload"> <div class="layui-upload-drag" id="resourcesUpload">
<i class="layui-icon" style="color: #3a71a8"></i> <i class="layui-icon" style="color: #3a71a8"></i>
<p>点击上传，或将文件拖拽到此处</p> <p>点击上传，或将文件拖拽到此处</p>
<div class="layui-hide" id="uploadDemoView"> <div id="uploadDemoView" style="display: none;">
<hr> <hr>
<img src="" alt="上传成功后渲染" style="max-width: 196px"> <span style="color: #1E9FFF;">上传成功</span>
<input type="hidden" name="resourcesInfoContent" />
<input type="hidden" name="resourcesInfoId" />
</div> </div>
</div> </div>
</div> </div>
@ -80,10 +84,15 @@
</div>--> </div>-->
</div> </div>
</div> </div>
<div class="layui-form-item">
<label class="layui-form-label" style="width: 90px;">资源名称：</label>
<div class="layui-input-block" style="margin-left: 120px">
<input type="text" style="width: 90%;" name="resourcesInfoName" placeholder="请输入资源名称" autocomplete="off" class="layui-input">
</div>
</div>
</div> </div>
<!--资源库上传--> <!--资源库上传-->
<div id="edit_dialog" class="layui-form" style="display: none;padding: 20px 20px 20px;height: 490px;overflow: auto;"> <div id="edit_dialog" class="layui-form" style="display: none;padding: 20px 20px 0;overflow: auto;">
<div class="layui-inline"> <div class="layui-inline">
<label class="layui-form-label" style="width: 80px">资源名称:</label> <label class="layui-form-label" style="width: 80px">资源名称:</label>
<div class="layui-input-block" style="margin-left: 110px;"> <div class="layui-input-block" style="margin-left: 110px;">
@ -128,7 +137,7 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
</div> </div>
<!--添加图文--> <!--添加图文-->
<div id="addPW_dialog" class="layui-form" style="display: none;padding-top: 20px"> <div id="addPW_dialog" class="layui-form" style="display: none;padding: 20px 20px 0 0;width: 900px;height:370px;">
<div class="layui-row"> <div class="layui-row">
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label" style="width: 80px"><span style="color: red">*</span>名称:</label> <label class="layui-form-label" style="width: 80px"><span style="color: red">*</span>名称:</label>
@ -140,22 +149,22 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
<div class="layui-row"> <div class="layui-row">
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label" style="width: 80px">内容:</label> <label class="layui-form-label" style="width: 80px">内容:</label>
<div class="layui-input-inline" style="width: 60% !important;min-width: 500px;"> <div class="layui-input-block" style="margin-left: 110px">
<textarea id="resourcesInfoContent" name="resourcesInfoContent" style="display:none;"></textarea> <textarea id="resourcesInfoContent" name="resourcesInfoContent" style="display:none;"></textarea>
</div> </div>
</div> </div>
</div> </div>
<div class="layui-row"> <!-- <div class="layui-row">-->
<div class="layui-form-item"> <!-- <div class="layui-form-item">-->
<label class="layui-form-label" style="width: 80px">文件:</label> <!-- <label class="layui-form-label" style="width: 80px">文件:</label>-->
<div class="layui-input-inline" style="width: 130px!important"> <!-- <div class="layui-input-inline" style="width: 130px!important">-->
<button type="button" class="layui-btn" id="picWordUp"> <!-- <button type="button" class="layui-btn" id="picWordUp">-->
<i class="layui-icon">&#xe67c;</i>上传图片 <!-- <i class="layui-icon">&#xe67c;</i>上传图片-->
</button> <!-- </button>-->
</div> <!-- </div>-->
<div class="layui-form-mid">支持CS格式</div> <!-- <div class="layui-form-mid">支持CS格式</div>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
</div> </div>
<!--# } --> <!--# } -->
<script type="text/javascript" src="${ctxPath}/plugins/xm-select.js?v=${jsVer}"></script> <script type="text/javascript" src="${ctxPath}/plugins/xm-select.js?v=${jsVer}"></script>
@ -204,9 +213,20 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
elem: '#resourcesUpload' elem: '#resourcesUpload'
,url: Common.ctxPath + '/jlw/file/update.do' ,url: Common.ctxPath + '/jlw/file/update.do'
, accept: 'file' , accept: 'file'
,exts:"ppt|pptx|pdf|mp4|doc|docx"
,done: function(res){ ,done: function(res){
if(res.code == 0){
$("#uploadDemoView").show();
layer.msg('上传成功'); layer.msg('上传成功');
layui.$('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', Common.ctxPath + res.data.src); $('#resources_demo input[name="resourcesInfoName"]').val(res.data.name);
if (!$.isEmpty(res.data.cvPDFUrl)){
$('#resources_demo input[name="resourcesInfoContent"]').val(res.data.cvPDFUrl);
}else {
$('#resources_demo input[name="resourcesInfoContent"]').val(res.data.src);
}
}else {
layer.msg(res.msg);
}
} }
}); });
var uploadInst = upload.render({ var uploadInst = upload.render({
@ -247,12 +267,13 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
courseInfoAllData.forEach((em,i) => { courseInfoAllData.forEach((em,i) => {
if(item.courseInfoType == 2 && (item.courseInfoId == em.courseInfoParentId)){ if(item.courseInfoType == 2 && (item.courseInfoId == em.courseInfoParentId)){
em.courseInfoNo = index_parent-1; em.courseInfoNo = index_child;
index_child ++; index_child ++;
} }
if(item.courseInfoType == 3 && (item.courseInfoId == em.courseInfoParentId)){ if(item.courseInfoType == 3 && (item.courseInfoId == em.courseInfoParentId)){
em.courseInfoNo = item.courseInfoNo+"."+index_child_child; em.courseInfoNo = item.courseInfoNo+"."+index_child_child;
index_child_child++ index_child_child++;
} }
}); });
@ -353,8 +374,12 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
htm += '<a class="layui-table-link" lay-event="addPW">添加图文</a>'; htm += '<a class="layui-table-link" lay-event="addPW">添加图文</a>';
} }
if (!$.isEmpty(d.resourcesInfoType)) { if (!$.isEmpty(d.resourcesInfoType)) {
if (d.resourcesInfoType != 4){
htm += '<a class="layui-table-link" lay-event="look">查看</a>'; htm += '<a class="layui-table-link" lay-event="look">查看</a>';
htm += '<a class="layui-table-link" lay-event="update">上传</a>'; // htm += '<a href='+Common.ctxPath + '/jlw/resourcesInfo/previewData.do?resourcesInfoId='+d.resourcesInfoId+' style="color: #01AAED" target="_blank">查看</a>';
}else {
htm += '<a href="http://www.baidu.com" style="color: #01AAED" target="_blank">查看</a>';
}
} }
htm += '<a class="layui-table-link" lay-event="edit">编辑</a>'; htm += '<a class="layui-table-link" lay-event="edit">编辑</a>';
htm += '<a class="layui-table-link" lay-event="del">删除</a>'; htm += '<a class="layui-table-link" lay-event="del">删除</a>';
@ -424,11 +449,18 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
title = "资源名称"; title = "资源名称";
param.resourcesInfoId= data.resourcesInfoId; param.resourcesInfoId= data.resourcesInfoId;
id = data.resourcesInfoId; id = data.resourcesInfoId;
if (data.resourcesInfoType === 5) {
addPW(data,1);
} else if (data.resourcesInfoType === 4) {
addLine(data,1);
} else {
updataResourcesOpenLocal(data,"");
}
}else { }else {
id = courseInfoId; id = courseInfoId;
param.courseInfoId = courseInfoId; param.courseInfoId = courseInfoId;
}
addOpen(id,title,data,param); addOpen(id,title,data,param);
}
}else if (obj.event === 'del') { }else if (obj.event === 'del') {
layer.confirm('是否确定删除该信息？', function (index) { layer.confirm('是否确定删除该信息？', function (index) {
layer.load(); layer.load();
@ -568,10 +600,12 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
} else if (data.resourcesInfoType === 4) { } else if (data.resourcesInfoType === 4) {
addLine(data,1); addLine(data,1);
} else { } else {
updataResourcesOpenLocal(); $('#resources_demo input[name="resourcesInfoId"]').val("");
updataResourcesOpenLocal({},data.courseInfoId);
} }
} else { } else {
updataResourcesOpenLocal(); $('#resources_demo input[name="resourcesInfoId"]').val("");
updataResourcesOpenLocal({},data.courseInfoId);
} }
}else { }else {
if (!$.isEmpty(data.resourcesInfoType)) { if (!$.isEmpty(data.resourcesInfoType)) {
@ -589,7 +623,11 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
} }
/*本地资源上传弹出框*/ /*本地资源上传弹出框*/
function updataResourcesOpenLocal() { function updataResourcesOpenLocal(data,courseInfoId) {
$('#resources_demo input[name="resourcesInfoName"]').val(data.resourcesInfoName || '');
$('#resources_demo input[name="resourcesInfoContent"]').val(data.resourcesInfoContent || '');
$('#resources_demo input[name="resourcesInfoId"]').val(data.resourcesInfoId || '');
$("#uploadDemoView").hide();
layer.open({ layer.open({
title: '本地上传' title: '本地上传'
,type:1 ,type:1
@ -598,7 +636,35 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
, area: ['650px','380px'] , area: ['650px','380px']
, btn: ['确定', '关闭'] , btn: ['确定', '关闭']
,yes:function (index, layero){ ,yes:function (index, layero){
layer.close(index); var resourcesInfoName = $('#resources_demo input[name="resourcesInfoName"]').val();
var resourcesInfoContent = $('#resources_demo input[name="resourcesInfoContent"]').val();
var resourcesInfoId = $('#resources_demo input[name="resourcesInfoId"]').val();
//1 视频 2 PPT 3 PDF 4 链接 5 图文
if ($.isEmpty(resourcesInfoContent)){
layer.msg("请上传资源！", {icon: 2});
return;
}
if ($.isEmpty(resourcesInfoName)){
layer.msg("请输入资源名称！", {icon: 2});
return;
}
var param = {
resourcesInfoType:"",
resourcesInfoName:resourcesInfoName,
resourcesInfoContent:resourcesInfoContent,
resourcesInfoId:resourcesInfoId,
courseInfoId:courseInfoId
}
if(resourcesInfoContent.indexOf(".PPT") >=0 || resourcesInfoContent.indexOf(".ppt") >=0|| resourcesInfoContent.indexOf(".PPTX") >=0|| resourcesInfoContent.indexOf(".pptx") >=0){
param.resourcesInfoType = 2;
}
if(resourcesInfoContent.indexOf(".MP4") >=0 || resourcesInfoContent.indexOf(".mp4") >=0){
param.resourcesInfoType = 1;
}
if(resourcesInfoContent.indexOf(".PDF") >=0 || resourcesInfoContent.indexOf(".pdf") >=0){
param.resourcesInfoType = 3;
}
postResourcesInfo(resourcesInfoId, param,index)
} }
, btn2: function (index, layero) { , btn2: function (index, layero) {
layer.close(index); layer.close(index);
@ -614,7 +680,7 @@ type="course_info.course_info_name.course_info_status!=3,course_info_type=1,find
shadeClose: true, shadeClose: true,
btn: ['保存', '关闭'], btn: ['保存', '关闭'],
btnAlign: 'c', btnAlign: 'c',
area: ['820px', '580px'], area: ['820px', '600px'],
content: $("#edit_dialog"), content: $("#edit_dialog"),
success: function (layero, index) { success: function (layero, index) {
loadResourcesInfo(sign); loadResourcesInfo(sign);

38
web/src/main/resources/templates/jlw/previewPage/previewData.html
Unescape Escape View File

@ -27,16 +27,30 @@
.pdfobject{ .pdfobject{
height: 100% !important; height: 100% !important;
} }
#twxs img{
max-width: 100%;
}
</style> </style>
<div style="margin: 20px;"> <div style="margin: 20px;">
<input type="hidden" name="resourcesInfoType" value="${resourcesInfo.resourcesInfoType}" /> <input type="hidden" name="resourcesInfoType" value="${resourcesInfo.resourcesInfoType}" />
<input type="hidden" name="resourcesInfoContent" value="${resourcesInfo.resourcesInfoContent}" />
<!-- resourcesInfoType:资源类型(1视频 2课件（ppt\pdf\word） 3附件) --> <!-- resourcesInfoType:资源类型(1视频 2课件（ppt\pdf\word） 3附件) -->
<div style="width: 100%;margin-top: 20px;height:calc(100vh - 40px);"> <div style="width: 100%;margin-top: 20px;height:calc(100vh - 40px);">
<div class="wordHeader" style="position: absolute;width: calc(100% - 56px);height: 88px;background-color: #f3f2f1;margin: 2px;"> <div class="wordHeader" style="position: absolute;width: calc(100% - 56px);height: 88px;background-color: #f3f2f1;margin: 2px;">
<div style="background-color: #185abd;width: 100%;height: 50px;line-height: 50px;font-size: 20px;color: white;margin-top:-20px;"> <div style="background-color: #185abd;width: 100%;height: 50px;line-height: 50px;font-size: 20px;color: white;margin-top:-20px;">
<p style="padding-left: 20px;float: left;position:absolute;font-size: 15px;margin-top:0;">在线课件预览</p> <p style="padding-left: 20px;float: left;position:absolute;font-size: 15px;margin-top:0;">在线预览</p>
<p style="text-align: center;">${resourcesInfo.courseInfoName}</p> <p style="text-align: center;">${resourcesInfo.courseInfoName}</p>
<a class="layui-btn layui-btn-primary addButton-cancel_" style="float: right;margin-right:20px;cursor: pointer;">返回</a>
</div>
</div>
<div id="twxs" style="width: 100%;height: 100%;">
<div style="background-color: #185abd;width: 100%;height: 50px;line-height: 50px;font-size: 20px;color: white;margin-top:-20px;">
<p style="padding-left: 20px;float: left;position:absolute;font-size: 15px;margin-top:0;">在线预览</p>
<p style="text-align: center;">${resourcesInfo.courseInfoName}</p>
<a class="layui-btn layui-btn-primary addButton-cancel_" style="float: right;margin-right:20px;cursor: pointer;">返回</a>
</div>
<div name="nrInfo" style="border: 1px solid #185abd;border-top: none;padding: 20px;min-height: 400px;">
</div> </div>
</div> </div>
<iframe id="InformationURL" src='' <iframe id="InformationURL" src=''
@ -54,23 +68,25 @@
</body> </body>
<script> <script>
var resourcesInfoType = $("input[name='resourcesInfoType']").val(); var resourcesInfoType = $("input[name='resourcesInfoType']").val();
var resourcesInfoContent = $("input[name='resourcesInfoContent']").val(); var resourcesInfoContent = '${resourcesInfoContent}';
//resourcesInfoContent = 'http://www.905.cn/server/filesystem/temp/banner/465wgghpca5.pdf'; //resourcesInfoContent = 'http://www.905.cn/server/filesystem/temp/banner/465wgghpca5.pdf';
if(resourcesInfoType == 2 && fileType(resourcesInfoContent) == 'pdf'){ if(resourcesInfoType == 3 && (fileType(resourcesInfoContent) == 'pdf' || fileType(resourcesInfoContent) == 'PDF')){
$(".wordHeader").show();//显示 $(".wordHeader").show();//显示
addPDF(resourcesInfoContent); addPDF(resourcesInfoContent);
$(".wordHeader").height(50).width('calc(100% - 77px)').find("div").css("background-color","#000000"); $(".wordHeader").height(50).width('calc(100% - 77px)').find("div").css("background-color","#185abd");
}else if(resourcesInfoType == 2){ }else if(resourcesInfoType == 2){
$(".wordHeader").show();//显示 $(".wordHeader").show();//显示
$(".wordHeader").height(88).width('calc(100% - 56px)').find("div").css("background-color","#185abd"); $(".wordHeader").height(88).width('calc(100% - 56px)').find("div").css("background-color","#185abd");
$("#pdfInfo").hide(); $("#pdfInfo").hide();
$("#InformationURL").show(); $("#InformationURL").show();
$("#twxs").hide();
$("#player-con").hide(); $("#player-con").hide();
$('#InformationURL').attr('src', 'https://view.officeapps.live.com/op/view.aspx?src='+Common.isHttp(resourcesInfoContent)); $('#InformationURL').attr('src', 'https://view.officeapps.live.com/op/view.aspx?src='+Common.isHttp(resourcesInfoContent));
}else if(resourcesInfoType == 1){ }else if(resourcesInfoType == 1){
$(".wordHeader").hide();//隐藏 $(".wordHeader").hide();//隐藏
$("#pdfInfo").hide(); $("#pdfInfo").hide();
$("#InformationURL").hide(); $("#InformationURL").hide();
$("#twxs").hide();
$("#player-con").show(); $("#player-con").show();
//$("#roomVideo source").attr("src",Common.isHttp(resourcesInfoContent)); //$("#roomVideo source").attr("src",Common.isHttp(resourcesInfoContent));
@ -114,11 +130,23 @@
// }, function (player) { // }, function (player) {
// console.log("The player is created"); // console.log("The player is created");
// }); // });
}else if(resourcesInfoType == 5){ //图文
$(".wordHeader").hide();//显示
$(".wordHeader").height(88).width('calc(100% - 56px)').find("div").css("background-color","#185abd");
$("#pdfInfo").hide();
$("#InformationURL").hide();
$("#player-con").hide();
$("#twxs").show();
$("#twxs div[name='nrInfo']").html(resourcesInfoContent);
} }
$(".addButton-cancel_").click(function () {
history.go(-1);
});
function addPDF(url){ function addPDF(url){
$("#pdfInfo").show(); $("#pdfInfo").show();
$("#InformationURL").hide(); $("#InformationURL").hide();
$("#twxs").hide();
$("#player-con").hide(); $("#player-con").hide();
var options = { var options = {
height: "550px", height: "550px",

Write Preview
Loading…
Cancel
Save