局部刷新

src/main/java/com/mooctest/controller/FinalReportController.java

@@ -55,6 +55,8 @@ public class FinalReportController {
         return "final_report_list";
     }
 
+
+
     @DeleteMapping("final_report/{reportId}")
     @ResponseBody
     public long deleteReport(@PathVariable long reportId) {

src/main/java/com/mooctest/controller/ReportController.java

@@ -18,6 +18,7 @@ import org.springframework.ui.Model;
 import org.springframework.util.ResourceUtils;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.bind.annotation.ResponseBody;
 
 import javax.servlet.http.HttpServletRequest;
 import java.io.*;
@@ -110,6 +111,40 @@ public class ReportController {
         return "agg_report_new";
     }
 
+    @GetMapping("editReportData")
+    @ResponseBody
+    public FinalReportDTO getEditReportData(@RequestParam("masterId") String masterId,
+                                          @RequestParam(value = "finalReportId", required = false) Long finalReportId,
+                                          Model model){
+        List<FinalReportDTO> finalReports = finalReportService.getBySourceId(masterId);
+        Optional<FinalReportDTO> finalReportDTO = finalReports.stream().filter(finalReport -> finalReport.getId()==finalReportId).findFirst();
+        return finalReportDTO.get();
+    }
+
+    //报告列表
+    @GetMapping("created_reports")
+    public String getCreatedReports(@RequestParam("masterId") String masterId,
+                                    @RequestParam("examId") long examId,
+                                    @RequestParam("caseId") long caseId,Model model){
+        List<FinalReportDTO> finalReports = finalReportService.getBySourceId(masterId);
+        model.addAttribute("examId", examId);
+        model.addAttribute("caseId", caseId);
+        model.addAttribute("finalReports", finalReports);
+        model.addAttribute("category2String", ReportUtil.category2String);
+        model.addAttribute("recurrent2String", ReportUtil.recurrent2String);
+        model.addAttribute("severity2String", ReportUtil.severity2String);
+        return "agg_report_new::ul_reports";
+    }
+
+    //创建报告界面
+    @GetMapping("created_reports_form")
+    public String getCreatedReportssd(Model model){
+        model.addAttribute("category2String", ReportUtil.category2String);
+        model.addAttribute("recurrent2String", ReportUtil.recurrent2String);
+        model.addAttribute("severity2String", ReportUtil.severity2String);
+        return "agg_report_new::create_reports";
+    }
+
     private String getWordCloudList(List<BugDTO> sourceReports) {
         Map<String, Integer> wordCount = new HashMap<>();
         Set<String> stopWords = new HashSet<>();

src/main/java/com/mooctest/controller/TaskController.java

@@ -39,6 +39,11 @@ public class TaskController {
         return "task_list";
     }
 
+    @GetMapping("/")
+    public String root(Model model) {
+        return "redirect:/home";
+    }
+
     @GetMapping("/task_detail")
     public String taskDetail(@RequestParam("examId") long examId,
                              @RequestParam("caseId") long caseId,

src/main/resources/static/js/partload.js

@@ -0,0 +1,72 @@
+
+function syncCreatedReportsWithParams(masterId,examId,caseId) {
+
+
+
+    $.ajax({
+        type: "GET",
+        url: '/created_reports',
+        data:{
+            masterId:masterId,
+            examId:examId,
+            caseId:caseId
+        },
+        success: function (data) {
+
+            var listhtml = '';
+            if(data==null||data.length==0){
+                listhtml = showNoneData();
+            }else{
+                listhtml += '<ul class="list-group">'
+                for(var i = 0 ; i<data.length ; i++){
+                    listhtml+=showReportData(data[i]);
+                }
+                listhtml+="</ul>";
+            }
+            document.getElementById("new-created-reports").innerHTML = listhtml;
+        }
+    });
+
+}
+
+function showNoneData () {
+    return "<div style=\"font-size: 20px\">\n" +
+        "                            暂无 <a onclick=\"showCreateBlock()\" style=\"cursor: pointer\">立即创建报告</a>\n" +
+        "                        </div>\n" +
+        "                        <ul class=\"list-group\">\n" +
+        "                        </ul>";
+}
+
+function showReportData ( data ){
+    console.log(data)
+    return "<li class=\"list-group-item\">\n" +
+        "                                    <div style=\"overflow: auto;\">\n" +
+        "                                        <span >" +data.id+
+        "</span>\n" +
+        "                                        <span class=\"pull-right\">\n" +
+        "\n" +
+        "                                            <a href=\"report?masterId=" +data.sourceId+"&amp;examId="+data.examId+"&amp;caseId="+data.caseId+"&amp;finalReportId="+data.finalReportId+
+        "\">编辑</a>\n" +
+        "                                            <a href=\"#\" onclick=\"'deleteReport('+ ${finalReport.id} +')'\">删除</a>\n" +
+        "                                        </span>\n" +
+        "                                    </div>\n" +
+        "\n" +
+        "                                    <div>\n" +
+        "                                        <span>\n" +
+        "                                            复现程度：<span th:text=\"${recurrent2String.get(finalReport.recurrent)}\"></span>\n" +
+        "                                        </span>\n" +
+        "                                        <span class=\"pull-right\">\n" +
+        "                                            分类：<span th:text=\"${category2String.get(finalReport.category)}\"></span>\n" +
+        "                                        </span>\n" +
+        "                                    </div>\n" +
+        "                                    <div>\n" +
+        "                                        严重程度：<span th:text=\"${severity2String.get(finalReport.severity)}\"></span>\n" +
+        "                                    </div>\n" +
+        "                                    <br/>\n" +
+        "                                    <span th:text=\"${finalReport.description}\"></span>\n" +
+        "                                    <br/>\n" +
+        "                                    <img class=\"my-img-thumbnail pointer to-add\" th:src=\"${imgUrl}\"\n" +
+        "                                         th:each=\"imgUrl,iterStat : ${finalReport.getImgUrls()}\"\n" +
+        "                                         th:onclick=\"'javascript:showimage(\\''+${imgUrl}+'\\');'\"/>\n" +
+        "                                </li>";
+}

src/main/resources/templates/agg_report_list.html

@@ -141,18 +141,21 @@
 <div class="modal fade bs-example-modal-lg text-center" id="imgModal" tabindex="-1" role="dialog"
      aria-labelledby="myLargeModalLabel">
 
-    <div class="modal-dialog modal-lg" style="display: inline-block; width: 300px;">
-        <div class="modal-content">
-            <img id="imgInModalID"
-                 class="carousel-inner img-responsive img-rounded"
-                 onclick="closeImageViewer()"
-                 onmouseover="this.style.cursor='pointer';this.style.cursor='hand'"
-                 onmouseout="this.style.cursor='default'"
-
-            />
+    <div class="modal-dialog modal-lg" style="display: inline-block; max-width: 900px; max-height: 600px">
+        <div class="modal-content" style="background:  transparent">
+            <center>
+                <img id="imgInModalID"
+                     class="carousel-inner img-responsive "
+                     onclick="closeImageViewer()"
+                     onmouseover="this.style.cursor='pointer';this.style.cursor='hand'"
+                     onmouseout="this.style.cursor='default'"
+                     style="max-height: 90vh;
+                     max-width: 90vw;
+                     object-fit: contain;"
+                />
+            </center>
         </div>
     </div>
-
 </div>
 <script type="text/javascript">
     //显示大图

src/main/resources/templates/agg_report_new.html

@@ -78,7 +78,8 @@
                         <h3 class="box-title" th:text="${aggReportId}">
 
                         </h3>
-                        <button class="btn-xs btn-primary pull-right" id="create_bug" style="margin-left: 5px;" onclick="showCreateBlock()" th:if="${finalReportId == null}">创建缺陷报告
+                        <button  class="btn-xs btn-primary pull-right" id="create_bug" style="margin-left: 5px;display: none" onclick="showCreateBlock()" >
+                            创建缺陷报告
                         </button>
                         <button class="btn-xs btn-primary pull-right" id="review_confirm" th:unless="${reviewed}" onclick="reviewConfirm()">确认审核</button>
 
@@ -242,10 +243,10 @@
 
             </div>
 
-            <div class="col-md-4 pull-right">
+            <div class="col-md-4 pull-right" >
                 <div id="my_favorite_latin_words" class="box box-info" style="margin-bottom: 5px; min-height: 182px;"></div>
 
-                <div class="box box-danger source-table" id="new-report-create-block" style="display: none">
+                <div th:fragment="create_reports" class="box box-danger source-table" id="new-report-create-block" style="display: none">
                     <div class="box-header" style="border-bottom: 1px #f4f4f4 solid;">
                         <h3 class="box-title">
                             编辑报告
@@ -303,14 +304,14 @@
                 </div>
 
 
-                <div class="box box-info source-table" id="new-report-list-block">
+                <div class="box box-info source-table" id="new-report-list-block" >
                     <div class="box-header">
                         <h3 class="box-title">
                             已创建报告
 
                         </h3>
                     </div>
-                    <div id="new-created-reports" class="box-body"
+                    <div th:fragment="ul_reports" id="new-created-reports" class="box-body"
                          style="font-size: 12px; max-height: 340px; overflow: scroll;">
                         <div th:if="${finalReports.size() == 0}" style="font-size: 20px">
                             暂无 <a onclick="showCreateBlock()" style="cursor: pointer">立即创建报告</a>
@@ -323,8 +324,7 @@
                                     <div style="overflow: auto;">
                                         <span th:text="${finalReport.id}"></span>
                                         <span class="pull-right">
-
-                                            <a th:href="'report?masterId='+${finalReport.sourceId}+'&amp;examId='+${examId}+'&amp;caseId='+${caseId}+'&amp;finalReportId='+${finalReport.id}">编辑</a>
+                                            <a href="#" th:onclick="'editReport('+${finalReport.id}+')'" >编辑</a>
                                             <a href="#" th:onclick="'deleteReport('+ ${finalReport.id} +')'">删除</a>
                                         </span>
                                     </div>
@@ -407,7 +407,6 @@
             </center>
         </div>
     </div>
-
 </div>
 <script type="text/javascript">
     //显示大图
@@ -424,10 +423,11 @@
 <script src="https://d3js.org/d3.v4.min.js"></script>
 <script type="text/javascript" src="/static/js/agg_report_new.js"></script>
 <script type="text/javascript" src="/static/js/jqcloud-1.0.4.min.js"></script>
+<!--<script type="text/javascript" src="/static/js/partload.js"></script>-->
 <script type="text/javascript" xmlns:th="http://www.thymeleaf.org" th:inline="javascript">
     /*<![CDATA[*/
 
-    var word_list = /*[[${wordList}]]*/;
+    var word_list = /*[[${wordList}]]*/;  //源代码如此
     var urlParams = new URLSearchParams(window.location.search);
     var masterId = urlParams.get('masterId');
     var examId = urlParams.get('examId');
@@ -451,6 +451,9 @@
             /*]]>*/
             fillNewReportBlock(editReport);
         }
+        if(finalReportId == null){
+            $('#create_bug').css('display','block');
+        }
     });
 
     function createOrUpdateFinalReport() {
@@ -474,32 +477,71 @@
                 data: JSON.stringify(report),
                 contentType: "application/json",
                 success: function (data) {
+                    //修改成功的情况
+                    console.log("修改报告")
+                    loadPartReports();
+
                     /*<![CDATA[*/
-                    window.location.href='report?masterId='+masterId+'&examId='+examId+'&caseId='+caseId
-                    /*]]>*/                }
+                    // window.location.href='report?masterId='+masterId+'&examId='+examId+'&caseId='+caseId
+                    /*]]>*/
+                }
             });
         } else {
-
+            //  向服务器新建一个
             $.ajax({
                 type: "POST",
                 url: '/final_report',
                 data: JSON.stringify(report),
                 contentType: "application/json",
                 success: function (data) {
-                    location.reload()
+                    console.log("新建报告")
+                    // location.reload()
+                    loadPartReports();
                 }
             });
         }
     }
 
