{% extends "basic/base_template.html" %}

{% block pageName %}
APR - {{ member.army_no }}
{% endblock pageName %}

{% block content %}

<form action="" method="post" class="needs-validation" novalidate>
    {% csrf_token %}


<p class="bg-black text-white text-center">PART-1 PERS INFO</p>
<div class="d-flex flex-wrap gap-3">
    <p class="mb-0">Army No: {{ member.army_no }}</p>
    <p class="mb-0">Name: {{ member.name }}</p>
    <p class="mb-0">Rank: {{ member.rank }}</p>
    <p class="mb-0">Unit: {{ member.company.battalion.name }}</p>
    <p class="mb-0">Sub Unit: {{ member.company.name }}</p>
    <p class="mb-0">Enrollment Dt: {{ service_info.doe|date:"d-M-Y" }}</p>
    <p class="mb-0">Marital Status: {{ member.get_marital_status_display }}</p>
    <p class="mb-0">Mob No : {{ member.mobile_no }}</p>
</div>



<p class="bg-black text-white text-center">PART-2 MED INFO</p>
<div class="d-flex flex-wrap gap-3 align-items-center">
    <p class="mb-0">Med Cat: {{ service_info.get_med_cat_display }}</p>

    <p class="mb-0">
        Obesity:
        <input type="text" name="obesity" placeholder="Yes(15 lbs)" class="form-control d-inline-block w-auto">
    </p>
    <p class="mb-0">
        Sickness:
        <select name="sickness" class="form-select d-inline-block w-auto">
            <option value="">Select</option>
            {% for key,value in yes_no %}
                <option value="{{ key }}">{{ value }}</option>
            {% endfor %}
        </select>
    </p>
    <p class="mb-0">
        From:
        <input type="date" name="sickness_from" class="form-control d-inline-block w-auto">
    </p>
    <p class="mb-0">
        To:
        <input type="date" name="sickness_to" class="form-control d-inline-block w-auto">
    </p>
    <p class="mb-3 d-flex w-100 align-items-center gap-3">
        Remarks:
        <input type="text" name="sickness_remarks" placeholder="Enter remarks" class="form-control w-100">
    </p>
</div>


<p class="bg-black text-white text-center">PART-3: RESP AND REPORTING AUTH</p>

<table class="table table-bordered align-middle text-center">
    <thead class="">
        <tr>
            <th>Ser</th>
            <th class="w-25">Resp</th>
            <th>From</th>
            <th>To</th>
            <th>Unit</th>
            <th>Imm Reporting JCO/NCO</th>
            <th>Reporting Offr</th>
        </tr>
    </thead>
    <tbody>
        {% for i in "12345" %}
        <tr>
            <td>{{ forloop.counter }}</td>
            <td><input type="text" name="part_3_resp_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="part_3_from_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="part_3_to_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="part_3_unit_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="part_3_imm_reporting_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="part_3_reporting_offr_{{ forloop.counter }}" class="form-control"></td>
        </tr>
        {% endfor %}
    </tbody>
</table>



<p class="bg-black text-white text-center">PART-4: DISCIPLINE STATE/REWARD/PUNISHMENT/SPL CONTRIBUTION/COURSE AND CDR PERFORMANCE</p>

Obsn/Reward/Punishment
<table class="table table-bordered align-middle text-center">
    <thead class="">
        <tr>
            <th>Ser</th>
            <th>Obsn/Reward/Punishment</th>
            <th>Dt</th>
            <th>Type</th>
            <th>Rmks</th>
        </tr>
    </thead>
    <tbody>
        {% for punishment in punishments %}
        <tr>
            <td></td>
            <td>Punishment</td>
            <td>{{ punishment.date|date:"d-M-Y" }}</td>
            <td>{{ punishment.punishment_type.text }}</td>
            <td>{{ punishment.remarks }}</td>
        </tr>
        {% endfor %}
        {% for observation in observations %}
        <tr>
            <td></td>
            <td>Observation</td>
            <td>{{ observation.date|date:"d-M-Y" }}</td>
            <td></td>
            <td>{{ observation.remarks }}</td>
        </tr>
        {% endfor %}
        {% for reward in rewards %}
        <tr>
            <td></td>
            <td>Reward</td>
            <td>{{ reward.date|date:"d-M-Y" }}</td>
            <td></td>
            <td>{{ reward.remarks }}</td>
        </tr>
        {% endfor %}
        <tr>
            <td>.</td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </tbody>
</table>
Course/Cdr Performance
<table class="table table-bordered align-middle text-center">
    <thead class="">
        <tr>
            <th>Ser</th>
            <th>Course Name</th>
            <th>From</th>
            <th>To</th>
            <th>Duration</th>
            <th>Unit/Inst</th>
            <th>Result</th>
            <th>Remarks</th>
        </tr>
    </thead>
    <tbody>
        {% for course in course_cdrs %}
        <tr>
            <td>{{ forloop.counter }}</td>
            <td>{{ course.course_name.text }}</td>
            <td>{{ course.start_date|date:"d-M-Y" }}</td>
            <td>{{ course.end_date|date:"d-M-Y" }}</td>
            <td>{{ course.days }}</td>
            <td>{{ course.institution.text }}</td>
            <td>{{ course.get_result_display }}</td>
            <td>{{ course.marks }}</td>
        </tr>
        {% endfor %}
        <tr>
            <td>.</td>
            {% for i in "1234567" %}
            <td></td>
            {% endfor %}
        </tr>
    </tbody>
</table>



Spl Contribution
<table class="table table-bordered align-middle text-center">
    <thead class="">
        <tr>
            <th>Ser</th>
            <th>Contribution</th>
            <th>From</th>
            <th>To</th>
            <th>Role</th>
            <th>Performance</th>
        </tr>
    </thead>
    <tbody>
        {% for i in "12345" %}
        <tr>
            <td>{{ forloop.counter }}</td>
            <td class="w-25"><input type="text" name="spl_contribution_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="spl_from_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="spl_to_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="spl_role_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="spl_performance_{{ forloop.counter }}" class="form-control"></td>
        </tr>
        {% endfor %}
    </tbody>
</table>

Attendance
<table class="table table-bordered align-middle">
    <tr>
        <td>Total Lve availed in this Yr:</td>
        <td>{{total_leaves}}</td>
        <td>Total Days On Parade in wk place</td>
        <td>{{total_days}}</td>
    </tr>
</table>


<p class="bg-black text-white text-center">PART-5: PERFORMANCE RECORD</p>


<table class="table table-bordered align-middle">
    <thead>
        <tr>
            <th>Ser</th>
            <th>Event</th>
            <th>Result</th>
            <th>Attempt</th>
            <th>Ser</th>
            <th>Event</th>
            <th>Result</th>
            <th>Score</th>
        </tr>

    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>1st Bi-Annual IPFT</td>
            <td>{{pet_1.get_result_display}}</td>
            <td>{{pet_1.get_attempt_display}}</td>
            <td>1</td>
            <td>RET</td>
            <td>{{ret.get_result_display}}</td>
            <td>{{ret_score}}</td>
        </tr>
        <tr>
            <td>2</td>
            <td>2nd Bi-Annual IPFT</td>
            <td>{{pet_2.get_result_display}}</td>
            <td>{{pet_2.get_attempt_display}}</td>
            <td>2</td>
            <td>Gren Firing</td>
            <td>{{gr_firing.get_result_display}}</td>
            <td>{{gr_firing_score}}</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Aslt Course</td>
            <td>{{aslt_course.get_result_display}}</td>
            <td>{{aslt_course.get_attempt_display}}</td>
            <td>3</td>
            <td>Fd Firing</td>
            <td>{{fd_firing.get_result_display}}</td>
            <td>{{fd_firing.score}}</td>
        </tr>
        <tr>
            <td>4</td>
            <td>Speed March</td>
            <td>{{sm.get_result_display}}</td>
            <td>{{sm.get_attempt_display}}</td>
            <td>4</td>
            <td>Course Shooting</td>
            <td>{{course_shooting.get_result_display}}</td>
            <td>{{course_shooting.score}}</td>
        </tr>
    </tbody>
</table>


