christoph/lecture-professional-software-development
1
Fork 0
Code Activity

search page refactor

Browse Source
This commit is contained in:
Christoph
2020-04-11 01:02:02 +02:00
parent 072ac32338
commit bda952a308
6 changed files with 65 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/main/java/mops/gruppen2/controller/SearchAndInviteController.java
View File

@ -57,7 +57,7 @@ public class SearchAndInviteController {
User user = new User(token); User user = new User(token);
List<Group> groups = searchService.searchPublicGroups(search, user); List<Group> groups = searchService.searchPublicGroups(search, user);
model.addAttribute("gruppen", groups); model.addAttribute("groups", groups);
return "search"; return "search";
} }

8
src/main/resources/data-h2.sql
View File

@ -1,16 +1,16 @@
INSERT INTO event INSERT INTO event
VALUES (1, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '07FEA694', 'CreateGroupEvent', VALUES (1, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '07FEA694', 'CreateGroupEvent',
'{"type":"CreateGroupEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"07FEA694","groupParent":null,"groupType":"PUBLIC"}'), '{"type":"CreateGroupEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"07FEA694","groupParent":null,"groupType":"PUBLIC"}'),
(2, '2d90ae27-1129-4b61-84a5-6c7d585e777e', 'orga', 'AddUserEvent', (2, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '2', 'AddUserEvent',
'{"type":"AddUserEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"orga","givenname":"Marcos","familyname":"Glover","email":"Marcos.Glover@mail.de"}'), '{"type":"AddUserEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"2","givenname":"Marcos","familyname":"Glover","email":"Marcos.Glover@mail.de"}'),
(3, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '2', 'UpdateUserLimitEvent', (3, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '2', 'UpdateUserLimitEvent',
'{"type":"UpdateUserLimitEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"2","userLimit":"1000"}'), '{"type":"UpdateUserLimitEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"2","userLimit":"1000"}'),
(4, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '5CFBF1AF', 'UpdateGroupTitleEvent', (4, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '5CFBF1AF', 'UpdateGroupTitleEvent',
'{"type":"UpdateGroupTitleEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"5CFBF1AF","newGroupTitle":"Zyra"}'), '{"type":"UpdateGroupTitleEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"5CFBF1AF","newGroupTitle":"Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra"}'),
(5, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '41E11CBC', 'UpdateGroupDescriptionEvent', (5, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '41E11CBC', 'UpdateGroupDescriptionEvent',
'{"type":"UpdateGroupDescriptionEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"41E11CBC","newGroupDescription":"Have you seen my Bear Tibbers?"}'), '{"type":"UpdateGroupDescriptionEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"41E11CBC","newGroupDescription":"Have you seen my Bear Tibbers? Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyrav"}'),
(6, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '3', 'AddUserEvent', (6, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '3', 'AddUserEvent',
'{"type":"AddUserEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"3","givenname":"Antwan","familyname":"Smitham","email":"Antwan.Smitham@mail.de"}'), '{"type":"AddUserEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"3","givenname":"Antwan","familyname":"Smitham","email":"Antwan.Smitham@mail.de"}'),
(7, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '4', 'AddUserEvent', (7, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '4', 'AddUserEvent',

9
src/main/resources/static/index.css
View File

@ -29,3 +29,12 @@
margin-right: 0; margin-right: 0;
box-shadow: inset 0 .125rem .25rem rgba(0, 0, 0, .25); box-shadow: inset 0 .125rem .25rem rgba(0, 0, 0, .25);
} }
.float-right {
margin-right: 10px;
margin-left: 10px;
}
.content:hover .float-right {
margin-right: 0;
}

20
src/main/resources/static/search.css Normal file
View File

@ -0,0 +1,20 @@
.top {
padding: 10px 10px !important;
margin-bottom: 15px !important;
}
/*Grouplist Hover Effect*/
.content {
margin-top: 5px;
padding: 5px 5px;
}
.content-heading {
margin-bottom: 5px;
transition: 100ms;
}
.content-text-in {
margin-bottom: 0;
padding: 5px;
}

6
src/main/resources/static/style.css
View File

