@extends('layouts.layout')

<style>
html,
body,
.intro {
  height: 100%;
}

table td,
table th {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

html {
  height: 100%;
  margin: auto;
}

.card {
  border-radius: .5rem;
}
</style>
@section('content')    
<div>
    <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-6 col-xxl-4 mb-5">
                    <div class="card bg-light border-0 h-100" style="margin-top: 40px;">
                        <div class="card-body text-center p-4 p-lg-5 pt-0 pt-lg-0">
                            <div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4" ><img src="{{$team->logo_path}}" style="width:64px;height:64px;" alt="leaguelogo"></div>
                                <h2 class="fs-4 fw-bold">{{$team->name}}</h2>
                                <p class="mb-0">
                                    Leggyakrabban előforduló eredmények
                                        @foreach($most_frequent as $most)
                                            <p>{{$most}}</p>
                                        @endforeach
                                </p>
                            </div>
                        </div>
                    </div>
                </div>


            <div class="row justify-content-center">
                <div class="col-12">
                    <div class="card" style=" max-height: 700px;overflow: overlay; margin-top: 30px;">
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-hover mb-0" id="dtBasicExample" class="table table-striped table-bordered" cellspacing="0" width="100%">
                                    <thead>
                                    <tr>
                                        <th scope="col">Hazai csapat</th>
                                        <th scope="col">Vendég csapat</th>
                                        <th scope="col">Végeredmény</th>
                                        <th scope="col">Szezon</th>
                                        <th scope="col">Forduló</th>
                                        <th scope="col">Odds</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($matches as $match)
                                        <tr>
                                            <td class="localteam">{{$match->localTeam->data->name}}<img style="width:20px;height:auto" src="{{$match->localTeam->data->logo_path}}"> </td>
                                            <td class="visitorteam">{{$match->visitorTeam->data->name}} <img style="width:20px;height:auto" src="{{$match->visitorTeam->data->logo_path}}"></td>
                                            <td class="finalscore">{{$match->scores->localteam_score}}-{{$match->scores->visitorteam_score}}</td>
                                            <td class="season">{{$match->season->data->name}}</td>              
                                            <td class="round">
                                                @if(property_exists($match, 'round'))
                                                {{$match->round->data->name}}
                                                @else
                                                Nem bajnokság
                                                @endif
                                                </td>
                                            <td class="Odds">
                                                @if($match->flatOdds->data != null)
                                                    @foreach($match->flatOdds->data as $threeway_odds)                                                  
                                                            @if($threeway_odds->market_id == 1)
                                                                @isset($threeway_odds->odds[0])
                                                                    @if($threeway_odds->odds[0]->winning == true)
                                                                        <span style="color: #41a825; font-size: 18px;"> Hazai: {{$threeway_odds->odds[0]->value}}</span>
                                                                    @else
                                                                        Hazai: {{$threeway_odds->odds[0]->value}}
                                                                    @endif
                                                                @endisset

                                                                @isset($threeway_odds->odds[1])
                                                                    @if($threeway_odds->odds[1]->winning == true)
                                                                        <span style="color: #41a825; font-size: 18px;"> Döntetlen: {{$threeway_odds->odds[0]->value}}</span>
                                                                    @else
                                                                        Döntetlen: {{$threeway_odds->odds[1]->value}}
                                                                    @endif
                                                                @endisset
   
                                                                @isset($threeway_odds->odds[2])
                                                                    @if($threeway_odds->odds[2]->winning == true)
                                                                        <span style="color: #41a825; font-size: 18px;"> Vendég: {{$threeway_odds->odds[2]->value}}</span>
                                                                    @else
                                                                        Vendég: {{$threeway_odds->odds[2]->value}}
                                                                    @endif
                                                                @endisset
                                                            @endif
                                                    @endforeach
                                                @else
                                                    Hiányzó adat
                                                @endif
                                            </td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <a style="margin-top:19px;margin-bottom: 19px;" type="button" href="/" class="btn btn-primary">Vissza</a>
        </div>
    </div>
</div>
    




<script>
    $(document).ready(function () {
    $('#dtBasicExample').DataTable();
    $('.dataTables_length').addClass('bs-select');
    });
</script>
@endsection