Tuesday, March 14, 2017

Laravel scheduling app

I am trying to make a front end time table where you can click on a cell for example in row 8:30, and then a modal pops up and you can pick until when you will reserve the term going from 9:00 onward in half hour increments.

Reserving only one term works fine, as I can pick the variable directly from a loop, however I am in doubt as how to forward it to modal.

Controller:

public function index()
{
    $scheduler_start_time = Carbon::createFromTime(6, 0, 0);
    $scheduler_end_time = Carbon::createFromTime(20, 0, 0);

    $equipment = Equipment::with('reservations', 'reservations.user')->get();
    return view('landing', compact('equipment', 'scheduler_start_time', 'scheduler_end_time'));
}

Table loop in front-end:

@while($scheduler_start_time < $scheduler_end_time)
    <tr>
        <td></td>
        @foreach($equipment as $instrument)
            <td>
                <a href="#" style="display: block;"
                   data-href=""
                   data-toggle="modal" data-target="#confirm-reservation">
                    @if(!$instrument->reservations->where('reserved_from', $scheduler_start_time)->isEmpty())
                        
                    @else
                        &nbsp;
                    @endif
                </a>
            </td>
        @endforeach
        <?php $scheduler_start_time->addMinutes(30) ?>
    </tr>
@endwhile

Modal:

<!-- Modal -->
<div class="modal fade" id="confirm-reservation" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                New reservation
            </div>
            <div class="modal-body">
                Are you sure you want to add this reservation?
                <br><br>
                <div class="dropdown">
                    <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Reserve until
                        <span class="caret"></span></button>
                    <ul class="dropdown-menu">
                        <!-- *CLARIFICATION -->
                        <li><a href="#"></a></li>
                    </ul>
                </div>

            </div>
            <div class="modal-footer">
                <a class="btn btn-primary btn-ok">Yes</a>
                <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
            </div>
        </div>
    </div>
</div>
<script>
    $('#confirm-reservation').on('show.bs.modal', function(e) {
        $(this).find('.btn-ok').attr('href', $(e.relatedTarget).data('href'));
    });
</script>

Where it says *Clarification: I was trying in small steps and getting at least the value on which I clicked, but I am always getting the final time 20:00h



via Norgul

Advertisement