{% extends 'base.html.twig' %}

{% block body %}
	{{ block('nav', 'internal/libs/nav.html.twig') }}

	<main class="main-content position-relative max-height-vh-100 h-100 border-radius-lg ">
		{{ block('topnav', 'internal/libs/top-nav.html.twig') }}

		<section>
			<div class="card card-plain">
				<div class="card-header">
					<h4 class="font-weight-bolder">Add Referral Note</h4>
					<p class="mb-0">{{ referral.memberCase.caseName }}</p>
				</div>
				<div class="card-body">
					{{ form_start(form) }}
					{{ form_errors(form) }}
					<div class='container'>
						<div class='row'>
							{% set endDateWarning = '' %}
							{% if date("+28 days") >= referral.endDate %}
								{% set endDateWarning = 'bg-gradient-warning' %}
							{% elseif date("+14 days") >= referral.endDate %}
								{% set endDateWarning = 'bg-gradient-danger text-white' %}
							{% endif %}
							<span class='col{% if referral.hours < 40 %} bg-gradient-danger text-white{% endif %}'>
								Hours:
								{{ referral.hours }}
								/
								Remaining:
								{{ referral.getHoursRemaining() }}
							</span>
							<span class='col {{ endDateWarning }}'>
								Expiration Date:
								{{ referral.endDate|date('M j, Y') }}
							</span>
						</div>
						<div class='row' style='margin-top:10px;'>
							<div class='col'>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_date'></label>
									<input type='date' name='{{ field_name(form.date) }}' id='note_form_date' class='form-control' title='Visit Date'/>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_startTime'></label>
									<input type='time' name='{{ field_name(form.startTime) }}' id='note_form_startTime' onchange='calcTime()' class='form-control' title='Start Time'/>&nbsp;&nbsp;
									<label for='note_form_endTime'></label>
									<input type='time' name='{{ field_name(form.endTime) }}' id='note_form_endTime' onchange='calcTime()' class='form-control' title='End Time'/>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<input type='text' id='case-mins' style='width:49%;margin-right:5px;' disabled='disabled' title='Case Minutes'/>
									<input type='text' id='case-hours' style='width:49%;margin-left:5px;' disabled='disabled' title='Case Hours'/>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.status) }}' id='note_form_status' class='form-control'>
										<option value=''>-- Status --</option>

										{% for s in enum('App\\Enums\\NoteStatus').cases() %}
											<option value='{{ s.value }}'>{{ s.value|capitalize }}</option>
										{% endfor %}
									</select>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.location) }}' id='note_form_location' class='form-control'>
										<option value=''>-- Location --</option>

										{% for l in enum('App\\Enums\\NoteLocation').cases() %}
											<option value='{{ l.value }}' {% if l == default_location %} selected='selected' {% endif %}>{{ l.value }}</option>
										{% endfor %}
									</select>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.method) }}' id='note_form_method' class='form-control'>
										<option value=''>-- Method --</option>

										{% for m in enum('App\\Enums\\NoteMethod').cases() %}
											<option value='{{ m.value }}' {% if m == default_method %} selected='selected' {% endif %}>{{ m.name|replace({'_': ' '})|lower|capitalize }}</option>
										{% endfor %}
									</select>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_parentalRole'>Parental Role</label>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.parentalRole) }}' id='note_form_parentalRole' class='form-control'>
										<option value=''>-- Select --</option>

										{% for q in enum('App\\Enums\\VisitQualityLevel').cases() %}
											<option value='{{ q.value }}'>{{ q.name|lower|capitalize }}</option>
										{% endfor %}
									</select>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_childDevelopment'>Child Development</label>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.childDevelopment) }}' id='note_form_childDevelopment' class='form-control'>
										<option value=''>-- Select --</option>

										{% for q in enum('App\\Enums\\VisitQualityLevel').cases() %}
											<option value='{{ q.value }}'>{{ q.name|lower|capitalize }}</option>
										{% endfor %}
									</select>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_appropriateResponse'>Appropriate Response</label>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.appropriateResponse) }}' id='note_form_appropriateResponse' class='form-control'>
										<option value=''>-- Select --</option>

										{% for q in enum('App\\Enums\\VisitQualityLevel').cases() %}
											<option value='{{ q.value }}'>{{ q.name|lower|capitalize }}</option>
										{% endfor %}
									</select>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_childAheadOfSelf'>Child Ahead Of Self</label>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.childAheadOfSelf) }}' id='note_form_childAheadOfSelf' class='form-control'>
										<option value=''>-- Select --</option>

										{% for q in enum('App\\Enums\\VisitQualityLevel').cases() %}
											<option value='{{ q.value }}'>{{ q.name|lower|capitalize }}</option>
										{% endfor %}
									</select>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_showsEmpathy'>Shows Empathy</label>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.showsEmpathy) }}' id='note_form_showsEmpathy' class='form-control'>
										<option value=''>-- Select --</option>

										{% for q in enum('App\\Enums\\VisitQualityLevel').cases() %}
											<option value='{{ q.value }}'>{{ q.name|lower|capitalize }}</option>
										{% endfor %}
									</select>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_childFocused'>Child Focused</label>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<select name='{{ field_name(form.childFocused) }}' id='note_form_childFocused' class='form-control'>
										<option value=''>-- Select --</option>

										{% for q in enum('App\\Enums\\VisitQualityLevel').cases() %}
											<option value='{{ q.value }}'>{{ q.name|lower|capitalize }}</option>
										{% endfor %}
									</select>
								</div>
							</div>
							<div class='col'>
								<div class='input-group input-group-outline mb-3'>
									{{ form_row(form.members, {
                                        'label': 'Members Present',
                                        'label_attr': {'class': ''},
                                        'attr': {'class': 'form-control'}
                                        }) }}
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_narrative'>Observed Narrative</label>
									<textarea name='{{ field_name(form.narrative) }}' id='note_form_narrative' class='form-control' style='width:100%;height:200px;'></textarea>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_strengths'>Observed Strengths</label>
									<textarea name='{{ field_name(form.strengths) }}' id='note_form_strengths' class='form-control' style='width:100%;height:200px;'></textarea>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_issues'>Observed Issues</label>
									<textarea name='{{ field_name(form.issues) }}' id='note_form_issues' class='form-control' style='width:100%;height:100px;'></textarea>
								</div>
								<div class='input-group input-group-outline mb-3'>
									<label for='note_form_recommendation'>Recommendation</label>
									<textarea name='{{ field_name(form.recommendation) }}' id='note_form_recommendation' class='form-control' style='width:100%;height:100px;'></textarea>
								</div>
							</div>
						</div>
						<div class='row'>
							<div class="text-center">
								<button type="submit" class="btn btn-lg bg-gradient-dark btn-lg w-100 mt-4 mb-0">Save Note</button>
							</div>
						</div>
					</div>
					{{ form_end(form) }}
				</div>
			</div>
		</section>
	</main>
{% endblock %}