Input event modal and create some supporting infra
update form to split date/time as well
This commit is contained in:
Cara Salter
parent
3a41dc6559
commit
e28912b997
5 changed files with 139 additions and 9 deletions
|
|
@ -16,7 +16,9 @@ def list_events():
|
|||
|
||||
events = Event.query.all()
|
||||
|
||||
return render_template("events/list.html", events=events)
|
||||
form = forms.EventForm()
|
||||
|
||||
return render_template("events/list.html", events=events, form=form)
|
||||
|
||||
@bp.route("/events/events.json")
|
||||
@login_required
|
||||
|
|
|
|||
|
|
@ -1,12 +1,14 @@
|
|||
from flask_wtf import FlaskForm
|
||||
from wtforms import StringField, DateTimeField, SubmitField, TextAreaField
|
||||
from wtforms import StringField, DateField, TimeField, SubmitField, TextAreaField
|
||||
from wtforms.validators import DataRequired
|
||||
|
||||
class EventForm(FlaskForm):
|
||||
name = StringField("Name", validators=[DataRequired()])
|
||||
description = TextAreaField("Description")
|
||||
location = StringField("Location", validators=[DataRequired()])
|
||||
start_time = DateTimeField("Start Time", validators=[DataRequired()])
|
||||
end_time = DateTimeField("End Time", validators=[DataRequired()])
|
||||
start_day = DateField("Start Day", validators=[DataRequired()])
|
||||
start_time = TimeField("Start Time", validators=[DataRequired()])
|
||||
end_day = DateField("End Day", validators=[DataRequired()])
|
||||
end_time = TimeField("End Time", validators=[DataRequired()])
|
||||
category = StringField("Category")
|
||||
submit = SubmitField("Submit")
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
<th>Category</th>
|
||||
<th>Checked in</th>
|
||||
<th>QR Code</th>
|
||||
<th><a href="{{url_for('admin.new_event')}}">New</a></th>
|
||||
<th><a href="#editModal" data-bs-toggle="modal" data-id="0">New</a></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
|
@ -34,11 +34,137 @@
|
|||
<td>{{ event.get_checkins()|length }}</td>
|
||||
<td><a href='{{ url_for("admin.qrcode_event", id=event.id)
|
||||
}}'>QR Code</a></td>
|
||||
<td><a href="{{url_for('admin.edit_event', id=event.id)}}">Edit</a></td>
|
||||
<td><a href="#editModal" data-bs-toggle="modal" data-id="{{ e.id}}" >Edit</a></td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal" id="editModal" tabindex="-1" aria-labelledby="editModalLabel"
|
||||
aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="editModalLabel">Event</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<form class="form" id="edit-form" action="/admin/events/0" role="form" method="post">
|
||||
<div class="modal-body">
|
||||
{{ form.csrf_token }}
|
||||
<div class="form-floating mb-3 required">
|
||||
{{ form.name(class="form-control") }}
|
||||
{{ form.name.label() }}
|
||||
</div>
|
||||
<div class="form-floating mb-3">
|
||||
{{ form.description(class="form-control") }}
|
||||
{{ form.description.label() }}
|
||||
</div>
|
||||
<div class="form-floating mb-3 required">
|
||||
{{ form.location(class="form-control") }}
|
||||
{{ form.location.label() }}
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="form-floating mb-3 required">
|
||||
{{ form.start_day(class="form-control") }}
|
||||
{{ form.start_day.label() }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="form-floating mb-3 required">
|
||||
{{ form.start_time(class="form-control") }}
|
||||
{{ form.start_time.label() }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="form-floating mb-3 required">
|
||||
{{ form.end_day(class="form-control") }}
|
||||
{{ form.end_day.label() }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="form-floating mb-3 required">
|
||||
{{ form.end_time(class="form-control") }}
|
||||
{{ form.end_time.label() }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||
<button type="submit" class="btn btn-primary" id="edit-save">Save changes</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="{{ url_for('static', filename='js/jquery-3.6.3.min.js') }}" charset="utf-8"></script>
|
||||
|
||||
<script charset="utf-8">
|
||||
const editButton = document.getElementById("edit-save")
|
||||
|
||||
$('#editModal').on('show.bs.modal', function(event) {
|
||||
var modal = $(this)
|
||||
modal.find('#name').val('')
|
||||
modal.find('#location').val('')
|
||||
modal.find('#description').val('')
|
||||
modal.find('#start_day').val('')
|
||||
modal.find('#start_time').val('')
|
||||
modal.find('#end_day').val('')
|
||||
modal.find('#end_time').val('')
|
||||
|
||||
var button = $(event.relatedTarget)
|
||||
var name,description,loc,start_time,start_day,end_time,end_day
|
||||
id = button.data('id')
|
||||
|
||||
saveButton = document.getElementById("edit-save")
|
||||
saveButton.dataset.id = id
|
||||
|
||||
editForm = document.getElementById("edit-form")
|
||||
editForm.action = "/admin/event/" + id
|
||||
|
||||
if (id) {
|
||||
$.get(`/admin/event/${id}`, (data) => {
|
||||
|
||||
if (data.status == "error") {
|
||||
// This is a new event, do nothing!
|
||||
} else {
|
||||
name = data.name,
|
||||
description = data.description,
|
||||
loc = data.location
|
||||
|
||||
start = new Date(data.start_time)
|
||||
|
||||
var day = ("0" + start.getDate()).slice(-2);
|
||||
var month = ("0" + (start.getMonth() + 1)).slice(-2);
|
||||
|
||||
start_day = start.getFullYear()+"-"+(month)+"-"+(day);
|
||||
start_time = `${start.getHours()}:${padTwoDigits(start.getMinutes())}`
|
||||
end = new Date(data.end_time)
|
||||
|
||||
var day = ("0" + end.getDate()).slice(-2);
|
||||
var month = ("0" + (end.getMonth() + 1)).slice(-2);
|
||||
|
||||
end_day = end.getFullYear()+"-"+(month)+"-"+(day);
|
||||
end_time = `${end.getHours()}:${padTwoDigits(end.getMinutes())}`
|
||||
}
|
||||
|
||||
modal.find('#name').val(name)
|
||||
modal.find('#location').val(loc)
|
||||
modal.find('#description').val(description)
|
||||
modal.find('#start_day').val(start_day)
|
||||
modal.find('#start_time').val(start_time)
|
||||
modal.find('#end_day').val(end_day)
|
||||
modal.find('#end_time').val(end_time)
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
})
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
Subproject commit 8d8a691aad1cea4037bb9d33ddf7230d8d272597
|
||||
Subproject commit e0fb69c0be54c6cce7391ccb86a9bf14b80f432b
|
||||
|
|
@ -9,7 +9,7 @@ Flask-Login==0.6.2
|
|||
Flask-Migrate==4.0.0
|
||||
Flask-SQLAlchemy==3.0.2
|
||||
Flask-WTF==1.0.1
|
||||
greenlet==2.0.1
|
||||
greenlet
|
||||
itsdangerous==2.1.2
|
||||
Jinja2==3.1.2
|
||||
Mako==1.2.4
|
||||
|
|
@ -19,7 +19,7 @@ psycopg2==2.9.5
|
|||
pynvim==0.4.3
|
||||
python-dotenv==0.21.0
|
||||
SQLAlchemy==1.4.44
|
||||
uWSGI==2.0.21
|
||||
uWSGI
|
||||
Werkzeug==2.2.2
|
||||
WTForms==3.0.1
|
||||
ulid
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue