add modal to send message to supervisor and contact info for supervisor

This commit is contained in:
Ryan Prather 2025-01-05 06:20:38 +00:00
parent ec487ed1ac
commit adcd02ff2b

View File

@ -10,9 +10,11 @@
<div class='ms-3'>
<h3 class='mb-0 h4 font-weight-bolder'>My Cases</h3>
<p class='mb-4'>
{{ supervisor.name }}<br/>
{{ supervisor.name }}&nbsp;&nbsp;<a href='#' id='message-supervisor'>
<i class='material-symbols-rounded opacity-10'>message</i>
</a><br/>
<a href='mailto:{{ supervisor.email }}'>{{ supervisor.email }}</a><br/>
<a href='tel:'></a>
{% if supervisor.workPhone %}<a href='tel:{{ supervisor.workPhone }}'>{{ supervisor.getFormattedPhone() }}</a>{% endif %}
</p>
</div>
{% for c in cases %}
@ -44,5 +46,52 @@
{% endfor %}
</div>
</div>
<div class='modal fade' id='message-modal' tabindex='-1' role='dialog' aria-labelledby='message-modal-title'>
<div class='modal-dialog modal-dialog-centered' role='document'>
<div class='modal-content'>
<div class="modal-header">
<h6 class="modal-title font-weight-normal" id="message-modal-label">Message Supervisor</h6>
<button type="button" class="btn-close text-dark" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class='modal-body'>
<form>
<div class='input-group input-group-outline my-3'>
<select id='my-cases' name='case'>
<option value=''>-- Case --</option>
{% for c in cases %}
<option value='{{ c.id }}'>{{ c.caseName }}</option>
{% endfor %}
</select>
</div>
<div class='input-group input-group-outline my-3'>
<textarea name='message' id='message' style='width:100%;height:100px;'></textarea>
</div>
</form>
</div>
<div class='modal-footer'>
<button type='button' id='close-modal' class='btn bg-gradient-secondary' data-bs-dismiss='modal'>Close</button>
<button type='button' id='send-supervisor-message' class='btn bg-gradient-primary'>Send Message</button>
</div>
</div>
</div>
</div>
</main>
{% endblock %}
{% block page_js %}
<script type='module'>
import $ from "{{ asset('vendor/jquery/jquery.index.js') }}";
import {messageSupervisor, sendMessage} from '{{ asset("js/app/message.js") }}';
window.$ = $;
$(function () {
document.getElementById('message-supervisor').addEventListener('click', messageSupervisor);
document.getElementById('send-supervisor-message').addEventListener('click', sendMessage);
});
</script>
{% endblock %}