预览附件
Some checks are pending
Java CI with Maven / build (11) (push) Waiting to run
Java CI with Maven / build (17) (push) Waiting to run
Java CI with Maven / build (8) (push) Waiting to run
yudao-ui-admin CI / build (14.x) (push) Waiting to run
yudao-ui-admin CI / build (16.x) (push) Waiting to run

This commit is contained in:
XaoLi717 2025-01-15 17:48:03 +08:00
parent 6758f6bffe
commit cde20db807
4 changed files with 318 additions and 0 deletions

View File

@ -129,6 +129,26 @@ public class onlyofController {
return new ResponseEntity<Object>("上传成功", HttpStatus.OK);
}
/**
* 预览文件的接口
*/
@GetMapping("/view")
@Operation(summary = "编辑文件")
public ModelAndView viewDocFile(@RequestParam String name, String userName, String userId ,String cDate ,String token) {
String cDate2 = "";
cDate2 = cDate.isEmpty() ? cDate : cDate + "\\";
String path = filePath+cDate2+name;
ModelAndView mav = new ModelAndView();
Document document = documentService.getDocumentToken(documentService.buildDocument(path, name),token,cDate);
mav.addObject("document", document);
if (!documentService.canEdit(document)) {
return mav;
}
mav.addObject("documentEditParam", documentService.buildDocumentEditParamToken(userId, userName, name,token,cDate2));
mav.setViewName("viewer");
return mav;
}
/**
* 编辑文件的接口
* @param name

View File

@ -0,0 +1,175 @@
var Editor = function () {
var docEditor;
var innerAlert = function (message) {
if (console && console.log)
console.log(message);
};
var onAppReady = function () {
innerAlert("文档编辑已就绪~");
};
var onDocumentStateChange = function (event) {
var title = document.title.replace(/\*$/g, "");
document.title = title + (event.data ? "*" : "");
};
var onError = function (event) {
if (event) {
innerAlert(event.data);
}
};
var onOutdatedVersion = function (event) {
//TODO
location.reload(true);
};
var onAppReady = function() {
console.log("ONLYOFFICE Document Editor is ready");
};
var onCollaborativeChanges = function () {
console.log("The document changed by collaborative user");
};
var onDocumentReady = function() {
console.log("Document is loaded");
};
var onDocumentStateChange = function (event) {
if (event.data) {
console.log("The document changed");
// docEditor.downloadAs();
} else {
console.log("Changes are collected on document editing service");
//
}
};
var onDownloadAs = function (event) {
console.log("ONLYOFFICE Document Editor create file: " + event.data);
window.top.postMessage(event.data);
createAndDownloadFile("test.docx",event.data)
};
window.addEventListener('message',function(e){
console.log(e.data)
if (e.data=="downloadAs") {
docEditor.downloadAs();
}
},false)
$("#insertImage").click(function(event) {
console.log("ONLYOFFICE Document Editor insertImage: "+ event.data);
docEditor.insertImage({
"fileType": "png",
"url": "http://192.168.0.58:20056/attachment/20190728测试上传文件名修改/2020January/1580363537940306800_small.png"
});
})
var onRequestInsertImage = function(event) {
console.log("ONLYOFFICE Document Editor insertImage" + event.data);
docEditor.insertImage({
"fileType": "png",
"url": "http://192.168.0.58:20056/attachment/20190728测试上传文件名修改/2020January/1580363537940306800_small.png"
});
};
var onError = function (event) {
console.log("ONLYOFFICE Document Editor reports an error: code " + event.data.errorCode + ", description " + event.data.errorDescription);
};
var onOutdatedVersion = function () {
location.reload(true);
};
var onRequestEditRights = function () {
console.log("ONLYOFFICE Document Editor requests editing rights");
// document.location.reload();
var he=location.href.replace("view","edit");
location.href=he;
};
//历史版本保留1个月。比如Unix时间戳Unix timestampexpires=1524547423
var onRequestHistory = function() {
};
var onRequestHistoryClose = function() {
document.location.reload();
};
var getUrlParam = function (name) {
//构造一个含有目标参数的正则表达式对象
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
//匹配目标参数
var r = window.location.search.substr(1).match(reg);
//返回参数值
if (r != null) {
return decodeURI(r[2]);
}
return null;
};
var getDocumentConfig = function (document) {
if (document) {
return {
"document": document
};
}
innerAlert("文档未指定!");
return null;
};
var onRequestHistoryData = function() {}
var сonnectEditor = function (document, documentEditParam) {
var config = getDocumentConfig(document);
console.log(document)
console.log(documentEditParam)
config.width = "100%";
config.height = "100%";
config.events = {
"onAppReady": onAppReady,
"onDocumentStateChange": onDocumentStateChange,
"onError": onError,
"onOutdatedVersion": onOutdatedVersion
};
//config.documentType = ""+document.fileType
config.editorConfig = {
"lang": "zh-CN",
"mode": "view",
"recent": [],
// 自定义一些配置
"customization": {
"chat": true, // 禁用聊天菜单按钮
"commentAuthorOnly": false, // 仅能编辑和删除其注释
"comments": false, // 隐藏文档注释菜单按钮
"compactHeader": false, // 隐藏附加操作按钮
"compactToolbar": false, // 完整工具栏(true代表紧凑工具栏)
"feedback": {
"visible": true // 隐藏反馈按钮
},
"forcesave": false, // true 表示强制文件保存请求添加到回调处理程序
"goback": false,/*{
"blank": true, // 转到文档时,在新窗口打开网站(false表示当前窗口打开)
"text": "转到文档位置(可以考虑放文档打开源页面)",
// 文档打开失败时的跳转也是该地址
"url": "http://www.lezhixing.com.cn"
},*/
"help": false, // 隐藏帮助按钮
"hideRightMenu": false, // 首次加载时隐藏右侧菜单(true 为显示)
"showReviewChanges": false, // 加载编辑器时自动显示/隐藏审阅更改面板(true显示 false隐藏)
"toolbarNoTabs": false, // 清楚地显示顶部工具栏选项卡(true 代表仅突出显示以查看选择了哪一个)
"zoom": 100 // 定义文档显示缩放百分比值
},
};
$.extend(config.editorConfig, documentEditParam);
console.log(config)
docEditor = new DocsAPI.DocEditor("iframeEditor",config);
};
return {
init: function (document, documentEditParam) {
console.log("-----сonnectEditor-----")
сonnectEditor(document, documentEditParam);
}
}
}();

