crowd-test-service
/
moooc_review


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511
							<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorator="main">
<head>
    <link rel="stylesheet" type="text/css" href="/static/css/main.css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/agg_report.css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/word_cloud.css"/>
</head>
<body>
<th:block layout:fragment="sidebar">

    <li>
        <a th:href="'/final_reports?examId=' + ${examId} + '&amp;caseId=' + ${caseId}">
            <i class="fa fa-calendar-check-o"></i>
            <span>预交付报告</span>
        </a>
    </li>
    <li class="treeview">
        <a href="#">
            <i class="fa fa-list"></i>
            <span>Reports</span>
            <span class="pull-right-container">
			<i class="fa fa-angle-left pull-right"></i>
		</span>
        </a>
        <ul class="treeview-menu" style="display: block;">
            <li>
                <a th:href="'/task_detail?examId='+${examId}+'&amp;caseId='+${caseId}">
                    <i class="fa fa-sticky-note text-success"></i>
                    <span>默认视图</span>
                </a>
            </li>
            <li>
                <a th:href="'/agg_report_list?examId='+${examId}+'&amp;caseId='+${caseId}">
                    <i class="fa fa-sitemap text-warning"></i>
                    <span>聚合视图</span>
                </a>
            </li>


        </ul>
    </li>
</th:block>
<th:block layout:fragment="maincontent">

    <section class="content-header">
        <h1>融合报告详情
            <small th:text="${aggReportId}"></small>
        </h1>
        <!-- <h1>Summary for report 0-5</h1> -->
        <!-- <small style="font-style: italic;">at 50% report-level and 25% supplementary level</small> -->

        <ol class="breadcrumb">
            <!-- style="margin-right: 173px;" -->
            <li>
                <a href="/home">
                    <i class="fa fa-dashboard"></i>
                    全部任务
                </a>
            </li>
            <li>
                <a th:href="'/agg_report_list?examId='+${examId}+'&amp;caseId='+${caseId}">
                    审核列表
                </a>
            </li>
            <li class="active" th:text="${aggReportId}">

            </li>
        </ol>
    </section>
    <section class="content container-fluid">
        <div style="overflow: auto;" class="row">
            <div class="col-md-8" id="summary">
                <div class="box box-info detail-table">
                    <div class="box-header with-border" style="padding: 4px;">
                        <i class="fa fa-object-group" style="color: #00c0ef;"></i>
                        <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>
                        <button class="btn-xs btn-primary pull-right" id="review_confirm" th:unless="${reviewed}" onclick="reviewConfirm()">确认审核</button>

                        <span th:if="${reviewed}" class="pull-right label label-success">
                            <span class="glyphicon glyphicon-ok"></span>
                            已审核
                        </span>
                    </div>
                    <table class="table table-reponsive">
                        <tbody>
                        <tr>
                            <td class="attr-title">创建时间&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
                            <td class="dup-create-time">2017-12-01 ~ 2017-12-05</td>
                            <td class="attr-title">Bug 严重性</td>
                            <td class="dup-severity">一般 ~ 严重
                            </td>
                        </tr>
                        <tr>
                            <td class="attr-title">Bug分类&nbsp;&nbsp;&nbsp;&nbsp;</td>
                            <td class="dup-category" colspan="3">

                                <!--<i class="fa fa-square" style="color: {{ category.category_color  }};"></i>-->
                                <span style="margin-right: 10px;" th:if="${categories == null}">暂无</span>
                                <span style="margin-right: 10px;" th:if="${categories != null}" th:each="ca : ${categories}" th:text="${ca}"></span>

                            </td>
                        </tr>
                        <tr>
                            <td class="attr-title">审核人</td>
                            <td class="dup-assignee" colspan="3">

                                <a href="#" style="margin-right: 5px;">
                                    <i class="fa fa-vcard"></i>
                                    admin
                                </a>


                            </td>
                        </tr><!-- Attribute -->

                        <!-- Start Content -->
                        <tr>
                            <td class="attr-title">主要点<span class="glyphicon glyphicon-star"
                                                            style="margin-left: 5px;"></span></td>
                            <td class="dup-master" colspan="3">
                                <span th:text="${masterReport.getDescription()}"></span><br/>
                                <img class="my-img-thumbnail pointer to-add" th:src="${imgUrl}"
                                     th:each="imgUrl,iterStat : ${masterReport.getImgUrls()}"
                                     th:onclick="'javascript:showimage(\''+${imgUrl}+'\');'"/>

                            </td>
                        </tr>
                        <tr>
                            <td class="attr-title">补充点</td>
                            <td class="dup-supplementary" colspan="3">
                                <ul id="sup-list" class="list-group"
                                    style="max-height: 450px; margin-bottom: 0px; overflow: scroll;">

                                    <li class="list-group-item" style="padding: 3px 3px;"
                                        th:each="supplement, iterStat : ${supplements}">

                                        <p style="border-bottom: 1px solid #ddd; margin: 0 0 1px;">
                                            <b><a href="#" th:text="'Supplementary ' + ${iterStat.count}"> </a></b>
                                            <a th:href="'#sup-' + ${iterStat.count}"
                                               class="glyphicon glyphicon-menu-hamburger pull-right sup-collapse"
                                               data-toggle="collapse" style="color: #000;"></a>
                                        </p>
                                        <div class="sup-title">
                                            <!-- 如果有文字，则仅显示top 1的diff_sentence，并且不展示图片 -->

                                            <span th:if="${supplement.hasTxt}"
                                                  th:text="'...' + ${supplement.topTxt} + '...'"></span>

                                            <img th:if="${!supplement.hasTxt}" class="my-img-thumbnail pointer to-add"
                                                 th:src="${imgUrl}" th:each="imgUrl,iterStat : ${supplement.top3Img}"
                                                 th:onclick="'javascript:showimage(\''+${imgUrl}+'\');'"/>


                                        </div>
                                        <div th:id="'sup-' + ${iterStat.count}" class="collapse">
                                            <ul class="list-group" style="margin-bottom: 0px;">
                                                <li class="list-group-item" style="padding: 3px 3px;"
                                                    th:each="report : ${supplement.bugs}">
                                                <span class="glyphicon glyphicon-file"
                                                      style="color: #3c8dbc; margin-right: 5px;"></span>
                                                    <a href="#" style="margin-right: 5px;" th:text="${report.id}"></a>

                                                    <!-- description -->

                                                    <th:block th:each="sent, iterStat : ${report.taggedSentences}">


                                                        <span th:if="${sent.isDiff()}" th:text="${sent.sentence}"
                                                              style="color: red; font-weight: bold;"></span>
                                                        <span th:unless="${sent.isDiff()}"
                                                              th:text="${sent.sentence}"></span>
                                                    </th:block>

                                                    <br/>

                                                    <!-- imgs -->
                                                    <th:block th:each="img, iterStat : ${report.taggedImgs}">

                                                        <img class="my-img-thumbnail pointer to-add"
                                                             th:style="${img.isDiff()? 'border: 2px solid red;' : ''}"
                                                             th:src="${img.imgUrl}"
                                                             th:onclick="'javascript:showimage(\''+${img.imgUrl}+'\');'"/>

                                                    </th:block>
                                                </li>
                                            </ul>
                                        </div>
                                    </li>


                                </ul>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>

            </div>

            <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 class="box-header" style="border-bottom: 1px #f4f4f4 solid;">
                        <h3 class="box-title">
                            编辑报告
                        </h3>
                        <button class="btn-xs btn-primary pull-right" style="margin-left: 5px"
                                onclick="createOrUpdateFinalReport()">保存
                        </button>
                        <button class="btn-xs btn-primary pull-right" onclick="hideCreateBlock()">取消</button>
                    </div>
                    <div id="new-report" class="box-body"
                         style="font-size: 12px; max-height: 340px; overflow: scroll;">
                        <form role="form">

                            <!-- select -->
                            <div class="form-group">
                                <label>Bug 复现程度</label>
                                <select id="recurrent" name="recurrent" class="form-control">
                                    <option th:each="mapItem : ${recurrent2String}"
                                            th:value="${mapItem.key}" th:text="${mapItem.value}">必现</option>

                                </select>
                            </div>
                            <!-- select -->
                            <div class="form-group">
                                <label>Bug 严重性</label>
                                <select id="severity" name="severity" class="form-control">
                                    <option th:each="mapItem : ${severity2String}"
                                            th:value="${mapItem.key}" th:text="${mapItem.value}">必现</option>
                                </select>
                            </div>

                            <!-- select -->
                            <div class="form-group">
                                <label>Bug 分类</label>
                                <select id="category" class="form-control">
                                    <option th:each="mapItem : ${category2String}"
                                            th:value="${mapItem.key}" th:text="${mapItem.value}">必现</option>
                                </select>
                            </div>

                            <!-- textarea -->
                            <div class="form-group">
                                <label>Bug 描述</label>
                                <textarea id="bug-description" name="description" class="form-control" rows="3"
                                          placeholder="Enter ..."></textarea>
                            </div>
                            <div class="form-group">
                                <label>Bug 截图</label>
                                <div id="new-report-img"></div>
                            </div>

                        </form>

                    </div>
                </div>


                <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"
                         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>
                        </div>
                        <ul class="list-group">

                            <!-- other reports -->
                            <th:block th:each="finalReport : ${finalReports}">
                                <li class="list-group-item">
                                    <div style="overflow: auto;">
                                        <a href="#" th:text="${finalReport.id}"></a>
                                        <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="'deleteReport('+ ${finalReport.id} +')'">删除</a>
                                        </span>
                                    </div>

                                    <div>
                                        <span>
                                            复现程度：<span th:text="${recurrent2String.get(finalReport.recurrent)}"></span>
                                        </span>
                                        <span class="pull-right">
                                            分类：<span th:text="${category2String.get(finalReport.category)}"></span>
                                        </span>
                                    </div>
                                    <div>
                                        严重程度：<span th:text="${severity2String.get(finalReport.severity)}"></span>
                                    </div>
                                    <br/>
                                    <span th:text="${finalReport.description}"></span>
                                    <br/>
                                    <img class="my-img-thumbnail pointer to-add" th:src="${imgUrl}"
                                         th:each="imgUrl,iterStat : ${finalReport.getImgUrls()}"
                                         th:onclick="'javascript:showimage(\''+${imgUrl}+'\');'"/>
                                </li>

                            </th:block>

                        </ul>
                    </div>
                </div>

            </div>
        </div>

        <div style="overflow: auto;" class="row">
            <div class="col-md-8">

                <div class="box box-info pull-left svg-div"
                     style="background-image: url('static/images/link/dark_opt.jpg'); background-size: cover;">
                    <h4 style="color: #fff; padding-left: 10px;" class="pull-left">聚合图</h4>
                    <svg width="660" height="450" style="margin-top: -40px;"></svg>
                </div>
            </div>
            <div class="col-md-4">

                <div class="detail-div"
                     style="height: 459px; max-height: 459px; font-size: 10px; overflow: scroll;">

                </div>
            </div>
        </div>
    </section>