Ops Activities
<table class="table table-bordered align-middle text-center">
    <thead class="">
        <tr>
            <th>Ser</th>
            <th>Ops</th>
            <th>From</th>
            <th>To</th>
            <th>Role</th>
            <th>Performance</th>
        </tr>
    </thead>
    <tbody>
        {% for i in "12345" %}
        <tr>
            <td>{{ forloop.counter }}</td>
            <td class="w-25"><input type="text" name="ops_activities_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="ops_from_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="ops_to_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="ops_role_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="ops_performance_{{ forloop.counter }}" class="form-control"></td>
        </tr>
        {% endfor %}
    </tbody>
</table>
Trg Activities
<table class="table table-bordered align-middle text-center">
    <thead class="">
        <tr>
            <th>Ser</th>
            <th>Trg Activities</th>
            <th>From</th>
            <th>To</th>
            <th>Role</th>
            <th>Performance</th>
        </tr>
    </thead>
    <tbody>
        {% for i in "12345" %}
        <tr>
            <td>{{ forloop.counter }}</td>
            <td class="w-25"><input type="text" name="trg_activities_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="trg_from_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="trg_to_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="trg_role_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="trg_performance_{{ forloop.counter }}" class="form-control"></td>
        </tr>
        {% endfor %}
    </tbody>
</table>
Admin Activities
<table class="table table-bordered align-middle text-center">
    <thead class="">
        <tr>
            <th>Ser</th>
            <th>Admin</th>
            <th>From</th>
            <th>To</th>
            <th>Role</th>
            <th>Performance</th>
        </tr>
    </thead>
    <tbody>
        {% for i in "12345" %}
        <tr>
            <td>{{ forloop.counter }}</td>
            <td class="w-25"><input type="text" name="admin_activities_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="admin_from_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="date" name="admin_to_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="admin_role_{{ forloop.counter }}" class="form-control"></td>
            <td><input type="text" name="admin_performance_{{ forloop.counter }}" class="form-control"></td>
        </tr>
        {% endfor %}
    </tbody>
</table>

<p class="bg-black text-white text-center">PART-6: PERFORMANCE EVALUATION</p>

<table class="table table-bordered align-middle text-center ">
    <thead>
        <tr>
            <th>Physical Efficiency (15)</th>
            <th>Firing Efficiency (10)</th>
            <th>Tactical Proficiency (5)</th>
            <th>Technical Proficiency (5)</th>
            <th>Leadership (5)</th>
            <th>Followership (5)</th>
            <th>Communication Skill (5)</th>
            <th>Turnout &amp; Bearing (5)</th>
            <th>Performance in Appointment (15)</th>
            <th>Total</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><input type="number" name="marks_physical_efficiency" class="form-control mark-input" min="0" max="15" step="0.01" required></td>
            <td><input type="number" name="marks_firing_efficiency" class="form-control mark-input" min="0" max="10" step="0.01" required></td>
            <td><input type="number" name="marks_tactical_proficiency" class="form-control mark-input" min="0" max="5" step="0.01" required></td>
            <td><input type="number" name="marks_technical_proficiency" class="form-control mark-input" min="0" max="5" step="0.01" required></td>
            <td><input type="number" name="marks_leadership" class="form-control mark-input" min="0" max="5" step="0.01" required></td>
            <td><input type="number" name="marks_followership" class="form-control mark-input" min="0" max="5" step="0.01" required></td>
            <td><input type="number" name="marks_comm_skill" class="form-control mark-input" min="0" max="5" step="0.01" required></td>
            <td><input type="number" name="marks_turnout_and_bearing" class="form-control mark-input" min="0" max="5" step="0.01" required></td>
            <td><input type="number" name="marks_appt" class="form-control mark-input" min="0" max="15" step="0.01" required></td>
            <td><span id="part1_total">0</span></td>
        </tr>
    </tbody>
</table>

<p class="bg-black text-white text-center">PART-7: CHARACTER TRAITS AND OBSERVANCE OF MIL VALUES</p>

<table class="table table-bordered align-middle text-center">
    <thead>
        <tr>
            <th>Ser</th>
            <th>Traits/Values</th>
            <th>State</th>
            <th class="w-50">Reason</th>
            <th>Ref</th>
        </tr>
    </thead>
    <tbody>
        {% for trait in traits %}
        <tr>
            <td>{{ forloop.counter }}</td>
            <td>{{ trait.1 }}</td>
            <td>
                <select name="{{ trait.0 }}_state" class="form-select">
                    {% for key, value in states %}
                    <option value="{{ key }}">{{ value }}</option>
                    {% endfor %}
                </select>
            </td>
            <td><input type="text" name="{{ trait.0 }}_reason" class="form-control"></td>
            <td><input type="text" name="{{ trait.0 }}_reference" class="form-control"></td>
        </tr>
        {% endfor %}
    </tbody>
</table>


<p class="bg-black text-white text-center">PART-8: OVERALL EVALUATION</p>

<table class="table table-bordered align-middle text-center ">
    <thead>
        <tr>
            <th>Competency Assessment (Part 2) (70)</th>
            <th>Character Traits & Military Values (10)</th>
            <th>Discipline (10)</th>
            <th>Course/Cadre Results (5)</th>
            <th>Awards & Special Contributions (5)</th>
            <th>Grand Total (100)</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><span id="part2_total">0</span></td>
            <td><input type="number" name="marks_character_traits" class="form-control" min="0" max="10" step="0.01" required></td>
            <td><input type="number" name="marks_discipline" class="form-control" min="0" max="10" step="0.01" required></td>
            <td><input type="number" name="marks_course_cdr" class="form-control" min="0" max="5" step="0.01" required></td>
            <td><input type="number" name="marks_award" class="form-control" min="0" max="5" step="0.01" required></td>
            <td><span id="grand_total">0</span></td>
        </tr>
    </tbody>
</table>

<p class="bg-black text-white text-center">PART-9: RECOM, PEN-PICTURE AND ADVICE</p>
Recom
<table class="table table-bordered align-middle">
    {% for i in recoms %}
    <tr>
        <td class="w-25">{{ i.1 }}:</td>
        <td>
            <select name="{{ i.0 }}" class="form-select reason-toggle" data-target="{{ i.0 }}_reason">
                {% for key,value in yes_no %}
                <option value="{{ key }}">{{ value }}</option>
                {% endfor %}
            </select>
        </td>
        <td>Reason:</td>
        <td class="w-50">
            <input type="text" name="{{ i.0 }}_reason" id="{{ i.0 }}_reason" class="form-control">
        </td>
    </tr>
    {% endfor %}
    <tr>
        <td>In which subject should he receive training? </td>
        <td colspan="3">
            <input type="text" name="receive_training" class="form-control">
        </td>
    </tr>
</table>


Pen-Picture
<table class="table table-bordered align-middle text-center">
    <thead>
        <tr>
            <th>Ser</th>
            <th>Heads</th>
            <th class="w-75">Qualities and Performance</th>
        </tr>
    </thead>
    <tbody>
        {% for i in pen_pictures %}
        <tr>
            <td>{{ forloop.counter }}</td>
            <td>{{ i.1 }}</td>
            <td>
                <select name="{{ i.0 }}" class="form-select">
                    <option value="" selected disabled>Select</option>
                    {% for key, value in ratings %}
                    <option value="{{ key }}">{{ value }}</option>
                    {% endfor %}
                </select>
            </td>
        </tr>
        {% endfor %}
        <tr>
            <td>.</td>
            <td>Extra Curricular Activities</td>
            <td>
                <input class="form-control" type="text" name="extra_curricular" id="extra_curricular">
            </td>
        </tr>
    </tbody>
</table>

<p class="mb-3 d-flex w-100 align-items-center gap-3">
    Advice:
    <input type="text" name="advice" placeholder="Type advice" class="form-control w-100">
</p>