View File

@ -0,0 +1,97 @@
var Viewer = function() {
var docEditor;
var innerAlert = function (message) {
if (console && console.log)
console.log(message);
};
var onAppReady = function () {
innerAlert("文档查看已就绪~");
};
var onDocumentStateChange = function (event) {
var title = document.title.replace(/\*$/g, "");
document.title = title + (event.data ? "*" : "");
};
var onError = function (event) {
if (event) {
innerAlert(event.data);
}
};
var onOutdatedVersion = function (event) {
location.reload(true);
};
var getUrlParam = function (name) {
//构造一个含有目标参数的正则表达式对象
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
//匹配目标参数
var r = window.location.search.substr(1).match(reg);
//返回参数值
if (r != null) {
return decodeURI(r[2]);
}
return null;
};
var getDocumentConfig = function (document) {
if (document) {
return {
"document": document
};
}
innerAlert("文档未指定!");
return null;
};
var сonnectEditor = function (document) {
var config = getDocumentConfig(document);
config.width = "100%";
config.height = "100%";
config.events = {
"onAppReady": onAppReady,
"onDocumentStateChange": onDocumentStateChange,
"onError": onError,
"onOutdatedVersion": onOutdatedVersion
};
config.editorConfig = {
"lang": "zh-CN",
"mode": "view",
"recent": [],
// 自定义一些配置
"customization": {
"chat": false, // 禁用聊天菜单按钮
"commentAuthorOnly": true, // 仅能编辑和删除其注释
"comments": false, // 隐藏文档注释菜单按钮
"compactHeader": false, // 隐藏附加操作按钮
"compactToolbar": false, // 完整工具栏(true代表紧凑工具栏)
"feedback": {
"visible": false // 隐藏反馈按钮
},
"forcesave": false, // true 表示强制文件保存请求添加到回调处理程序
"goback": false,/*{
"blank": true, // 转到文档时,在新窗口打开网站(false表示当前窗口打开)
"text": "转到文档位置(可以考虑放文档打开源页面)",
// 文档打开失败时的跳转也是该地址
"url": "http://www.lezhixing.com.cn"
},*/
"help": false, // 隐藏帮助按钮
"hideRightMenu": false, // 首次加载时隐藏右侧菜单(true 为显示)
"showReviewChanges": false, // 加载编辑器时自动显示/隐藏审阅更改面板(true显示 false隐藏)
"toolbarNoTabs": false, // 清楚地显示顶部工具栏选项卡(true 代表仅突出显示以查看选择了哪一个)
"zoom": 100 // 定义文档显示缩放百分比值
}
};
docEditor = new DocsAPI.DocEditor("iframeEditor", config);
};
return {
init : function(document) {
сonnectEditor(document);
}
}
}();

View File

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="zh-CN">
<head>
<title th:text="${document.title}"></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" th:href="@{/css/viewer.css}">
</head>
<!--//整个文件就是前端打开的编辑窗口的配置-->
<body>
<div class="form">
<div id="iframeEditor"></div>
<h1 th:text="${document.title}">Document Title</h1>
<pre th:text="${documentEditParam}">Document Edit Param</pre>
</div>
<script type="text/javascript" th:src="@{/js/jquery-1.8.2.js}"></script>
<script type="text/javascript" th:src="@{${documentServerApiJs}}"></script>
<script type="text/javascript" th:src="@{/js/viewer.js}"></script>
<!-- 先通过 th:inline=“javascript” 添加到标签这样js代码即可访问model中的属性 -->
<script th:inline="javascript">
// js 中可以通过“[[${xxx}]]” 格式获得实际的值
Editor.init([[${document}]], [[${documentEditParam}]]);
</script>
<!-- <script type="text/javascript" src="http://192.168.1.15:7878/web-apps/apps/api/documents/api.js"></script>-->
</body>
</html>