</th:block>


</body>
</html>


<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>
    </div>

</div>
<script type="text/javascript">
    //显示大图
    function showimage(source) {
        $("#imgModal").find("#imgInModalID").attr("src", source);
        $("#imgModal").modal();
    }

    //关闭
    function closeImageViewer() {
        $("#imgModal").modal('hide');
    }
</script>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script type="text/javascript" src="/static/js/agg_report.js"></script>
<script type="text/javascript" src="/static/js/jqcloud-1.0.4.min.js"></script>
<script type="text/javascript" xmlns:th="http://www.thymeleaf.org" th:inline="javascript">
    /*<![CDATA[*/

    var word_list = /*[[${wordList}]]*/;
    var urlParams = new URLSearchParams(window.location.search);
    var masterId = urlParams.get('masterId');
    var examId = urlParams.get('examId');
    var caseId = urlParams.get('caseId');
    var finalReportId = urlParams.get('finalReportId');
    /*]]>*/
    word_list = JSON.parse(word_list)
    var images = [];
    $(function () {
        $("#my_favorite_latin_words").jQCloud(word_list,
            {
                shape: "rectangular",
                autoResize: true
            });
        var urlParams = new URLSearchParams(window.location.search);
        if (urlParams.get("finalReportId")) {
            showCreateBlock()
            /*<![CDATA[*/
            var editReport = /*[[${editReport}]]*/;
            /*]]>*/
            fillNewReportBlock(editReport);
        }
    });

    function createOrUpdateFinalReport() {

        var report = {
            'description': $("#bug-description").val(),
            'severity': $("#severity").val(),
            'recurrent': $("#recurrent").val(),
            'category': $("#category").val(),
            'sourceId': masterId,
            'reviewerId': 1,
            'examId': examId,
            'caseId': caseId,
            'imgUrls': images
        }
        if (finalReportId) {
            report.id = finalReportId
            $.ajax({
                type: "PUT",
                url: '/final_report/'+finalReportId,
                data: JSON.stringify(report),
                contentType: "application/json",
                success: function (data) {
                    /*<![CDATA[*/
                    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()
                }
            });
        }
    }

    function showCreateBlock() {
        $("#new-report-create-block").show()
        $("#new-report-list-block").hide()
    }
    function hideCreateBlock() {
        if (finalReportId){
            /*<![CDATA[*/
            window.location.href='report?masterId='+masterId+'&examId='+examId+'&caseId='+caseId
            /*]]>*/
        }
        $("#new-report-create-block").hide()
        $("#new-report-list-block").show()

    }

    function fillNewReportBlock(editReport) {
        console.log(editReport)
        $("#recurrent").val(editReport.recurrent);
        $("#severity").val(editReport.severity);
        $("#category").val(editReport.category);
        $("#bug-description").val(editReport.description);
        var $new_report_img = $("#new-report-img");
        /*<![CDATA[*/
        for (var i=0;i<editReport.imgUrls.length;i++) {
            var src = editReport.imgUrls[i]
            var $img = $('<img />')
            $img.attr("src", src);
            $img.attr("class", "my-img-thumbnail pointer to-delete");
            $img.on("click", function (){
                showimage(src);
            });
            $img.on("dragend", function (e) {
                var src = $(e.target).attr("src");
                var idx = images.indexOf(src);
                if (idx >= 0) {
                    images.splice(idx, 1);
                }

                $(e.target).remove();
            });
            $new_report_img.append($img)
        }
        /*]]>*/
        $("#new-report-img").val(editReport.description);
    }
    function deleteReport(finalReportId) {
        $.ajax({
            url: '/final_report/' + finalReportId,
            type: 'DELETE',
            success: function (result) {
                // Do something with the result
                alert("删除成功");
                location.reload();
            }
        });
    }

    function reviewConfirm() {
        $.ajax({
            url: '/bug_review?masterId='+masterId,
            type: 'PUT',
            success: function (result) {
                alert("确认审核成功，修改报告状态为已审核");
                location.reload();
            }
        });
    }
</script>