<%- include('partials/head.ejs') %>
<%- include('partials/navbar.ejs') %>

<main class="container">
    <!-- Titulo -->
    <h1 class="header center white-text">Historia de usuario: <%= idHistoria %> </h1>
    <% for (let detalle of lista_historias) { %>
    <h6 class="header center white-text">Proyecto: <%= detalle.idProyecto %> </h6>
    
    <div style="backdrop-filter: blur(10px) contrast(70%); padding:20px; border-radius: 20px; margin-bottom: 6%;">
        <!-- BotÃ³n para crear un nuevo proyecto-->
        <div class="row center">
         
     </div>
     <% } %>       
     <!-- Detalles Caso de Uso-->
    <div class="container highlight proyectContent">
        <div style="margin-bottom: 0px;">
             
            <div class="white-text col md-12 sm-12 lg-9">
                
                <table class="responsive-table">
                    <h6 class="header center white-text">Detalles del caso de uso: <%= idHistoria %> </h6>
                    <tr>
                    <td>AP</td>
                    <td>yo_como</td>
                    <td>quiero</td>
                    <td>para</td>
                    <td>comentario</td>
                    </tr>
                    <tr> 
                        <% for (let detalle of lista_historias) { %>
                            
                            <td><%= detalle.AP %> </td>
                            <td><%= detalle.yo_como %></td>
                            <td><%= detalle.quiero %> </td>
                            <td><%= detalle.para %></td>
                            <td><%= detalle.comentario %></td>

                        <% } %>          
                    </tr>      
                </table>    
    <div class="center">
        <br><br>
        <% for (let caso of lista_historias) { %>
            <a href="/casodeuso/modificar-casodeuso/<%= caso.idHistoria %>" class="waves-effect waves-light yellow darken-4 btn-large"><i class="material-icons left">edit</i>Editar</a>
            <a href="/reporte/elegir-tareas/<%= caso.idProyecto %>/<%= caso.idHistoria %>" class="waves-effect waves-light pink darken-4 btn-large"><i class="material-icons left">assessment</i>Elegir tareas</a>
            <br><br>
            <a href="/proyectos/casodeuso/<%= caso.idProyecto %>" class="waves-effect waves-light red btn" style="width:14rem;"><i class="material-icons left">undo</i>Regresar</a>
            <br><br> 
            <a href="/proyectos" class="waves-effect waves-light red darken-4 btn"><i class="material-icons left">delete</i>Borrar</a>
            <% } %>   
    </div>
      









</main>

<%- include('partials/footer.ejs') %>