@extends('admin.layout')
@section('title','Grupo - Aulas')

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div id="card sombra" class="card card-info card-outline collapsed-card">
                <div class="card-header">
                    <h3 class="card-title">Grupo - Aulas</h3>
                    <div class="card-tools">
                        {{--<button type="button" class="btn btn-tool" data-widget="collapse"><i class="fa fa-plus-circle fa-lg" style="color:#81be4d"></i><a style="color:#81be4d; font-size:20px;">&nbsp;&nbsp;Agregar</a>--}}
                        {{--</button>--}}
                        <button type="button" onclick="onOpen()" class="btn btn-outline-success" data-widget="collapse">
                            Agregar
                        </button>

                    </div>
                    <!-- /.card-tools -->
                </div>
                <!-- /.card-header -->
                <div id="card_categorias" class="card-body">
                    <form id="form">
                        <meta name="csrf-token" content="{{ csrf_token() }}"/>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>Grupo</label>
                                        <select class="form-control" id="group_id" name="group_id">
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>Aula</label>
                                        <select class="form-control" id="classroom_id" name="classroom_id">
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <button type="submit" id="saveBtn" style="cursor: pointer" class="btn btn-success">Guardar
                        </button>
                        <form>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-1"></div>
        <div class="col-md-10">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">

                    </h5>
                    <hr>
                    <table class="table" style="width: 100%;" id="tb-groupClassroom"
                           data-url="{{route('groups.datatable')}}">
                        <thead>
                        <tr class="table table-hover table-bordered nowrap table-sm">
                            <th style="width: 40%;">Grupo</th>
                            <th style="width: 40%;">Aula</th>
                            <th class="disabled-sorting" style="width: 20%;"></th>
                        </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>

            </div>
        </div>
        <div class="col-md-1"></div>
    </div>

@endsection
@section('scripts')
    <script src="{{asset('js/groupClassrooms.js')}}"></script>
@endsection