<table class="table table-bordered align-middle">
    <tr>
        <td>Opinion of the Reported Upon Sldr:</td>
        <td>
            <select name="opinion_of_reported_sldr" id="" class="form-select reason-toggle" data-target="opinion_of_reported_sldr_reason">
                {% for key,value in opinion %}
                <option value="{{ key }}">{{ value }}</option>
                {% endfor %}
            </select>
        </td>
        <td>Reason:</td>
        <td class="w-50"><input type="text" name="opinion_of_reported_sldr_reason" class="form-control" id="opinion_of_reported_sldr_reason"></td>
    </tr>
</table>


{% comment %} <p class="bg-black text-white text-center">PART-10: TO BE FILLED UP BY SUPERIOR AUTH</p>

Cfm of Recom
<table class="table table-bordered align-middle">
    <tr>
        <td>Suitability for Next Rk:</td>
        <td>
            <select name="cfm_suitability_for_next_rk" id="" class="form-select">
                {% for key,value in yes_no %}
                <option value="{{ key }}">{{ value }}</option>
                {% endfor %}
            </select>
        </td>
        <td>Reason:</td>
        <td class="w-50"><input type="text" name="cfm_suitability_for_next_rk_reason" class="form-control"></td>
    </tr>
    <tr>
        <td>Recom for UN Msn:</td>
        <td>
            <select name="cfm_recom_for_un_msn" id="" class="form-select">
                {% for key,value in yes_no %}
                <option value="{{ key }}">{{ value }}</option>
                {% endfor %}
            </select>
        </td>
        <td>Reason:</td>
        <td class="w-50"><input type="text" name="cfm_recom_for_un_msn_reason" class="form-control"></td>
    </tr>
</table>

<p class="mb-3 d-flex w-100 align-items-center gap-3">
    Opinion:
    <input type="text" name="opinion" placeholder="Type opinion" class="form-control w-100">
</p> {% endcomment %}


<button class="btn btn-primary" type="submit">Save APR</button>
</form>


    <script>
      // Example starter JavaScript for disabling form submissions if there are invalid fields
      (() => {
        "use strict";
  
        // Fetch all the forms we want to apply custom Bootstrap validation styles to
        const forms = document.querySelectorAll(".needs-validation");
  
        // Loop over them and prevent submission
        Array.from(forms).forEach((form) => {
          form.addEventListener(
            "submit",
            (event) => {
              if (!form.checkValidity()) {
                event.preventDefault();
                event.stopPropagation();
              }
  
              form.classList.add("was-validated");
            },
            false
          );
        });
      })();
    </script>
<script>
    const part1Inputs = document.querySelectorAll(".mark-input");
    const part2Inputs = document.querySelectorAll(
        "input[name='marks_character_traits'], input[name='marks_discipline'], input[name='marks_course_cdr'], input[name='marks_award']"
    );

    const part1TotalDisplay = document.getElementById("part1_total");
    const part2TotalDisplay = document.getElementById("part2_total");
    const grandTotalDisplay = document.getElementById("grand_total");

    function calculateTotals() {
        // Calculate first part total
        let part1Total = 0;
        part1Inputs.forEach(input => {
            part1Total += parseFloat(input.value) || 0;
        });

        // Show the same total in both part1_total and part2_total
        part1TotalDisplay.textContent = part1Total.toFixed(2);
        part2TotalDisplay.textContent = part1Total.toFixed(2);

        // Calculate second part extra marks
        let extraMarks = 0;
        part2Inputs.forEach(input => {
            extraMarks += parseFloat(input.value) || 0;
        });

        // Grand total
        let grandTotal = part1Total + extraMarks;
        grandTotalDisplay.textContent = grandTotal.toFixed(2);

        // Change color based on 100
        //grandTotalDisplay.style.color = (grandTotal === 100) ? "green" : "red";
    }

    // Listen for input changes
    [...part1Inputs, ...part2Inputs].forEach(input => {
        input.addEventListener("input", calculateTotals);
    });
</script>


<script>
    document.addEventListener("DOMContentLoaded", function () {
        document.querySelectorAll(".reason-toggle").forEach(select => {
            select.addEventListener("change", function () {
                let targetInput = document.getElementById(this.dataset.target);

                if (this.value === "2") {
                    targetInput.setAttribute("required", "true");
                } else {
                    targetInput.removeAttribute("required");
                }
            });
        });
    });
</script>
{% endblock content %}