+    function showCreateButton() {
+        $("#create_bug").show()
+
+    }
+
+    function loadPartReports() {
+        console.log("局部刷新")
+        /*<![CDATA[*/
+        $('#new-created-reports').load("/created_reports?masterId="+ masterId +"&caseId="+ caseId +"&examId="+ examId );
+        //$('#new-report-create-block').load("/created_reports_form");
+        finalReportId = null
+
+        /*]]>*/
+        showCreateButton()
+        $("#new-report-create-block").hide()
+        $("#new-report-list-block").show()
+    }
+
+
+    // function  syncCreatedReports(){
+    //     syncCreatedReportsWithParams(masterId,examId,caseId);
+    // }
+
+
     function showCreateBlock() {
+        // console.log("show create block")
         $("#new-report-create-block").show()
+        // console.log("show create yse")
         $("#new-report-list-block").hide()
+        console.log("show create three")
+
     }
     function hideCreateBlock() {
         if (finalReportId){
-            /*<![CDATA[*/
-            window.location.href='report?masterId='+masterId+'&examId='+examId+'&caseId='+caseId
+  h          /*<![CDATA[*/
+            // window.location.href='report?masterId='+masterId+'&examId='+examId+'&caseId='+caseId
+            // loadPartReports()
+            $("#create_bug").show()
+            $("#bug-description").text("")
+            finalReportId = null
             /*]]>*/
         }
         $("#new-report-create-block").hide()
@@ -507,15 +549,20 @@
 
     }
 
