filter

src/main/resources/public/js/papers.js

@@ -1,21 +1,23 @@
 var urlPapers = "/api/1.0/papers";
 var urlPaperStatuses = "/api/1.0/papers/statuses";
 var urlDeletePaper = "/api/1.0/papers/";
+var urlFilterPaper = "/api/1.0/papers/filter"
 
 function showPapers(papersElement, paperRowClass) {
     getFromRest(urlPapers, function (paperList) {
         paperList.forEach(function (paper, index) {
             $(papersElement).parent().append("<div class='row text-left paper-row'>" +
-                "                <div class='col'>" +
+                "                <div class='col-md-11'>" +
                 "                <span class='fa-stack fa-1x'>\n" +
                 "                  <i class='fa fa-circle fa-stack-2x " + getPaperStatusClass(paper.status) + "'></i>" +
                 "                  <i class='fa fa-file-text-o fa-stack-1x fa-inverse'></i>" +
                 "                </span>" +
                 "                    <a href='paper?id=" + paper.id + "" +
-                "'><span>" + (index + 1) + ". " + paper.title + "</span></a>" +
+                "'><span>" + paper.title + "</span></a></div>" +
-                "<span class='remove-paper d-none pull-right' onclick=\"deletePaper(" + paper.id + ",'" + papersElement + "', '" + paperRowClass + "')\">" +
+                "<div class='col-md-1'>" +
+                "<span class='remove-paper d-none' onclick=\"deletePaper(" + paper.id + ",'" + papersElement + "', '" + paperRowClass + "')\">" +
                 "<i class=\"fa fa-trash\" aria-hidden=\"true\"></i></span>" +
-                "</div></div>");
+                "                </div></div>");
         });
 
         $(paperRowClass).mouseenter(function (event) {
@@ -32,6 +34,47 @@ function showPapers(papersElement, paperRowClass) {
     });
 }
 
+function filterPapers(papersElement, paperRowClass, authorId, year) {
+	var paperData = JSON.stringify({
+        "authorId": authorId,
+        "year": year
+    });
+    postToRest(urlFilterPaper, paperData, function (data) {
+		$(paperRowClass).remove();
+		 if(data.length > 0){
+		 data.forEach(function (paper, index) {
+            $(papersElement).parent().append("<div class='row text-left paper-row'>" +
+                "                <div class='col-md-11'>" +
+                "                <span class='fa-stack fa-1x'>\n" +
+                "                  <i class='fa fa-circle fa-stack-2x " + getPaperStatusClass(paper.status) + "'></i>" +
+                "                  <i class='fa fa-file-text-o fa-stack-1x fa-inverse'></i>" +
+                "                </span>" +
+                "                    <a href='paper?id=" + paper.id + "" +
+                "'><span>" + paper.title + "</span></a></div>" +
+                "<div class='col-md-1'>" +
+                "<span class='remove-paper d-none' onclick=\"deletePaper(" + paper.id + ",'" + papersElement + "', '" + paperRowClass + "')\">" +
+                "<i class=\"fa fa-trash\" aria-hidden=\"true\"></i></span>" +
+                "                </div></div>");
+        });
+
+
+        $(paperRowClass).mouseenter(function (event) {
+            var paperRow = $(event.target).closest(paperRowClass);
+            $(paperRow).css("background-color", "#f8f9fa");
+            $(paperRow).find(".remove-paper").removeClass("d-none");
+
+        });
+        $(paperRowClass).mouseleave(function (event) {
+            var paperRow = $(event.target).closest(paperRowClass);
+            $(paperRow).css("background-color", "white");
+            $(paperRow).closest(paperRowClass).find(".remove-paper").addClass("d-none");
+        });
+		 }
+    });
+
+
+}
+
 function deletePaper(id, papersElement, paperRowClass) {
     $("#remove-paper-modal").modal('show');
 
@@ -61,52 +104,17 @@ function addPaper(title, status, comment, locked) {
     });
 }
 
-function filterPaper(authorId, year) {
-    var paperData = JSON.stringify({
-        "authors": title,
-        "": status
-    });
-    postToRest(urlPapers, paperData, function (data) {
-        alert(data);
-    });
-}
-
 function getPaperStatusClass(status) {
     switch (status) {
         case 'DRAFT':
             return "text-draft"
         case 'ON_PREPARATION':
             return "text-primary";
-        case 'ON_REVIEW':
-            return "text-primary";
         case 'COMPLETED':
             return "text-success";
         case 'ATTENTION':
             return "text-warning";
-        case 'FAILED':
-            return "text-failed";
         default:
             return "";
     }
 }
-
-function showPaperDashboard(dashboardElement) {
-    getFromRest(urlPapers, function (paperList) {
-        paperList.forEach(function (paper, index) {
-            $(dashboardElement).append("<div class=\"col-12 col-sm-12 col-md-12 col-lg-4 col-xl-3 dashboard-card\">" +
-                "<div class=\"row\">" +
-                "<div class=\"col-2\">" +
-                "<span class=\"fa-stack fa-1x\">" +
-                "<i class=\"fa fa-circle fa-stack-2x " + getPaperStatusClass(paper.status) + "\"></i>" +
-                "<i class=\"fa fa-file-text-o fa-stack-1x fa-inverse\"></i>" +
-                "</span>" +
-                "</div>" +
-                "<div class=\"col col-10 text-right\">" +
-                "<h7 class=\"service-heading\">" + paper.title + "</h7>" +
-                "<p class=\"text-muted\">" + paper.authorsString + "</p>" +
-                "</div>" +
-                "</div>" +
-                "</div>");
-        });
-    });
-}

src/main/resources/templates/papers/papers.html

@@ -14,39 +14,36 @@
                     <h2 class="section-heading text-uppercase">Статьи</h2>
 
                     <div class="row justify-content-center">
-                        <div class="col-12 col-sm-12 col-md-12 col-lg-4 col-xl-3">
-                            <a href="./papers" class="btn btn-light toolbar-button"><i class="fa fa-list-alt"></i>
-                                Список</a>
-                        </div>
                         <div class="col-12 col-sm-12 col-md-12 col-lg-4 col-xl-3">
                             <a href="./dashboard" class="btn btn-light toolbar-button"><i class="fa fa-newspaper-o"
-                                                                           aria-hidden="true"></i> Панель управления</a>
+                                                                                          aria-hidden="true"></i> Панель управления</a>
                         </div>
-
                         <div class="col-12 col-sm-12 col-md-12 col-lg-4 col-xl-3">
                             <a href="./paper" class="btn btn-light toolbar-button"><i class="fa fa-plus-circle" aria-hidden="true"></i>
                                 Добавить статью</a>
+
                         </div>
-                        <div class = "filter">
+
-                            <h4>Фильтровать по:</h4>
-                            <select id = "author">
-                                <option>Алёна</option>
-                                <option>Маша</option>
-                                <option>Петя</option>
-                            </select>
-                            <select id = "index score">
-                                <option>РИНЦ</option>
-                                <option>Scopus</option>
-                                <option>Web of science</option>
-                            </select>
-                            <select id = "year">
-                                <option>2018</option>
-                                <option>2017</option>
-                                <option>2016</option>
-                            </select>
-                        </div>
                     </div>
-                </div>1
+                    <div class = "filter">
+                        <h5>Фильтровать по:</h5>
+                        <select id = "author">
+                            <option value = "1">Алёна</option>
+                            <option value = "2">Маша</option>
+                            <option value = "3">Петя</option>
+                        </select>
+                        <select id = "index score">
+                            <option >РИНЦ</option>
+                            <option>Scopus</option>
+                            <option>Web of science</option>
+                        </select>
+                        <select id = "year">
+                            <option>2018</option>
+                            <option>2017</option>
+                            <option>2016</option>
+                        </select>
+                    </div>
+                </div>
             </div>
         </div>
     </section>
@@ -65,12 +62,21 @@
             </div>
         </div>
     </div>
-    <script src="/js/papers.js"></script>
+
+    <script>jQuery('.filter').on('change','#year',function(){
+
+      filterPapers("#paper-list", ".paper-row",'1','2018');
+});
+</script>
+
+
+    <script src="papers.js"></script>
     <script>
         $(document).ready(function () {
             showPapers("#paper-list", ".paper-row");
         });
     </script>
+
 </div>
 </body>