Jelajahi Sumber

增加txt文件、图片预览页面

陈长荣 2 bulan lalu
induk
melakukan
ff66437028

+ 26 - 3
src/main/java/com/github/jfcloud/excel/editor/docdeal/controller/PreviewController.java

@@ -1,5 +1,6 @@
 package com.github.jfcloud.excel.editor.docdeal.controller;
 
+import cn.hutool.core.io.IoUtil;
 import cn.hutool.core.io.file.FileNameUtil;
 import cn.hutool.core.lang.Pair;
 import cn.hutool.core.util.IdUtil;
@@ -8,6 +9,7 @@ import cn.hutool.http.HttpResponse;
 import cn.hutool.http.HttpUtil;
 import com.alibaba.fastjson.JSON;
 import com.alibaba.fastjson.JSONObject;
+import com.amazonaws.services.s3.model.S3ObjectInputStream;
 import com.github.jfcloud.excel.editor.docdeal.bean.*;
 import com.github.jfcloud.excel.editor.docdeal.constant.CommandEnum;
 import com.github.jfcloud.excel.editor.docdeal.constant.DocumentConstants;
@@ -17,12 +19,16 @@ import com.github.jfcloud.excel.editor.docdeal.oss.service.OssTemplate;
 import lombok.extern.slf4j.Slf4j;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.beans.factory.annotation.Value;
+import org.springframework.http.MediaType;
+import org.springframework.http.MediaTypeFactory;
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
 import org.springframework.web.bind.annotation.*;
 
 import javax.servlet.http.HttpServletRequest;
 import java.io.ByteArrayInputStream;
+import java.nio.charset.StandardCharsets;
+import java.util.Optional;
 import java.util.stream.Collectors;
 
 @Slf4j
@@ -49,17 +55,34 @@ public class PreviewController {
         vo.setEdit(false);
         log.info("==> 查看文档 vo: {}", vo);
         Pair<Document, DocumentEditParam> pair = docInfo(vo);
+        model.addAttribute("name", vo.getName());
 
-        if (!ossTemplate.exist(pair.getKey().getStorage(), vo.getName())) {
-            model.addAttribute("name", vo.getName());
+        String bucketName = pair.getKey().getStorage();
+        if (!ossTemplate.exist(bucketName, vo.getName())) {
             return "/notFound";
         }
 
+        Optional<MediaType> opt = MediaTypeFactory.getMediaType(vo.getName());
+        if (opt.isPresent()) {
+            MediaType mediaType = opt.get();
+            //图片
+            if (mediaType.getType().equals("image")) {
+                model.addAttribute("src", "/download?name=" + vo.getName() + "&bucket=" + bucketName);
+                return "/viewerImg";
+            }
+            //文本
+            if (mediaType.getType().equals("text")) {
+                S3ObjectInputStream inputStream = ossTemplate.getObject(bucketName, vo.getName()).getObjectContent();
+                model.addAttribute("content", IoUtil.read(inputStream, StandardCharsets.UTF_8));
+                return "/viewerTxt";
+            }
+        }
+
         model.addAttribute("document", pair.getKey());
         model.addAttribute("documentEditParam", pair.getValue());
 
         String suffix = FileNameUtil.getSuffix(vo.getName());
-        if (suffix.equals("xls") || suffix.equals("xlsx")) {
+        if (suffix.equalsIgnoreCase("xls") || suffix.equalsIgnoreCase("xlsx")) {
             return "/viewerExcel";
         }
         return "/viewer";

+ 49 - 0
src/main/resources/templates/viewerImg.html

@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
+<head>
+  <meta charset="UTF-8">
+  <meta content="width=device-width, initial-scale=1.0" name="viewport">
+  <title th:text="${name}">图片</title>
+  <style>
+      body {
+          font-family: 'Helvetica Neue', Arial, sans-serif;
+          margin: 0;
+          padding: 0;
+          background-color: #f8f9fa;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          min-height: 100vh;
+      }
+
+      .container {
+          max-width: 900px;
+          width: 90%;
+          margin: 80px auto;
+          text-align: center;
+      }
+
+      .image-container {
+          background: white;
+          padding: 20px;
+          border-radius: 10px;
+          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+          margin-bottom: 30px;
+      }
+
+      .image-display {
+          max-width: 100%;
+          max-height: 70vh;
+          object-fit: contain;
+          border-radius: 5px;
+      }
+  </style>
+</head>
+<body>
+<div class="container">
+  <div class="image-container">
+    <img class="image-display" th:src="${src}">
+  </div>
+</div>
+</body>
+</html>

+ 95 - 0
src/main/resources/templates/viewerTxt.html

@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
+<head>
+  <meta charset="UTF-8">
+  <meta content="width=device-width, initial-scale=1.0" name="viewport">
+  <title th:text="${name}">文本文件</title>
+  <style>
+      body {
+          font-family: 'Segoe UI', system-ui, sans-serif;
+          line-height: 1.6;
+          max-width: 800px;
+          margin: 0 auto;
+          padding: 20px;
+          color: #333;
+          background-color: #f0f4f8; /* 柔和的蓝灰色背景 */
+      }
+
+      header {
+          text-align: center;
+          margin-bottom: 30px;
+          padding-bottom: 15px;
+          border-bottom: 1px solid #eaeaea;
+      }
+
+      h1 {
+          color: #2c3e50;
+          margin-bottom: 10px;
+      }
+
+      .file-selector {
+          background: white;
+          padding: 20px;
+          border-radius: 8px;
+          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
+          margin-bottom: 20px;
+          text-align: center;
+      }
+
+      input[type="file"] {
+          width: 0.1px;
+          height: 0.1px;
+          opacity: 0;
+          overflow: hidden;
+          position: absolute;
+          z-index: -1;
+      }
+
+      label {
+          display: inline-block;
+          padding: 12px 24px;
+          background: #3498db;
+          color: white;
+          border-radius: 4px;
+          cursor: pointer;
+          transition: background 0.2s;
+      }
+
+      label:hover {
+          background: #2980b9;
+      }
+
+      .content-display {
+          background: white;
+          padding: 20px;
+          border-radius: 8px;
+          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
+          min-height: 300px;
+          white-space: pre-wrap;
+          font-family: PingFang SC, Arial, sans-serif;
+          overflow-x: auto;
+          font-size: 16px; /* 增大文件内容文字大小 */
+          line-height: 1.8; /* 增加行间距 */
+      }
+
+      footer {
+          text-align: center;
+          margin-top: 30px;
+          padding-top: 15px;
+          border-top: 1px solid #eaeaea;
+          color: #7f8c8d;
+          font-size: 14px;
+      }
+  </style>
+</head>
+<body>
+<header>
+  <h1 th:text="${name}"></h1>
+</header>
+
+<div class="content-display" id="fileContent" th:text="${content}">
+</div>
+
+<footer>文本文件</footer>
+</body>
+</html>