<%=raw app.core.View.getTemplate( 'configuration-nav', { activeTab : 'attendance-log' } ) %>
<div class="row">
    <div class="col-sm-12">
        <div class="card">
            <div class="card-body">
                <div class="row">
                    <div class="col">
                        <strong><%= _lc( 'YOUR_APPOINTMENT_LOG' ) %></strong>
                    </div>
                </div>
                <div class="row" style="margin-top: 12px;">
                    <div class="col">
                        <div class="form-group">
                            <div class="form-group">
                                <label for="select-team-id">
                                    <%= _lc( 'APPOINTMENT_LOG_TEAM' ) %>
                                </label>
                                <select class="form-control"
                                        name="team-id"
                                        data-id="select-team-id"
                                        id="select-team-id">
                                    <% for ( var gi = 0; gi < groups.length; gi++ ) {    %>
                                        <option value="<%= groups[ gi ].getId() %>"><%= groups[ gi ].getName() %></option>
                                    <% }    %>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-12">
                        <div class="form-group" style="margin-bottom:0;">
                            <label for="appointment-log-from">
                                <%= _lc( 'FROM' ) %>
                            </label>
                            <input type="date"
                                   id="appointment-log-from"
                                   value="<%= moment().subtract( 30, 'days' ).format( 'YYYY-MM-DD' ) %>"
                                   data-id="input-appointment-log-from"
                                   class="form-control" />
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12">
                        <div class="form-group" style="margin-bottom:0;">
                            <label for="appointment-log-until">
                                <%= _lc( 'UNTIL' ) %>
                            </label>
                            <input type="date"
                                   id="appointment-log-until"
                                   value="<%= moment().format( 'YYYY-MM-DD' ) %>"
                                   data-id="input-appointment-log-until"
                                   class="form-control" />
                        </div>
                    </div>
                </div>
                <hr />
                <div class="row">
                    <div class="col">
                        <div data-id="container-appointment-log">
                            <i class="fas fa-spinner fa-spin"></i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="card-footer">
                <div class="row">
                    <div class="col">
                        <button class="btn btn-primary btn-sm"
                                data-id="btn-update-appointment-log">
                            <%= _lc( 'BTN_UPDATE_APPOINTMENT_LOG' ) %>
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>