forked from orson/bachemap
110 lines
4.1 KiB
HTML
110 lines
4.1 KiB
HTML
{% extends 'secondbase.html' %}
|
|
{% block content %}
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.js"></script>
|
|
|
|
<style>
|
|
main {
|
|
overflow-y: scroll;
|
|
}
|
|
</style>
|
|
<div class="container-fluid" style="padding-top: 30px; max-width: 75vw; background-color: rgba(189, 216, 3, 0.9); padding: 3rem;">
|
|
<h3>Hola <span style="color: darkgreen;">{{current_user.username}}</span></h3>
|
|
<p>Aquí puedes ver los pines que has agregado y consultar tu enlace/QR de invitación. Cada vez que recargas esta página, tu enlace de invitacón cambia y el anterior se vuelve inválido.</p>
|
|
<div class="grid" style="padding-bottom: 2rem;">
|
|
<div id="qrgen" style="padding-left: 5rem;">
|
|
</div>
|
|
<script type="text/javascript">
|
|
var qrcode = new QRCode(document.getElementById("qrgen"), {
|
|
text: "https://baches.qro.mx/registrame/{{invite_code}}",
|
|
width: 256,
|
|
height: 256,
|
|
colorDark : "#000000",
|
|
colorLight : "#e6e6fa",
|
|
correctLevel : QRCode.CorrectLevel.L
|
|
});
|
|
</script>
|
|
<div>
|
|
<h2>Tu link es:</h2>
|
|
<p><a href="https://baches.qro.mx/registrame/{{invite_code}}">https://baches.qro.mx/registrame/{{invite_code}}</a></p>
|
|
</div>
|
|
</div>
|
|
{% if pins %}
|
|
{% for pin in pins %}
|
|
|
|
<table border="1" cellpadding="5" cellspacing="0">
|
|
<tbody>
|
|
<tr>
|
|
<td><b>Agregado el</b></td>
|
|
<td>{{ pin.time }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Tipo de Mejora Urbana:</b></td>
|
|
<td>{{ pin.typeofpin }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Descripción</b></td>
|
|
<td>{{ pin.description }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Dirección</b></td>
|
|
<td>{{ pin.address }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Foto</b></td>
|
|
<td><img style="max-height: 66px;" src="{{ pin.photo }}"></td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Latitud:</b></td>
|
|
<td>{{ pin.lat }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Longitud:</b></td>
|
|
<td>{{ pin.lng }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><b>Acciones:</b></td>
|
|
<td>
|
|
<a href="/remove_pin/{{pin._id}}"><button type="button">Eliminar</button></a>
|
|
<button type="button" onclick="openEditModal('{{pin._id}}')">Editar</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<!-- Modal para editar pin -->
|
|
<div id="editModal{{pin._id}}" class="modal" style="display:none; position:fixed; z-index:1000; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.4);">
|
|
<div class="modal-content" style="background-color:#fff; margin:10% auto; padding:20px; width:70%; border-radius:5px;">
|
|
<span class="close" onclick="closeEditModal('{{pin._id}}')" style="color:#aaa; float:right; font-size:28px; font-weight:bold; cursor:pointer;">×</span>
|
|
<h2>Editar Pin</h2>
|
|
<form action="/edit_pin/{{pin._id}}" method="post">
|
|
<div style="margin-bottom:15px;">
|
|
<label for="typeofpin{{pin._id}}"><b>Tipo de Mejora Urbana:</b></label>
|
|
<input type="text" id="typeofpin{{pin._id}}" name="typeofpin" value="{{pin.typeofpin}}" style="width:100%; padding:8px;">
|
|
</div>
|
|
<div style="margin-bottom:15px;">
|
|
<label for="description{{pin._id}}"><b>Descripción:</b></label>
|
|
<textarea id="description{{pin._id}}" name="description" style="width:100%; padding:8px; height:100px;">{{pin.description}}</textarea>
|
|
</div>
|
|
<div style="margin-bottom:15px;">
|
|
<label for="address{{pin._id}}"><b>Dirección:</b></label>
|
|
<input type="text" id="address{{pin._id}}" name="address" value="{{pin.address}}" style="width:100%; padding:8px;">
|
|
</div>
|
|
<button type="submit" style="background-color:#4CAF50; color:white; padding:10px 15px; border:none; cursor:pointer; border-radius:4px;">Guardar cambios</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
function openEditModal(id) {
|
|
document.getElementById('editModal'+id).style.display = 'block';
|
|
}
|
|
|
|
function closeEditModal(id) {
|
|
document.getElementById('editModal'+id).style.display = 'none';
|
|
}
|
|
</script></div>
|
|
|
|
{% endfor %}
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %} |