622 lines
21 KiB
Plaintext
622 lines
21 KiB
Plaintext
<%@ page language="java" pageEncoding="UTF-8"%>
|
||
<style type="text/css">
|
||
|
||
.showechart {
|
||
margin: 1 auto;
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
#left {
|
||
width: 20%;
|
||
height: 100%;
|
||
background: #FFFFFF;
|
||
float: left;
|
||
align: center;
|
||
}
|
||
|
||
#right {
|
||
width: 80%;
|
||
height: 100%;
|
||
background: #FFFFFF;
|
||
float: left;
|
||
align: center;
|
||
}
|
||
|
||
#right_top {
|
||
width: 100%;
|
||
height: 80%;
|
||
float: left;
|
||
align: center;
|
||
}
|
||
|
||
#right_under {
|
||
width: 100%;
|
||
height: 20%;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
align: center;
|
||
}
|
||
|
||
#right_top_left {
|
||
width: 100%;
|
||
height: 100%;
|
||
float: left;
|
||
align: center;
|
||
}
|
||
|
||
#right_top_right {
|
||
width: 0%;
|
||
height: 100%;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
align: center;
|
||
}
|
||
|
||
/*聊天窗口*/
|
||
#right_top_right_top {
|
||
width: 100%;
|
||
height: 48%;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
align: center;
|
||
}
|
||
|
||
/*聊天和视频的隔离带*/
|
||
#right_top_right_center {
|
||
width: 100%;
|
||
height: 4%;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
align: center;
|
||
}
|
||
|
||
/*视频窗口*/
|
||
#right_top_right_under {
|
||
width: 100%;
|
||
height: 45%;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
align: center;
|
||
}
|
||
|
||
/*操作内容 操作详情 负责人+4个按钮 div */
|
||
#right_top_left_top {
|
||
width: 100%;
|
||
height: 15%;
|
||
float: left;
|
||
align: center;
|
||
}
|
||
|
||
/*视频的div*/
|
||
#right_top_left_under {
|
||
width: 100%;
|
||
height: 85%;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
align: center;
|
||
}
|
||
|
||
#right_top_left_top_handle {
|
||
width: 70%;
|
||
height: 100%;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
position: relative;
|
||
align: center;
|
||
}
|
||
|
||
#right_top_left_top_button {
|
||
width: 100%;
|
||
height: 100%;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
align: center;
|
||
}
|
||
|
||
/* #work_table{
|
||
width:791px;
|
||
height:75px;
|
||
border-radius:2px;
|
||
border:1px solid rgba(229,229,229,1);
|
||
} */
|
||
/*
|
||
根据不同分辨率显示不同px的文字大小
|
||
*/
|
||
@media (min-width: 400px) and (min-height: 300px) {
|
||
/*上面一排按钮div的样式*/
|
||
.buttonDiv {
|
||
width: 16%;
|
||
height: 100%;
|
||
float: left;
|
||
border: 2px solid #0EA5FF;
|
||
line-height: 16px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
/*上面一排按钮里面文字的样式*/
|
||
.buttonFont {
|
||
display: inline-block;
|
||
font-size: 16px;
|
||
margin: 5% 0px 0px 0px;
|
||
}
|
||
|
||
/*文字样式---颜色框*/
|
||
#titleDiv2 {
|
||
width: 100%;
|
||
height: 10%;
|
||
border-bottom: 1px solid #E5E5E5;
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
#videoTitle {
|
||
font-size: 12px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
@media (min-width: 768px) and (min-height: 432px) {
|
||
/*上面一排按钮div的样式*/
|
||
.buttonDiv {
|
||
width: 16%;
|
||
height: 100%;
|
||
float: left;
|
||
border: 2px solid #0EA5FF;
|
||
line-height: 16px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
/*上面一排按钮里面文字的样式*/
|
||
.buttonFont {
|
||
display: inline-block;
|
||
font-size: 16px;
|
||
margin: 5% 0px 0px 0px;
|
||
}
|
||
|
||
/*文字样式---颜色框*/
|
||
#titleDiv2 {
|
||
width: 100%;
|
||
height: 10%;
|
||
border-bottom: 1px solid #E5E5E5;
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
padding: 6px 0px 0px 0px;
|
||
}
|
||
|
||
#videoTitle {
|
||
font-size: 14px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
@media (min-width: 992px) and (min-height: 558px) {
|
||
/*上面一排按钮div的样式*/
|
||
.buttonDiv {
|
||
width: 17%;
|
||
height: 100%;
|
||
float: left;
|
||
border: 2px solid #0EA5FF;
|
||
line-height: 16px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
/*上面一排按钮里面文字的样式*/
|
||
.buttonFont {
|
||
display: inline-block;
|
||
font-size: 14px;
|
||
margin: 6% 0px 0px 0px;
|
||
}
|
||
|
||
/*文字样式---颜色框*/
|
||
#titleDiv2 {
|
||
width: 100%;
|
||
height: 10%;
|
||
border-bottom: 1px solid #E5E5E5;
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
padding: 6px 0px 0px 0px;
|
||
}
|
||
|
||
#videoTitle {
|
||
font-size: 14px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
@media (min-width: 1200px) and (min-height: 675px) {
|
||
/*上面一排按钮div的样式*/
|
||
.buttonDiv {
|
||
width: 17%;
|
||
height: 100%;
|
||
float: left;
|
||
border: 2px solid #0EA5FF;
|
||
line-height: 16px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
/*上面一排按钮里面文字的样式*/
|
||
.buttonFont {
|
||
display: inline-block;
|
||
font-size: 16px;
|
||
margin: 7% 0px 0px 0px;
|
||
}
|
||
|
||
/*事项名称文字样式---颜色框*/
|
||
#titleDiv2 {
|
||
width: 100%;
|
||
height: 10%;
|
||
border-bottom: 1px solid #E5E5E5;
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
padding: 9px 0px 0px 0px;
|
||
}
|
||
|
||
#videoTitle {
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
@media (min-width: 1400px) and (min-height: 875px) {
|
||
/*上面一排按钮div的样式*/
|
||
.buttonDiv {
|
||
width: 17%;
|
||
height: 100%;
|
||
float: left;
|
||
border: 2px solid #0EA5FF;
|
||
line-height: 16px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
/*上面一排按钮里面文字的样式*/
|
||
.buttonFont {
|
||
display: inline-block;
|
||
font-size: 20px;
|
||
margin: 7% 0px 0px 0px;
|
||
}
|
||
|
||
/*事项名称文字样式---颜色框*/
|
||
#titleDiv2 {
|
||
width: 100%;
|
||
height: 10%;
|
||
border-bottom: 1px solid #E5E5E5;
|
||
font-size: 22px;
|
||
font-weight: bold;
|
||
padding: 14px 0px 0px 0px;
|
||
}
|
||
|
||
#videoTitle {
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
.col-sm-2 {
|
||
width: 10%;
|
||
}
|
||
|
||
|
||
</style>
|
||
<!-- 文件上传-->
|
||
<link rel="stylesheet" href="<%=request.getContextPath()%>/node_modules/bootstrap-fileinput/css/fileinput.min.css"/>
|
||
<script type="text/javascript"
|
||
src="<%=request.getContextPath()%>/node_modules/bootstrap-fileinput/js/fileinput.min.js"
|
||
charset="utf-8"></script>
|
||
<script type="text/javascript" src="<%=request.getContextPath()%>/node_modules/bootstrap-fileinput/js/locales/zh.js"
|
||
charset="utf-8"></script>
|
||
<script type="text/javascript">
|
||
var filelistView = new Array();
|
||
var control;
|
||
|
||
//启动编辑器
|
||
var myEditor = null;
|
||
|
||
const E = window.wangEditor
|
||
const editor = new E('#div1')
|
||
var id = '${document.id}';
|
||
//var masterId = '${param.masterId}';
|
||
var masterId = '${document.id}';
|
||
var tbName = '${param.tbName}'; //数据表
|
||
var previews = new Array();
|
||
var previewConfigs = new Array();
|
||
|
||
function showFileInputView(ctrlName) {
|
||
control = $('#' + ctrlName);
|
||
|
||
control.fileinput('destroy');
|
||
control.fileinput({
|
||
language: 'zh', //设置语言
|
||
showUpload: false, //是否显示上传按钮
|
||
allowedFileExtensions: ['jpg', 'png', 'gif', 'pdf', 'doc', 'xls', 'docx', 'ppt', 'pptx', 'xlsx', 'wmv', 'mp4'],
|
||
showRemove: false,
|
||
showCaption: false,//是否显示标题
|
||
showBrowse: false,//选择按钮
|
||
showClose: false,//右上角关闭按钮
|
||
dropZoneEnabled: false,//是否显示拖拽区域
|
||
fileActionSettings: {
|
||
showDrag: false,
|
||
showDownload: true, // 显示下载按钮 （这个也很重要）
|
||
},
|
||
browseClass: "btn btn-primary", //按钮样式
|
||
maxFileCount: 10, //表示允许同时上传的最大文件个数
|
||
enctype: 'multipart/form-data',
|
||
validateInitialCount: true,
|
||
previewFileIcon: "<i class='fa fa-file'></i>",
|
||
preferIconicPreview: true,//是否强制相关文件展示icon
|
||
initialPreviewAsData: true,
|
||
previewFileIconSettings: {
|
||
'doc': '<i class="fa fa-file-word-o" style="color:#3c8dbc;"></i>',
|
||
'docx': '<i class="fa fa-file-word-o" style="color:#3c8dbc;"></i>',
|
||
'xls': '<i class="fa fa-file-excel-o" style="color:#00a65a ;"></i>',
|
||
|
||
'xlsx': '<i class="fa fa-file-excel-o" style="color:#00a65a ;"></i>',
|
||
'pptx': '<i class="fa fa-file-powerpoint-o" style="color:#f39c12; "></i>',
|
||
'ppt': '<i class="fa fa-file-powerpoint-o" style="color:#f39c12; "></i>',
|
||
//'jpg': '<i class="fa fa-file-image-o" style="color:#00a65a "></i>',
|
||
'pdf': '<i class="fa fa-file-pdf-o" style="color:#dd4b39 ;"></i>',
|
||
'zip': '<i class="fa fa-file-zip-o" ></i>',
|
||
},
|
||
initialPreview: previews,
|
||
initialPreviewConfig: previewConfigs,
|
||
layoutTemplates: {
|
||
actionDelete: '', //这行可以隐藏删除按钮
|
||
actionUpload: '' //这行可以隐藏上传按钮
|
||
}
|
||
});
|
||
control.on('filezoomhide', function (event, params) {
|
||
//关闭预览模态框后清空内部，防止音视频继续播放
|
||
$(params.modal).find('.kv-zoom-body').empty();
|
||
});
|
||
$('#kvFileinputModal').on("hidden.bs.modal", function () {
|
||
$(this).removeData("bs.modal");
|
||
//modal重复打开会导致前面的滚动条失去作用
|
||
$('.modal').css("overflow", "auto");
|
||
});
|
||
}
|
||
|
||
//名称定义不可修改
|
||
var getFileListView = function () {
|
||
$.post(ext.contextPath + '/base/getInputFileListById.do', {
|
||
id: id,
|
||
masterId: masterId,
|
||
tbName: tbName
|
||
}, function (data) {
|
||
//console.info(data)
|
||
if (data.length > 0) {
|
||
previews = new Array();
|
||
$('#maintenancefile').show();
|
||
for (var i = 0; i < data.length; i++) {
|
||
var previewConfig = new Object();
|
||
var path = data[i].abspath;
|
||
path = path.substring(path.indexOf('webapps') + 7, path.length);
|
||
path = ext.basePath.replace(ext.contextPath, '') + path.replace(/\\/g, "\/");
|
||
;
|
||
previews.push(path);
|
||
previewConfig['width'] = '2500px';
|
||
previewConfig['caption'] = data[i].filename;
|
||
previewConfig['key'] = data[i].id;
|
||
if (data[i].type.split("/")[0] == 'application') {
|
||
previewConfig['type'] = 'pdf';
|
||
} else {
|
||
previewConfig['type'] = data[i].type.split("/")[0];
|
||
}
|
||
previewConfig['downloadUrl'] = ext.contextPath + "/base/downloadFile.do?key=" + data[i].id + "&tbName=" + tbName;//这个是显示下载按钮的关键，如果没有此属性，下载按钮是不会显示的。
|
||
previewConfig['size'] = data[i].size;
|
||
previewConfig['filetype'] = data[i].type;
|
||
previewConfigs.push(previewConfig);
|
||
}
|
||
}
|
||
showFileInputView("filelistView");
|
||
/*else {
|
||
$('#filelistView').hide();
|
||
}*/
|
||
}, 'json');
|
||
|
||
};
|
||
// var closeModal = function () {
|
||
// setTimeout(function () {
|
||
// $("#subDiv").empty();
|
||
// }, 2000);
|
||
// };
|
||
|
||
function saveEditor() {
|
||
var editorText = editor.txt.html();
|
||
console.log(editorText)
|
||
}
|
||
|
||
//初始化fileinput控件（第一次初始化）
|
||
function initFileInput(ctrlName, uploadUrl) {
|
||
control = $('#' + ctrlName);
|
||
control.fileinput({
|
||
language: 'zh', //设置语言
|
||
uploadUrl: uploadUrl, //上传的地址
|
||
uploadAsync: true,
|
||
//allowedFileExtensions : ['jpg', 'png','gif','pdf','doc','xls','docx','ppt','pptx','xlsx'],//接收的文件后缀
|
||
showUpload: false, //是否显示上传按钮
|
||
showRemove: false,
|
||
showCaption: true,//是否显示标题
|
||
showClose:false,//右上角关闭按钮
|
||
browseClass: "btn btn-primary", //按钮样式
|
||
maxFileCount: 10, //表示允许同时上传的最大文件个数
|
||
enctype: 'multipart/form-data',
|
||
dropZoneEnabled: false ,//是否显示拖拽区域
|
||
validateInitialCount:true,
|
||
previewFileIcon: "<i class='fa fa-file'></i>",
|
||
preferIconicPreview: true,//是否强制相关文件展示icon
|
||
initialPreviewAsData: true,
|
||
previewFileIconSettings: {
|
||
'doc': '<i class="fa fa-file-word-o" style="color:#3c8dbc;"></i>',
|
||
'docx': '<i class="fa fa-file-word-o" style="color:#3c8dbc;"></i>',
|
||
'xls': '<i class="fa fa-file-excel-o" style="color:#00a65a ;"></i>',
|
||
|
||
'xlsx': '<i class="fa fa-file-excel-o" style="color:#00a65a ;"></i>',
|
||
'pptx': '<i class="fa fa-file-powerpoint-o" style="color:#f39c12; "></i>',
|
||
'ppt': '<i class="fa fa-file-powerpoint-o" style="color:#f39c12; "></i>',
|
||
//'jpg': '<i class="fa fa-file-image-o" style="color:#00a65a "></i>',
|
||
'pdf': '<i class="fa fa-file-pdf-o" style="color:#dd4b39 ;"></i>',
|
||
'zip': '<i class="fa fa-file-zip-o" ></i>',
|
||
},
|
||
|
||
uploadExtraData:function (previewId, index) {
|
||
var editorText = editor.txt.html();
|
||
//传参
|
||
var data = {
|
||
"masterId": '${document.id}', //此处自定义传参
|
||
"tbName": '${param.tbName}',
|
||
"nameSpace": '${param.nameSpace}',
|
||
"equipmentIds":$("#equipmentIds").val(),
|
||
// "wName":$("#wName").val(),
|
||
// "wContent": editorText
|
||
};
|
||
return data;
|
||
},
|
||
//设置缩略图上的按钮,为空不显示，默认显示
|
||
layoutTemplates:{
|
||
//actionDelete:'',
|
||
actionUpload:''
|
||
},
|
||
slugCallback: function (data,data2) {
|
||
console.log(data2);
|
||
return data;
|
||
},
|
||
});
|
||
/* control.on("filebatchselected", function (event, data, previewId, index) {
|
||
$(this).fileinput("upload");
|
||
}); */
|
||
//导入文件上传完成之后的事件
|
||
control.on("fileuploaded", function (event, data, previewId, index) {
|
||
if(data.response.suc) {
|
||
var editorText = editor.txt.html();
|
||
$("#wContent").val(editorText);
|
||
$.post(ext.contextPath + "/documentData/doupdate.do", $("#fileInputModalForm").serialize(), function(data) {
|
||
if (data.res == 1){
|
||
closeModal('fileInputViewModal');
|
||
$("#fileTable").bootstrapTable('refresh');
|
||
}else if(data.res == 0){
|
||
showAlert('d','保存失败');
|
||
}else{
|
||
showAlert('d',data.res);
|
||
}
|
||
},'json');
|
||
}
|
||
if(!data.response.pdf) {
|
||
closeModal('fileInputViewModal');
|
||
$("#fileTable").bootstrapTable('refresh');
|
||
showAlert('d','上传的文件转换为预览PDF格式失败！');
|
||
}
|
||
});
|
||
}
|
||
$(function() {
|
||
if (tbName == null || tbName == '' || tbName == undefined) {
|
||
tbName = 'tb_teacher_file';
|
||
}
|
||
getFileListView();
|
||
|
||
//initFileInput("filelistView",ext.contextPath+ "/document/inputFile.do");
|
||
|
||
var div3 = document.getElementById('div1');
|
||
editor.config.height = div3.clientHeight - 120;
|
||
//取消自动 focus
|
||
editor.config.focus = false
|
||
// 配置全屏功能按钮是否展示
|
||
editor.config.showFullScreen = false
|
||
// 隐藏菜单栏提示
|
||
editor.config.showMenuTooltips = true
|
||
// 配置 onchange 回调函数
|
||
editor.config.onchange = function (newHtml) {
|
||
//console.log('change 之后最新的 html', newHtml)
|
||
}
|
||
// 配置触发 onchange 的时间频率，默认为 200ms
|
||
editor.config.onchangeTimeout = 500 // 修改为 500ms
|
||
|
||
//图片上传
|
||
editor.config.uploadFileName = 'myFile'; //设置文件上传的参数名称
|
||
editor.config.uploadImgServer = ext.contextPath + "/command/emergencyConfigure/upload4WangEditor.do";
|
||
editor.config.uploadImgAccept = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp']// 图片格式限制
|
||
editor.config.uploadImgMaxSize = 10 * 1024 * 1024 // 图片大小限制10M
|
||
editor.config.uploadImgMaxLength = 1; // 一次最多上传 1 个图片
|
||
|
||
editor.create();
|
||
|
||
editor.config.pasteTextHandle = function (content) {
|
||
// content 即粘贴过来的内容（html 或 纯文本），可进行自定义处理然后返回
|
||
if (content == '' && !content) return ''
|
||
var str = content
|
||
str = str.replace(/<xml>[\s\S]*?<\/xml>/ig, '')
|
||
str = str.replace(/<style>[\s\S]*?<\/style>/ig, '')
|
||
str = str.replace(/<\/?[^>]*>/g, '')
|
||
str = str.replace(/[ | ]*\n/g, '\n')
|
||
str = str.replace(/' '/g, '')
|
||
str = str.replace(/'：'/g, ':')
|
||
|
||
return str
|
||
}
|
||
|
||
editor.txt.html('${document.wContent}') // 重新设置编辑器内容
|
||
editor.config.uploadImgHooks = {
|
||
customInsert: function (insertImgFn, result) {
|
||
// result 即服务端返回的接口
|
||
//console.log('customInsert', result)
|
||
// insertImgFn 可把图片插入到编辑器，传入图片 src ，执行函数即可
|
||
insertImgFn(result.data[0])
|
||
}
|
||
}
|
||
|
||
})
|
||
</script>
|
||
<div class="modal fade" id="fileInputViewModal">
|
||
<div class="modal-dialog modal-xlg">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||
<span aria-hidden="true">×</span></button>
|
||
<h4 class="modal-title">浏览</h4>
|
||
</div>
|
||
<div class="modal-body">
|
||
<!-- 新增界面formid强制为subForm -->
|
||
<form class="form-horizontal" id="fileInputModalForm" style="padding:10px">
|
||
<div id="alertFileDiv"></div>
|
||
<input type="hidden" class="form-control" id ="masterId" name ="masterId" value="${document.masterId}">
|
||
<input type="hidden" class="form-control" id ="id" name ="id" value="${document.id}">
|
||
<textarea id ="wContent" name ="wContent" style="display:none;">${document.wContent}</textarea>
|
||
<div class="form-group">
|
||
<label class="col-md-2 col-xs-3 control-label">资料名称</label>
|
||
<div class="col-md-10 col-xs-9">
|
||
<p class="form-control-static">${document.wName}</p>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-md-2 col-xs-3 control-label">关联设备</label>
|
||
<div class="col-md-10 col-xs-9">
|
||
<p class="form-control-static">${CommonFile.equipmentcardnames}</p>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-md-2 col-xs-12 control-label">文件</label>
|
||
<div class="col-md-10 col-xs-12">
|
||
<input type="file" name="filelistView" id="filelistView" multiple class="file-loading"/>
|
||
</div>
|
||
</div>
|
||
<div style="background:#FFFFFF;text-align:center;min-height: 300px;" valign="middle"
|
||
align="left">
|
||
<div id="titleDiv2">
|
||
<font id="content">资料内容</font>
|
||
</div>
|
||
<%-- 资料内容 --%>
|
||
<div class="box-body" align="left">
|
||
<div id="div1" style="min-height: 250px;">
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
|
||
</div>
|
||
</div>
|
||
<!-- /.modal-content -->
|
||
</div>
|
||
<!-- /.modal-dialog -->
|
||
</div>
|