@foreach ($routes as $route)
<li class="map-menu-item">
<a class="alert-link"
data-toggle="collapse"
href="#route-{{ $route->id }}"
aria-expanded="false">
{{ $route->name }}
</a>
<div class="collapse" id="route-{{ $route->id }}">
<div class="card card-body bg-dark border-dark">
{{ $route->moving_time}}
</div>
</div>
<map-sections style="display: block" data-route-id="{{ $route->id }}">
@foreach($route->sections as $section)
<section
data-id="{{ $section->id }}"
data-start-point-latitude="{{ $section->start_point->latitude }}"
data-start-point-longitude="{{ $section->start_point->longitude }}"
data-end-point-latitude="{{ $section->end_point->latitude }}"
data-end-point-longitude="{{ $section->end_point->longitude }}"
data-moving-time="{{ $section->moving_time }}">
</section>
@endforeach </map-sections>
</li>
@endforeach