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

{% set pagename = 'Add Attendance Status' | trans %}
{% block MainContent %}
    <span class="r__q__s" data-path="{{ path('requestHandler__attendance') }}"></span>

    <!--begin::Portlet-->
    <div class="kt-portlet" id="view____form">
        <div class="kt-portlet__head">
            <div class="kt-portlet__head-label">
                <h3 class="kt-portlet__head-title">
                    {{ attendance_status__obj.id is empty ? 'Add new attendance status'|trans : 'Update attendance status'|trans }}
                </h3>
            </div>
        </div>

        <!--begin::Form-->
        <form class="kt-form" id="add___attendance_Status">
            {# form input elements #}
            <div class="kt-portlet__body">

                <input type="hidden" name="___rand__attedance__type_ref" value="{{ attendance_status__obj.id }}">

                <div class="row">
                    {# attendance status type #}
                    <div class="col-xl-4 col-lg-4 col-md-6 col-xs-12">
                        <label class="col-form-label">{{ 'Attendance name'|trans }} {{ requireSymbol|raw }} </label>
                        <input type="text" name="name" class="form-control" placeholder="{{ 'Name'|trans }}" value="{{ attendance_status__obj.name }}" required="required">
                    </div>


                    {# attendance enable and disable #}
                    <div class="col-xl-4 col-lg-4 col-md-6 col-xs-12">
                        <label class="col-form-label">{{ 'Show this status when marking attendance?'|trans }}</label>
                        <div class="form-group">
                            <div class="">
                                <div class="kt-checkbox-inline">

                                    {# Is filed is require #}
                                    <label class="kt-checkbox kt-checkbox--bold kt-checkbox--brand">
                                        <input type="checkbox"  name="enable_disable__" {{ attendance_status__obj.id is empty ? 'checked="checked"' : attendance_status__obj.enable ? "checked='checked' " : "" }}> {{ 'Enable?'|trans }}
                                        <span></span>
                                    </label>

                                </div>
                            </div>
                        </div>
                    </div>

                    {# attendnace type #}
                    <div class="col-xl-4 col-lg-4 col-md-6 col-xs-12">
                        <div class="form-group">
                            <label class="col-form-label">{{ 'Status type'|trans }}
                            </label>
                            <div>
                                <div class="kt-radio-inline">
                                    <label class="kt-radio kt-radio--bold kt-radio--brand">
                                        <input type="radio" name="status" value="1" {{ attendance_status__obj.id is empty ?  "checked='checked'"   : attendance_status__obj.getType == 1 ? "checked='checked' " : ""   }} > {{ 'Present'|trans }}
                                        <span></span>
                                    </label>

                                    <label class="kt-radio kt-radio--bold kt-radio--brand">
                                        <input type="radio" name="status" value="0" {{ attendance_status__obj.id is not empty ? attendance_status__obj.getType == 0 ? "checked='checked' " : "" }}> {{ 'Absent'|trans }}
                                        <span></span>
                                    </label>

                                </div>
                            </div>
                        </div>
                    </div>

                    {# attendance description #}
                    <div class="col-xl-12 col-lg-12 col-md-12 col-xs-12">
                        <label class="col-form-label">{{ 'Description'|trans }} </label>
                        <textarea name="description" class="form-control" placeholder="{{ 'description'|trans }}">{{ attendance_status__obj.getDescription }}</textarea>
                    </div>


                </div>

            </div>

            {# submit buttons #}
            <div class="kt-portlet__foot">
                <div class="kt-form__actions">
                    <button type="submit" class="btn-primary btn addClassButton">
                        {{ attendance_status__obj.id is empty ? 'Add new attendance status'|trans : 'Update attendance status'|trans }}
                    </button>

                    {% if attendance_status__obj.id is not empty %}
                        <a href="{{ path('attendance_status') }}" class="btn-default btn">
                            {{ 'Back to list'|trans }}
                        </a>
                    {% endif %}
                </div>
            </div>
        </form>
    </div>

{% endblock %}
{% block ExtraJsFIles %}
    {% for file in encore_entry_js_files('attendance') %}
        <script src="{{ assetsBasePath ~ file }}" type="text/javascript"></script>{% endfor %}
{% endblock %}

{% block documentation %}
    <h5><b>Add or Editing Attendance Status?</b></h5>
    <br/>

    <div class="mb-3 accordion accordion-solid accordion-toggle-plus" id="accordionExample1">
        <div class="card">
            <div class="card-header" id="flow_div">
                <div class="card-title" data-toggle="collapse" data-target="#collapse_flow_div" aria-expanded="false"
                     aria-controls="collapseOne1">
                    Q1. What is the Flow of Attendance? (If you're new to Attendance, Please make sure you followed
                    these Setups)
                </div>
            </div>
            <div id="collapse_flow_div" class="collapse" aria-labelledby="flow_div" data-parent="#accordionExample1"
                 style="">
                <div class="card-body">
                    A1. <a target="_blank"
                           href="{{ path('secure_file_server', {'filePath'  : secure('fekara/media/help/AttendanceFlow.png')}) }}">See
                        Fig, To Check Flow</a>
                    <ul>
                        <li>Step 1 is about to add {{ 'Attendance satuts'|trans }} <a href="{{ path('attendance_status') }}">Complete Step 1</a></li>
                        <li>Step 2 is about to enable {{ 'Attendance satuts'|trans }} from Settings <a target="_blank" href="{{ path('app_settings') }}">Complete Step 2</a>, Go to the Setting Page & then Go to {{ 'Attendance Setting' | trans }} Tab </li>
                        <li>Step 3 is about Mark {{ 'Attendance'|trans }}<a target="_blank" href="{{ path('add_attendance') }}">Complete Step 3</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

    <p>Attendance Status are , <b>Present, Absent, Sick Leave and other</b>, these status are totally customized able & can define by yourself.
        <br>
        From here we add Add Attendance Status, Attendance Status is asking..
    </p>
    <ul>
        <li>Attendance Name - Attendance Status name</li>
        <li>Show this status when marking attendance? - Enable or Disable the Status </li>
        <li>Attendance Status - Each Attendance status is basically depends on two Status, <b>Present</b> & <b>Absent</b> </li>
        <li>Description - Why we're adding this Attendance status</li>
    </ul>

    <h5><b>How to Add Attendance Status?</b></h5>
    <br/>
    <p>To Add Attendance Status Click on the {{ 'Add Attendance Status'|trans }} button which is behind the Documentation button</p>

    <h5 class="color-red-"><b>Important! To Make Attendance Status enabled you need to follow this step</b></h5>
    <p> If your <b>App Setting </b>, Attendance Setting Tab, is not showing <b>{{ 'Visisble attendance status'|trans }}</b> Dropdown, then Please click on the
        link {{ 'Add Attendance status' | trans }} & system will redirect to the new page, where you can add the Attendance Status
        <a target="_blank" href="{{ path('secure_file_server', {'filePath':secure('fekara/media/help/AddAttendanceStatus.png')}) }}">See Fig</a>
        <br> Add new Status & Go back to the Settings Page and select the Attendance Status & you will able to Mark Attendance of Student.
    </p>

{% endblock %}