@extends('index-left-sidebar')

@section('content')
<div id="krik-single-event-registrations">
  <div class="panel krik-panel">
    <div class="panel-heading">
      <h3 class="krik-single-event-reports-title">{{ $singleEvent->name }}</h3>
      <h4 class="krik-single-event-reports-info">
        @php
          $event_start = new DateTime($singleEvent->start_ts);
          $event_end = new DateTime($singleEvent->end_ts);
          $event_days_diff = $event_start->diff($event_end)->d;
        @endphp
        @if($singleEvent->type_by_venue == 'physical')
          @if ($event_days_diff > 0)
            {{ date("d.m.Y. H:i", strtotime($singleEvent->start_ts)) . ' - ' . date("d.m.Y. H:i", strtotime($singleEvent->end_ts)) . ', ' . $singleEvent->venue_name }}
          @else
           {{ date("d.m.Y. H:i", strtotime($singleEvent->start_ts)) . ', ' . $singleEvent->venue_name }}
          @endif
        @else
          @if ($event_days_diff > 0)
            {{ date("d.m.Y. H:i", strtotime($singleEvent->start_ts)) . ' - ' . date("d.m.Y. H:i", strtotime($singleEvent->end_ts)) }}
          @else
            {{ date("d.m.Y. H:i", strtotime($singleEvent->start_ts)) }}
          @endif
        @endif
      </h4>

      {{ Form::open(array('url' => getenv('APP_URL') . '/registration/' . $event_code, 'method' => 'patch', 'target' => '_blank' )) }}
        <button type="submit" class="btn krik-btn-sign"><i class="fa fa-sign-in" aria-hidden="true"></i>Manually Register Lead</button>
      {{ Form::close() }}

      {{ Form::open(array('url' => getenv('APP_URL') . '/events/' . $event_code . '/report-registrations/export')) }}
        <button type="submit" class="btn krik-btn-export"><i class="fa fa-download" aria-hidden="true"></i>Export</button>
      {{ Form::close() }}
    </div>
  </div>

  <div class="col-md-12">
    <div class="panel panel-primary">
      <div class="panel-heading">
        <div class="pull-left">
          <h3 class="panel-title">All Registrants</h3>
        </div>
        <div class="clearfix"></div>
      </div>
      <div class="table-responsive">
        <table class="table table-striped krik-report-tables" id="krik-report-registrations-table" cellspacing="0" width="100%">
          <thead>
            <tr>
              <th style="max-width: 30px !important;"><div class="ckbox ckbox-success ckbox-registration"><input name="choosen-all" id="choosen-all" type="checkbox"><label for="choosen-all" class="th-label label-registration"></label></div></th>
              <th style="max-width: 10px !important;">#</th>
              <th>Lead name</th>
              <th>Company</th>
              <th>E-mail</th>
              <th>Phone</th>
              <th>Ticket</th>
              <th>Payment</th>
              <th>Registered</th>
              <th style="min-width: 120px !important;">Attended</th>
              <th style="min-width: 130px !important;">Status</th>
              <th style="max-width: 100px !important; min-width: 100px !important;" class="text-center">Actions</th>
            </tr>
          </thead>
        </table>
      </div>
      <script>
        var table = $('#krik-report-registrations-table').DataTable({
          processing: true,
          serverSide: false,
          ajax: {
            url: '{!! route('report-registrations.data') !!}',
            data: {
              event_code: '{{ $event_code }}'
            },
            type: 'POST',
            headers: {
              'X-CSRF-TOKEN': '{{ csrf_token() }}'
            }
          },
          scrollCollapse: true,
          searching: true,
          info: false,
          bSort: false,
          autoWidth: true,
          columns: [
            {
              searchable: false,
              orderable: false,
              className: 'dt-body-center',
              render: function (data, type, row) {
                  return '<div class="ckbox ckbox-success"><input name="choosen-leads[]" id="choosen-' + row.id + '" type="checkbox" value="' + row.id + '"><label for="choosen-' + row.id + '"></label></div>';
              }
            },
            {
              orderable: false,
              searchable: false,
              className: 'no-reorder',
              render: function() { return ''; }
            },
            { data: 'name', name: 'name' },
            { data: 'company_name', name: 'leads.company_name' },
            { data: 'email', name: 'leads.email' },
            { data: 'phone', name: 'phone' },
            { data: 'ticket_name', name: 'ticket_name' },
            { data: 'payment_option', name: 'payment_option' },
			{
                searchable: false,
				render: function(data, type, full, meta) {
					if(full.registered_ts != null) {
						return full.registered_ts
					} else {
						return full.confirmed_ts;
					}
				}
			},
            {
              name: 'event_attended_flag',
              searchable: false,
              className: 'no-selecting',
              render: function(data, type, full, meta) {
                var registration_attended = full.event_attended_flag;
                var registration_id = full.id;
                var registration_attended_html = null;

                if(registration_attended == '1') {
                  registration_attended_html = '<span class="krik-registration-attended">Attended</span>';
                  registration_attended_html = registration_attended_html + '<i class="fa fa-times-circle krik-registration-attend-not" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-registration-status-attended-not" data-info="tooltip" data-placement="top" title="Change to Not Attended"></i>';
                  registration_attended_html = registration_attended_html + '<i class="fa fa-check-circle krik-registration-attend hide" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-registration-status-attended" data-info="tooltip" data-placement="top" title="Change to Attended"></i>';
                } else {
                  registration_attended_html = '<span class="krik-registration-attended-not">Not Attended</span>';
                  registration_attended_html = registration_attended_html + '<i class="fa fa-times-circle krik-registration-attend-not hide" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-registration-status-attended-not" data-info="tooltip" data-placement="top" title="Change to Not Attended"></i>';
                  registration_attended_html = registration_attended_html + '<i class="fa fa-check-circle krik-registration-attend" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-registration-status-attended" data-info="tooltip" data-placement="top" title="Change to Attended"></i>';
                }

                return registration_attended_html;
              }
            },
            {
              name: 'status_registration',
              searchable: false,
              className: 'no-selecting',
              render: function(data, type, full, meta) {
                var registration_status = full.status_registration;
                var registration_id = full.id;
                var registration_status_html = null;

                if(registration_status == 'Confirmed') {
                  registration_status_html = '<span class="krik-registration-confirmed">Confirmed</span>';
                } else if(registration_status == 'Waiting') {
                  registration_status_html = '<span class="krik-registration-waiting">Waiting</span>';
                } else if(registration_status == 'Canceled') {
                  registration_status_html = '<span class="krik-registration-canceled">Canceled</span>';
                }

                if(registration_status == 'Waiting') {
                  registration_status_html = registration_status_html + '<i class="fa fa-times-circle krik-registration-cancel" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-registration-status-cancel" data-info="tooltip" data-placement="top" title="Cancel registration"></i><i class="fa fa-check-circle krik-registration-confirm" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-registration-status-confirm" data-info="tooltip" data-placement="top" title="Confirm registration"></i>';
                } else if(registration_status == 'Confirmed') {
                  registration_status_html = registration_status_html + '<i class="fa fa-times-circle krik-registration-cancel" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-registration-status-cancel" data-info="tooltip" data-placement="top" title="Cancel registration"></i>';
                }

                return registration_status_html;
              }
            },
            {
              orderable: false,
              searchable: false,
              className: 'text-center no-selecting',
              render: function(data, type, full, meta) {
                var registration_id = full.id;
                var options = '';
                @if(MODULE_VOUCHER == true)
                    options += '<form method="POST" action="/events/{{ $event_code }}/report-registrations" accept-charset="UTF-8" class="form-horizontal krik-generate-invoice"><input name="_method" type="hidden" value="PUT">{!! csrf_field() !!}<input name="type" type="hidden" value="download-voucher"><input name="id" type="hidden" value="'+ registration_id + '"><i class="fa fa-download krik-invoices-submit" data-info="tooltip" data-placement="top" title="Download voucher"></i></form>';
                    if(full.voucher_sent_ts == null) options += '<i class="fa fa-paper-plane krik-generate-invoice" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-send-voucher" data-info="tooltip" data-placement="top" title="Send voucher"></i>';
                @endif
                @if(MODULE_PROFORMA_INVOICE == true)
                  options += '<form method="POST" action="/events/{{ $event_code }}/report-registrations" accept-charset="UTF-8" class="form-horizontal krik-generate-invoice"><input name="_method" type="hidden" value="PUT">{!! csrf_field() !!}<input name="type" type="hidden" value="tickets"><input name="id" type="hidden" value="'+ registration_id + '"><i class="fa fa-info-circle krik-invoices-submit" data-info="tooltip" data-placement="top" title="Download ticket invoice"></i></form>';
                @endif
                options += '<i class="fa fa-trash-o krik-delete-registration" data-registration-id="'+ registration_id + '" data-toggle="modal" data-target=".krik-registration-delete" data-info="tooltip" data-placement="top" title="Delete registration"></i>';
                return options;
              }
            }
          ],
          language: {
            search: "_INPUT_",
            searchPlaceholder: "Search",
            lengthMenu: "_MENU_",
            select: false,
            processing: "Loading data, please wait...",
            zeroRecords: "No data to display",
            buttons: {
              colvis: 'Columns'
            }
          },
          paging: true,
          pagingType: 'simple_numbers',
          ordering: true,
          order: [[ 8, "desc" ]],
          orderClasses: false,
          stateSave: false,
          // deferRender: true,
          colReorder: true,
          pageLength: 10,
          lengthMenu: [[ 10, 20, 50, 100, -1 ], [ 10, 20, 50, 100, 'All' ]],
          select: {
            style: 'multi',
            selector: 'td:not(.no-selecting)',
          },
          dom: 'Bfrtilp',
          bInfo: true,
          buttons: [
            {
              extend: 'collection',
              text: 'Export',
              buttons: [
                {
                  extend: 'copyHtml5',
                  text: 'Copy (all entries from current page)',
                  exportOptions: {
                    columns: [1,2,3,4,5,6,7,8,9]
                  }
                },
                {
                  extend: 'copyHtml5',
                  text: 'Copy (selected entries from current page)',
                  exportOptions: {
                    modifier: {
                      selected: true
                    },
                    columns: [1,2,3,4,5,6,7,8,9]
                  }
                },
                {
                  extend: 'print',
                  text: 'Print (all entries from current page)',
                  exportOptions: {
                    columns: [1,2,3,4,5,6,7,8,9]
                  }
                },
                {
                  extend: 'print',
                  text: 'Print (selected entries from current page)',
                  exportOptions: {
                    modifier: {
                      selected: true
                    },
                    columns: [1,2,3,4,5,6,7,8,9]
                  }
                },
                {
                  extend: 'excelHtml5',
                  text: 'Excel (all entries from current page)',
                  exportOptions: {
                    columns: [1,2,3,4,5,6,7,8,9]
                  }
                },
                {
                  extend: 'excelHtml5',
                  text: 'Excel (selected entries from current page)',
                  exportOptions: {
                    modifier: {
                      selected: true
                    },
                    columns: [1,2,3,4,5,6,7,8,9]
                  }
                },
                {
                  extend: 'csvHtml5',
                  text: 'CSV (all entries from current page)',
                  exportOptions: {
                    columns: [1,2,3,4,5,6,7,8,9]
                  }
                },
                {
                  extend: 'csvHtml5',
                  text: 'CSV (selected entries from current page)',
                  exportOptions: {
                    modifier: {
                      selected: true
                    },
                    columns: [1,2,3,4,5,6,7,8,9]
                  }
                }
              ]
            },
            'colvis'
          ],
          initComplete: function(settings, json) {
            $('[data-info="tooltip"]').tooltip();
          },
          createdRow: function () {
             table.column(1, { search: 'applied', order: 'applied' }).nodes().each(function (cell, i) {
                cell.innerHTML = i+1;
            });
          }
        });

        table.on('order.dt search.dt column-reorder', function () {
            table.column(1, { search: 'applied', order: 'applied' }).nodes().each(function (cell, i) {
                cell.innerHTML = i+1;
            });
        }).draw();

        $('select[name="krik-report-registrations-table_length"]').on('change', function (){
          $('#choosen-all').prop('checked', false);
        });

        $('#krik-report-registrations-table').on( 'page.dt', function () {
          $('#choosen-all').prop('checked', false);
        });

      </script>
    </div>
    <div class="registration-select">

      {{ Form::open(array('url' => getenv('APP_URL') . '/events/' . $event_code . '/report-registrations', 'name' => 'registration-change-form', 'id' => 'registration-change-form', 'class' => 'form-horizontal status-change-form', 'method'=>'patch', 'files' => true)) }}
        <input type="hidden" name="form_type" value="change_registration">
        <input type="hidden" name="registration_select">
        <select name="selected_option">
          <option value="" disabled selected>Bulk</option>
          <option value="confirmed">Confirmed</option>
          <option value="canceled">Canceled</option>
          <option value="attended">Attended</option>
          <option value="not-attended">Not Attended</option>
          <option value="delete">Delete</option>
        </select>
        {{ Form::submit('Change',array('class' => 'btn btn-change btn-sm', 'name' => 'save')) }}
      {{Form::close()}}
    </div>
  </div>

  <div class="modal krik-registration-delete animated fadeIn" tabindex="0" role="dialog" aria-hidden="true" style="display: none;">
    <div class="bs-example-modal krik-delete-modal">
      <div class="modal modal-danger">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times krik-delete-modal-close"></i></button>
              <h4 class="modal-title">Please confirm delete</h4>
            </div>
            <div class="modal-body">
              <p>This action can not be undone.</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default krik-modal-inline" data-dismiss="modal">Go back</button>
              <button type="submit" class="btn btn-danger" id="krik-delete-submit">Delete registration</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="modal krik-registration-status-confirm animated fadeIn" tabindex="0" role="dialog" aria-hidden="true" style="display: none;">
    <div class="bs-example-modal krik-delete-modal">
      <div class="modal modal-danger">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times krik-delete-modal-close"></i></button>
              <h4 class="modal-title">Please confirm change</h4>
            </div>
            <div class="modal-body">
              <p>Change registration status to Confirmed.</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default krik-modal-inline" data-dismiss="modal">Go back</button>
              <button type="submit" class="btn btn-danger" id="krik-change-submit">Change</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="modal krik-registration-status-cancel animated fadeIn" tabindex="0" role="dialog" aria-hidden="true" style="display: none;">
    <div class="bs-example-modal krik-delete-modal">
      <div class="modal modal-danger">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times krik-delete-modal-close"></i></button>
              <h4 class="modal-title">Please confirm change</h4>
            </div>
            <div class="modal-body">
              <p>Change registration status to Canceled.</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default krik-modal-inline" data-dismiss="modal">Go back</button>
              <button type="submit" class="btn btn-danger" id="krik-change-submit">Change</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="modal krik-registration-status-attended animated fadeIn" tabindex="0" role="dialog" aria-hidden="true" style="display: none;">
    <div class="bs-example-modal krik-delete-modal">
      <div class="modal modal-danger">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times krik-delete-modal-close"></i></button>
              <h4 class="modal-title">Please confirm change</h4>
            </div>
            <div class="modal-body">
              <p>Change registration status to Attended.</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default krik-modal-inline" data-dismiss="modal">Go back</button>
              <button type="submit" class="btn btn-danger" id="krik-change-submit">Change</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="modal krik-registration-status-attended-not animated fadeIn" tabindex="0" role="dialog" aria-hidden="true" style="display: none;">
    <div class="bs-example-modal krik-delete-modal">
      <div class="modal modal-danger">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times krik-delete-modal-close"></i></button>
              <h4 class="modal-title">Please confirm change</h4>
            </div>
            <div class="modal-body">
              <p>Change registration status to Not Attended.</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default krik-modal-inline" data-dismiss="modal">Go back</button>
              <button type="submit" class="btn btn-danger" id="krik-change-submit">Change</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="modal krik-send-voucher animated fadeIn" tabindex="0" role="dialog" aria-hidden="true" style="display: none;">
    <div class="bs-example-modal krik-delete-modal">
      <div class="modal modal-danger">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times krik-delete-modal-close"></i></button>
              <h4 class="modal-title">Please confirm send</h4>
            </div>
            <div class="modal-body">
              <p>Voucher will be send to lead's e-mail address.</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default krik-modal-inline" data-dismiss="modal">Go back</button>
              <button type="submit" class="btn btn-danger" id="krik-voucher-submit">Send</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

</div>
@endsection