source: src/main/resources/templates/books.html

Last change on this file was ed20c2c, checked in by HumaSejdini <humasejdini12@…>, 2 years ago

Initial commit
  • Property mode set to 100644
File size: 8.6 KB
RevLine 
[ed20c2c]1<!DOCTYPE html>
2<html lang="en" xmlns:sec="http://www.w3.org/1999/xhtml">
3<head>
4 <meta charset="UTF-8">
5 <title>Books</title>
6 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
7 <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
8 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
9 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
10
11</head>
12<body>
13<header xmlns:th="http://www.thymeleaf.org">
14 <nav class="navbar navbar-expand-md navbar-dark bg-dark">
15 <div class="container">
16 <a class="navbar-brand" href="/">TheBookSpot</a>
17 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault"
18 aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
19 <span class="navbar-toggler-icon"></span>
20 </button>
21
22 <div class="collapse navbar-collapse justify-content-end" id="navbarsExampleDefault">
23 <ul class="navbar-nav m-auto">
24 <li class="nav-item m-auto">
25 <a class="nav-link active" href="/home">Home</a>
26 </li>
27 <li class="nav-item m-auto" sec:authorize="hasRole('ROLE_ADMIN')">
28 <a class="nav-link active" href="/books">Books</a>
29 </li>
30 <li class="nav-item m-auto" >
31 <a class="nav-link active" href="/members">View Memebers</a>
32 </li>
33 <li class="nav-item m-auto" >
34 <li class="nav-item m-auto" sec:authorize="hasRole('ROLE_ADMIN')">
35 <a class="nav-link active" href="/borrow">Borrowed books</a>
36 </li>
37 </ul>
38
39
40 <form th:action="@{/books}" method="get" class="form-inline my-2 my-lg-0">
41 <div class="input-group input-group-sm">
42 <input type="text" name="keyword" th:value="${keyword}" class="form-control" aria-label="Small"
43 aria-describedby="inputGroup-sizing-sm"
44 placeholder="Search...">
45 <div class="input-group-append">
46 <button type="button" class="btn btn-secondary btn-number">
47 <i class="fa fa-search"></i>
48 Search
49 </button>
50 </div>
51 </div>
52
53 </form>
54 <ul class="nav navbar-nav navbar-right">
55 <li style="color: white; padding-left: 5px;" class="nav-item" th:if="${session.user != null}"
56 th:text="${'Welcome, ' + session.user.getIme() + ' ' + ' ' + session.user.getPrezime()}">
57 <a class="nav-link" href="#">
58
59 </a>
60 </li>
61
62 <li class="nav-item" th:if="${session.user == null}">
63 <a class="btn btn-light btn-sm ml-3" href="/login">
64 <i class="fa fa-shopping-cart"></i> Login
65 </a>
66 </li>
67 <li class="nav-item">
68 <a class="btn btn-light btn-sm ml-3" href="/logout">
69 <i class="fa fa-shopping-cart"></i> Logout
70 </a>
71 </li>
72 </ul>
73 </div>
74 </div>
75 </nav>
76</header>
77
78<div th:block xmlns:th="http://www.thymeleaf.org">
79 <section class="jumbotron text-center">
80 <div class="container">
81 <h3 class="jumbotron-heading">Books that are in our library
82
83 </h3>
84 </div>
85 </section>
86 <!-- <th:block th:if="${session.user != null}" th:text="${session.user.getUsername()}"></th:block>-->
87
88 <div th:if="${hasError}">
89 <h5 class="text-center text-danger" th:text="${error}"></h5>
90 </div>
91
92 <div class="container mb-4">
93 <div class="row">
94 <div class="col-12" th:if="${knigii.size() > 0}">
95 <div class="table-responsive">
96 <table class="table table-striped">
97 <thead>
98 <tr>
99 <th scope="col">Book name</th>
100 <th scope="col">Author</th>
101 <th scope="col">Description</th>
102 <th scope="col">Category</th>
103 </tr>
104 </thead>
105 <tbody>
106 <tr th:each="kniga : ${knigii}" class="product">
107 <td th:text="${kniga.getNaslov()}"></td>
108 <td th:each="avtor:${ avtori }" th:if="${kniga.getAvtors().contains(avtor)}"
109 th:text="${avtor.getIme()}"></td>
110 <td th:text="${kniga.getOpis()}"></td>
111 <td th:each="kategorija:${ kategorii}" th:if="${kniga.getKategorijas().contains(kategorija)}"
112 th:text="${kategorija.getImeKategorija()}"></td>
113 <!-- <td class="text-right">-->
114 <!-- <th:block sec:authorize="hasRole('ROLE_ADMIN')">-->
115 <!-- <form th:action="@{'/books/delete/{id}' (id=${knigii.getId()})}"-->
116 <!-- th:method="DELETE">-->
117 <!-- <button type="submit"-->
118 <!-- class="btn btn-sm btn-danger delete-product">-->
119 <!-- <i class="fa fa-trash">Delete</i>-->
120 <!-- </button>-->
121 <!-- </form>-->
122 <!-- </th:block>-->
123 <!-- <th:block sec:authorize="hasRole('ROLE_ADMIN')">-->
124 <!-- <a th:href="@{'/books/edit-form/{id}' (id=${knigii.getId()})}"-->
125 <!-- class="btn btn-sm btn-info edit-product">-->
126 <!-- <i class="fa fa-trash">Edit</i>-->
127 <!-- </a>-->
128 <!-- </th:block>-->
129 <!-- <form th:action="@{'/shopping-cart/add-product/{id}' (id=${knigii.getId()})}"-->
130 <!-- th:method="POST"-->
131 <!-- sec:authorize="isAuthenticated()">-->
132 <!-- <button type="submit"-->
133 <!-- class="btn btn-sm btn-primary cart-product">-->
134 <!-- <i class="fa fa-trash">Add product to cart</i>-->
135 <!-- </button>-->
136 <!-- </form>-->
137 <!-- </td>-->
138 </tr>
139 </tbody>
140 </table>
141 </div>
142 </div>
143 <div class="col mb-3">
144 <div class="row">
145 <div class="col-sm-12 col-md-12">
146 <a href="/books/add" class="btn btn-block btn-dark add-product-btn">
147 Add new book
148 </a>
149 </div>
150 </div>
151 </div>
152 </div>
153 </div>
154
155</div>
156
157<footer class="text-black-50 mt-xl-5" xmlns:th="http://www.thymeleaf.org">
158 <div class="container">
159 <div class="row">
160 <div class="col-md-3 col-lg-4 col-xl-3">
161 <h5>About</h5>
162 <hr class="bg-white mb-2 mt-0 d-inline-block mx-auto w-25">
163 <p class="mb-0">
164 Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant
165 impression.
166 </p>
167 </div>
168
169 <div class="col-md-2 col-lg-2 col-xl-2 mx-auto">
170 <h5>Informations</h5>
171 <hr class="bg-white mb-2 mt-0 d-inline-block mx-auto w-25">
172 <ul class="list-unstyled">
173 <li><a href="">Link 1</a></li>
174 <li><a href="">Link 2</a></li>
175 <li><a href="">Link 3</a></li>
176 <li><a href="">Link 4</a></li>
177 </ul>
178 </div>
179
180 <div class="col-md-3 col-lg-2 col-xl-2 mx-auto">
181 <h5>Others links</h5>
182 <hr class="bg-white mb-2 mt-0 d-inline-block mx-auto w-25">
183 <ul class="list-unstyled">
184 <li><a href="">Link 1</a></li>
185 <li><a href="">Link 2</a></li>
186 <li><a href="">Link 3</a></li>
187 <li><a href="">Link 4</a></li>
188 </ul>
189 </div>
190
191 <div class="col-md-4 col-lg-3 col-xl-3">
192 <h5>Contact</h5>
193 <hr class="bg-white mb-2 mt-0 d-inline-block mx-auto w-25">
194 <ul class="list-unstyled">
195 <li><i class="fa fa-home mr-2"></i> My company</li>
196 <li><i class="fa fa-envelope mr-2"></i> email@example.com</li>
197 <li><i class="fa fa-phone mr-2"></i> + 33 12 14 15 16</li>
198 <li><i class="fa fa-print mr-2"></i> + 33 12 14 15 16</li>
199 </ul>
200 </div>
201 </div>
202 </div>
203</footer>
204</body>
205</html>
Note: See TracBrowser for help on using the repository browser.