@ -82,16 +82,10 @@
/*Positioning*/ /*Positioning*/
.float-right { .float-right {
margin-right: 10px;
margin-left: 10px;
float: right; float: right;
transition: 100ms; transition: 100ms;
} }
.content:hover .float-right {
margin-right: 0;
}
/*Miscellanous*/ /*Miscellanous*/
.def-cursor { .def-cursor {
cursor: default; cursor: default;

100
src/main/resources/templates/search.html
View File

@ -1,80 +1,42 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" <html lang="de" xmlns:th="http://www.thymeleaf.org" th:replace="~{mopslayout :: html(
th:replace="~{mopslayout :: html(name='Gruppenbildung', headcontent=~{:: headcontent}, navigation=~{:: navigation}, bodycontent=~{:: bodycontent})}"> name='Gruppenbildung',
<head> headcontent=~{fragments/general :: headcontent(style='/search.css')},
<meta charset="utf-8"> navigation=~{fragments/general :: nav(current='search')},
<title>Suche</title> bodycontent=~{:: bodycontent})}">
<th:block th:fragment="headcontent">
<!-- Links, Skripts, Styles hier einfügen! -->
</th:block>
</head>
<body> <body>
<header>
<nav class="navigation navigation-secondary" is="mops-navigation" th:fragment="navigation">
<ul>
<li>
<a th:href="@{/gruppen2}">Gruppen</a>
</li>
<li>
<a th:href="@{/gruppen2/create}">Erstellen</a>
</li>
<li class="active">
<a th:href="@{/gruppen2/search}">Suche</a>
</li>
</ul>
</nav>
</header>
<main th:fragment="bodycontent"> <main th:fragment="bodycontent">
<div class="container-fluid"> <div class="container-fluid">
<div class="row">
<div class="col-10"> <h1>Suche</h1>
<h1>Gruppensuche</h1>
<div class="shadow-sm p-2" <div class="content top">
style="border: 10px solid aliceblue; border-radius: 5px; background: aliceblue;"> <form method="post" th:action="@{/gruppen2/search}">
<form method="post" th:action="@{/gruppen2/search}"> <div class="input-group mb-3">
<div class="form-group"> <div class="input-group-prepend">
<label for="suchleiste">Suchbegriff:</label> <span class="input-group-text text-monospace">Suchbegriff:</span>
<input class="form-control" id="suchleiste" </div>
placeholder="z.B. Programmieren, Lerngruppe, ..." <input class="form-control" th:name="string" type="text">
th:name="string" type="text">
</div>
<button class="btn btn-primary" style="background: #52a1eb; border-style: none;" type="submit">
Suchen
</button>
</form>
</div> </div>
<br> <button class="btn btn-primary" type="submit">Suchen</button>
<table class="table" th:if='${!gruppen.isEmpty()}'> </form>
<!-- Erscheint dann, wenn man "Suchen" Button klickt und Ergebnisse angezeigt werden, aber so solls aussehen --> </div>
<thead>
<tr> <div class="content" th:each="group: ${groups}">
<th scope="col">Gruppenname</th> <div class="content-heading">
<th scope="col">Beschreibung</th> <a class="link" th:href="@{/gruppen2/details/{id}(id=${group.getId()})}"
<th scope="col">Max. Mitgliederanzahl</th> th:text="${group.getTitle()}"></a>
</tr> </div>
</thead> <div class="content-text-in">
<tbody> <span th:text="${group.getDescription()}"></span>
<tr th:each="gruppe : ${gruppen}" th:switch="${gruppe.getUserLimit() != 100000}">
<th scope="row">
<span class="badge badge-pill badge-success"
style="background: lightseagreen; margin-right: 25px;"
th:if='${gruppe.getType() == lecture}'>Veranstaltung</span>
<a th:href="@{/gruppen2/details/{id}(id=${gruppe.getId()})}"
th:text="${#strings.abbreviate(gruppe.getTitle(), 50)}">Gruppenname</a>
</th>
<td style="" th:text="${#strings.abbreviate(gruppe.getDescription(), 50)}">
Beschreibung
</td>
<td th:case="${true}">
<a th:text="${gruppe.getUserLimit()}"></a>
</td>
<td th:case="${false}">unbegrenzt</td>
</tr>
</tbody>
</table>
</div> </div>
</div> </div>
</div> </div>
</main> </main>
</body> </body>
</html> </html>