+
+
     function fillNewReportBlock(editReport) {
-        console.log(editReport)
+        console.log(editReport);
+        console.log("开始填充报告页面。")
         $("#recurrent").val(editReport.recurrent);
         $("#severity").val(editReport.severity);
         $("#category").val(editReport.category);
         $("#bug-description").val(editReport.description);
         var $new_report_img = $("#new-report-img");
+        $new_report_img.empty()
+        images = [];
         /*<![CDATA[*/
-        for (var i=0;i<editReport.imgUrls.length;i++) {
+        for (var i=0;editReport.imgUrls!=null&&i<editReport.imgUrls.length;i++) {
             var src = editReport.imgUrls[i]
             images.push(src);
             var $img = $('<img />')
@@ -544,9 +591,26 @@
             success: function (result) {
                 // Do something with the result
                 alert("删除成功");
-                location.reload();
+                loadPartReports();
+            }
+        });
+    }
+
+    function editReport (finalId){
+        //填充编辑表单页面。
+        /*<![CDATA[*/
+        $.ajax({
+            url: '/editReportData?masterId='+masterId+'&finalReportId='+finalId,
+            type: 'GET',
+            success: function (result) {
+                console.log(result); //
+                finalReportId = finalId;
+                fillNewReportBlock(result)
+                showCreateBlock();
             }
         });
+        /*]]>*/
+
     }
 
     function reviewConfirm() {