<?php $this->push('styles')?><link rel="stylesheet" href="<?=module_asset('sports','css/sports.css')?>"><?php $this->endPush()?>
<div class="d-flex justify-content-between align-items-center mb-3">
    <h4 class="mb-0"><i class="fas fa-futbol me-2"></i><?=lang('sports.matches')?></h4>
    <?php if(auth_can('sports.manage')):?><a href="/sports/matches/create" class="btn btn-primary btn-sm"><i class="fas fa-plus me-1"></i>New Match</a><?php endif;?>
</div>
<div class="card mb-3"><div class="card-body py-2"><form class="row g-2" data-filter-table="matches-table">
<div class="col-md-3"><select name="sport_id" class="form-select form-select-sm" onchange="DataTableHelper.reload('matches-table')"><option value="">All Sports</option><?php foreach($sports as $s):?><option value="<?=$s['id']?>"><?=e($s['name_en'])?></option><?php endforeach;?></select></div>
<div class="col-md-3"><select name="status" class="form-select form-select-sm" onchange="DataTableHelper.reload('matches-table')"><option value="">All Status</option><?php foreach(['scheduled','in_progress','completed','postponed','cancelled'] as $st):?><option value="<?=$st?>"><?=ucfirst(str_replace('_',' ',$st))?></option><?php endforeach;?></select></div>
</form></div></div>
<div class="card"><div class="card-body">
<table id="matches-table" class="table table-striped table-hover w-100" data-url="/api/sports/matches/datatable"
    data-columns='[{"data":"match_number","title":"Match#"},{"data":"sport_name","title":"Sport"},{"data":"home_name","title":"Home"},{"data":"score","title":"Score"},{"data":"away_name","title":"Away"},{"data":"match_date","title":"Date"},{"data":"facility_name","title":"Venue"},{"data":"status_badge","title":"Status","orderable":false},{"data":"actions","title":"","orderable":false}]'></table>
</div></div>
<?php $this->push('scripts')?><script src="<?=module_asset('sports','js/sports.js')?>"></script><script>document.addEventListener('DOMContentLoaded',()=>DataTableHelper.init('matches-table'));</script><?php $this->endPush()?>