1.excel文件预览调整

src/main/webapp/HG/WD/HGWD002A.js

@@ -142,6 +142,8 @@ function preview(docId, docType) {
 	$("#descDiv").css('display', 'none');
 	if (isText(docType)) {
 		previewText(docId);
+	} else if (isXml(docType)) {
+		previewXml(docId);
 	} else if (isExcel(docType)) {
 		previewExcel(docId);
 	} else if (isWord(docType)) {
@@ -159,6 +161,8 @@ function preview(docId, docType) {
  * 隐藏显示区域
  */
 function hideHtml() {
+	$("#textContainer").css('display', 'none');
+	$("#textSpan").html("");
 	$("#docxContainer").css('display', 'none');
 	$("#imageContainer").css('display', 'none');
 	$("#image").attr('src', "");
@@ -187,14 +191,43 @@ function isText(docType) {
  */
 function previewText(docId) {
 	fetch(downloadHref(docId, true)).then(res => {
-		return res.arrayBuffer();
-	}).then(arrayBuffer => {
-		let container = document.getElementById("descDiv");
+		return res.text();
+	}).then(data => {
+		let container = document.getElementById("textContainer");
 		container.style.display = 'block';
 		// 使用new TextDecoder()指定编码
-		const utf8Decoder = new TextDecoder('GBK', {ignoreBOM: true});
-		const decodedText = utf8Decoder.decode(arrayBuffer);
-		$("#descSpan").html(decodedText.replace(/\r\n?/g, '\n').replace(/\n/g, '<br/>'));
+		// const utf8Decoder = new TextDecoder('UTF-8', {ignoreBOM: true});
+		// const decodedText = utf8Decoder.decode(arrayBuffer);
+		$("#textSpan").text(data);
+	});
+}
+
+/**
+ * 是否文本
+ *
+ * @param fileName
+ * @returns {boolean}
+ */
+function isXml(docType) {
+	if (isBlank(docType)) {
+		return false;
+	}
+	const extensions = ['xml'];
+	return extensions.includes(docType.toLowerCase());
+}
+
+/**
+ * xml文件预览
+ *
+ * @param docId
+ */
+function previewXml(docId) {
+	fetch(downloadHref(docId, true)).then(res => {
+		return res.text();
+	}).then(data => {
+		let container = document.getElementById("textContainer");
+		container.style.display = 'block';
+		$("#textSpan").text(data);
 	});
 }
 
@@ -219,14 +252,31 @@ function isExcel(docType) {
  */
 function previewExcel(docId) {
 	fetch(downloadHref(docId, true)).then(res => {
-		return res.text();
-	}).then(text => {
-		let container = document.getElementById("descDiv");
+		return res.blob();
+	}).then(blob => {
+		let container = document.getElementById("textContainer");
 		container.style.display = 'block';
 		// 使用new TextDecoder()指定编码
-		const utf8Decoder = new TextDecoder('GBK', {ignoreBOM: true});
-		const decodedText = utf8Decoder.decode(arrayBuffer);
-		$("#descSpan").html(decodedText.replace(/\r\n?/g, '\n').replace(/\n/g, '<br/>'));
+		// const utf8Decoder = new TextDecoder('GBK', {ignoreBOM: true});
+		// const text = utf8Decoder.decode(arrayBuffer);
+		// $("#textSpan").html(text.replace(/\r\n?/g, '\n').replace(/\n/g, '<br/>'));
+		const reader = new FileReader();
+		reader.readAsArrayBuffer(blob);
+		reader.onload = function(e) {
+			let textSpan = document.getElementById('textSpan');
+			// 清空内容
+			textSpan.innerHTML = "";
+			let result = new Uint8Array(e.target.result);
+			let workbook = XLSX.read(result, {type: 'array'});
+			let sheetNames = workbook.SheetNames;
+			for (let i = 0; i < sheetNames.length; i++) {
+				// 	假设我们只需要第一个工作表
+				var worksheet = workbook.Sheets[sheetNames[i]];
+				var data = XLSX.utils.sheet_to_html(worksheet);
+				// 在页面上显示JSON数据
+				textSpan.innerHTML += data + "<br/>";
+			}
+		};
 	});
 }
 

src/main/webapp/HG/WD/HGWD002A.jsp

@@ -7,6 +7,7 @@
 
 <script src="${ctx}/common/docxjs/jszip.min.js"></script>
 <script src="${ctx}/common/docxjs/docx-preview.js"></script>
+<script src="${ctx}/common/js/xlsx.full.min.js"></script>
 <style>
   .left-flex {
     /*display: flex;*/
@@ -42,6 +43,18 @@
     cursor: zoom-out;
   }
 
+  .textSpan {
+    font-size: 14px;
+  }
+
+  .textSpan table {
+    border: 1px solid black;
+  }
+
+  .textSpan table td {
+    border: 1px solid black;
+  }
+
 </style>
 <EF:EFPage title="文件预览">
 	<div class="row" style="margin: 0 -10px;">
@@ -61,6 +74,10 @@
 				<div id="descDiv" class="center-flex">
 					<span id="descSpan" style="font-weight: bold;font-size: 18px">文件预览区域...</span>
 				</div>
+				<%-- 文本预览 --%>
+				<div id="textContainer" class="center-flex">
+					<pre id="textSpan" class="textSpan"></pre>
+				</div>
 				<%-- docx文件预览--%>
 				<div id="docxContainer" style="display: none;"></div>
 				<%-- IMAGE文件预览--%>

src/main/webapp/HG/WD/HGWD003B.jsp

@@ -18,8 +18,8 @@
 		<EF:EFGrid blockId="result" autoDraw="override" checkMode="row" height="69vh">
 			<EF:EFColumn ename="fileId" cname="目录ID" hidden="true" primaryKey="true"/>
 			<EF:EFColumn ename="projCode" cname="项目编号" enable="false" width="120" align="center"/>
-			<EF:EFColumn ename="projName" cname="项目名称" enable="false" width="120" align="left"/>
-			<EF:EFColumn ename="fileName" cname="目录名称" enable="false" width="120" align="left"/>
+			<EF:EFColumn ename="projName" cname="项目名称" enable="false" width="180" align="left"/>
+			<EF:EFColumn ename="fileName" cname="目录名称" enable="false" width="180" align="left"/>
 		</EF:EFGrid>
 	</EF:EFRegion>
 </EF:EFPage>