enzoftware/libro_listado.html

## libro_listado.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <title>Plantilla Admin</title>

    <!-- Bootstrap core CSS -->
    <link href="/css/bootstrap.min.css" rel="stylesheet" />

    <!-- Custom styles for this template -->
    <link href="/css/dashboard.css" rel="stylesheet" />

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>

  <body>

    <nav class="navbar navbar-inverse navbar-fixed-top">
      <div th:replace="fragments/admin/menu_superior :: menu_superior"></div>
    </nav>

    <div class="container-fluid">
      <div class="row">
        <div th:replace="fragments/admin/menu_lateral :: menu_lateral"></div>

        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
          <h1 class="page-header">Listado de libros</h1>
              	<div th:if="${mensaje}" class="alert alert-success">
              	<p th:text="${mensaje}"></p>
    			</div>
    			<div th:if="${error}" class="alert alert-danger">
              	<p th:text="${error}"></p>
    			</div>
			<table class="table">
			<thead>
				<tr>
					<th>Titulo</th>
					<th>Autor</th>
					<th>Editorial</th>
					<th>Precio</th>
					<th>ISBN</th>
					<th>Sinopsis</th>
					<!--<th>Imagen</th>-->
					<th>Opciones</th>
				</tr>
			</thead>
			<tbody>
				<tr th:each="libro : ${libros}">
					<td th:text="${libro.titulo}"></td>

					<td >
						<ul >
							<li th:each="autores : ${libro.autores}">
								<p th:text="${autores.nombres}"></p>  <p th:text="${autores.apellidos}"></p>
							</li>
						</ul>

					</td>

					<td th:text="${libro.editorial.getNombre()}"></td>
					<td th:text="${libro.precio}"></td>
					<td th:text="${libro.isbn}"></td>
					<!--<td th:text="${libro.imagen}"></td>-->
					<td th:text="${libro.sinopsis}"></td>
					<td>
					<a th:href="@{'/admin/libro/eliminar/' + ${libro.id}}" class="btn btn-danger">eliminar</a>
					<a th:href="@{'/admin/libro/editar/' + ${libro.id}}" class="btn btn-primary">editar</a>
					</td>
				</tr>
			</tbody>
			</table>
        </div>
      </div>
    </div>

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src=js/jquery-3.2.1.min.js"><\/script>')</script>
    <script src="/js/bootstrap.min.js"></script>
  </body>
</html>
	<!DOCTYPE html>
	<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1" />

	<title>Plantilla Admin</title>

	<!-- Bootstrap core CSS -->
	<link href="/css/bootstrap.min.css" rel="stylesheet" />

	<!-- Custom styles for this template -->
	<link href="/css/dashboard.css" rel="stylesheet" />

	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->
	</head>

	<body>

	<nav class="navbar navbar-inverse navbar-fixed-top">
	<div th:replace="fragments/admin/menu_superior :: menu_superior"></div>
	</nav>

	<div class="container-fluid">
	<div class="row">
	<div th:replace="fragments/admin/menu_lateral :: menu_lateral"></div>

	<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
	<h1 class="page-header">Listado de libros</h1>
	<div th:if="${mensaje}" class="alert alert-success">
	<p th:text="${mensaje}"></p>
	</div>
	<div th:if="${error}" class="alert alert-danger">
	<p th:text="${error}"></p>
	</div>
	<table class="table">
	<thead>
	<tr>
	<th>Titulo</th>
	<th>Autor</th>
	<th>Editorial</th>
	<th>Precio</th>
	<th>ISBN</th>
	<th>Sinopsis</th>
	<!--<th>Imagen</th>-->
	<th>Opciones</th>
	</tr>
	</thead>
	<tbody>
	<tr th:each="libro : ${libros}">
	<td th:text="${libro.titulo}"></td>

	<td >
	<ul >
	<li th:each="autores : ${libro.autores}">
	<p th:text="${autores.nombres}"></p> <p th:text="${autores.apellidos}"></p>
	</li>
	</ul>

	</td>

	<td th:text="${libro.editorial.getNombre()}"></td>
	<td th:text="${libro.precio}"></td>
	<td th:text="${libro.isbn}"></td>
	<!--<td th:text="${libro.imagen}"></td>-->
	<td th:text="${libro.sinopsis}"></td>
	<td>
	<a th:href="@{'/admin/libro/eliminar/' + ${libro.id}}" class="btn btn-danger">eliminar</a>
	<a th:href="@{'/admin/libro/editar/' + ${libro.id}}" class="btn btn-primary">editar</a>
	</td>
	</tr>
	</tbody>
	</table>
	</div>
	</div>
	</div>

	<!-- Bootstrap core JavaScript
	================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<script>window.jQuery \|\| document.write('<script src=js/jquery-3.2.1.min.js"><\/script>')</script>
	<script src="/js/bootstrap.min.js"></script>
	</body>
	</html>