@extends("promoters.layout")
@section("css")
    <link rel="stylesheet" href="{{ asset("assets/css/bootstrap-datepicker3.min.css") }}">
@endsection
@section("js")
    <script src="{{ asset("assets/js/bootstrap-datepicker.min.js") }}"></script>
    <script src="{{ asset("assets/js/events/main.js") }}"></script>
@endsection

@section("pageContent")

<div class="container-fluid">

    <!-- Page Heading -->
    <h1 class="h3 mb-0 text-gray-800">Créer votre tombola</h1>
    <p class="mb-4">Créer votre tombola en quelques étapes.</p>
    <form id="addEvent" method="post" class="row">

        <div class="col-lg-12">
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary text-uppercase"> <i class="fa fa-calendar"></i>
                        Informations
                        générales</h6>
                </div>
                <div class="card-body">
                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label for="name">Nom </label>
                            <input type="text" class="form-control" name="name" id="name" maxlength="22">
                        </div>

                        {{-- <div class="form-group col-md-4">
                            <label for="event_type_id">Type</label>
                            <select name="event_type_id" id="event_type_id" class="form-control">
                                @foreach (App\Models\EventType::all() as $eventType)
                                    <option value="{{ $eventType->id }}">{{ $eventType->label }}</option>
                                @endforeach
                            </select>
                        </div> --}}
                         <div class="form-group col-md-4">
                            <label for="status">Status</label>
                            <select name="status" id="status" class="form-control">
                                {{-- @foreach (["En cours", "Terminé", "Coming soon"] as $status) --}}
                                    <option value="En cours">En cours</option>
                                {{-- @endforeach --}}
                            </select>
                        </div>
                        <div class="form-group col-md-4">
                            <label for="country">Pays</label>
                            <select name="country" id="country" class="form-control">
                                @foreach (config("app.countries") as $country)
                                    <option value="{{ $country }}">{{ $country }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-md-12">
                            <label for="description">Description</label>
                            <textarea class="form-control" id="description" name="description" rows="3"></textarea>
                        </div>

                    </div>
                    <div class="form-row">


                        <div class="form-group col-md-3">
                            <label for="date_since">Date début</label>
                            <input type="text" class="form-control datepicker" id="date_since" name="date_since" value="{{ date("Y-m-d") }}">
                        </div>
                        <div class="form-group col-md-3">
                            <label for="date_end">Date fin</label>
                            <input type="text" class="form-control datepicker" id="date_end" name="date_end" value="{{ date("Y-m-d") }}">
                        </div>
                        <div class="form-group col-md-3">
                            <label for="date_draw">Date du tirage</label>
                            <input type="text" class="form-control datepicker" id="date_draw" name="date_draw" value="{{ date("Y-m-d") }}">
                        </div>
                        <div class="form-group col-md-3">
                            <label for="date_draw">Délai de retrait des lots</label>
                            <input type="text" class="form-control datepicker" id="date_draw" name="date_draw" value="{{ date("Y-m-d") }}">
                        </div>

                    </div>
                </div>
            </div>

        </div>
        <div class="col-lg-12">
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary text-uppercase"> <i class="fa fa-money"></i>
                        Lots à gagner </h6>
                </div>
                <div class="card-body">
                    <div class="form-row">
                        <div class="form-group col-md-4">
                            <label for="lot1">Lot 1</label>
                            <input type="text" class="form-control" id="lot1" name="lot1"
                                placeholder="Intitulé du lot 1">
                        </div>
                        <div class="form-group col-md-4">
                            <label for="lot2">Lot 2</label>
                            <input type="text" class="form-control" id="lot2" name="lot2"
                                placeholder="Intitulé du lot 2">
                        </div>
                        <div class="form-group col-md-4">
                            <label for="lot3">Lot 3</label>
                            <input type="text" name="lot3" class="form-control" id="lot3"
                                placeholder="Intitulé du lot 3">
                        </div>

                    </div>
                    <div class="form-row">

                        <div class="custom-file col-md-4 mr-6">
                            <label for="photo" class="custom-file-label">Photo du lot 1</label>
                            <input type="file" class="custom-file-input" id="photo" name="photo" >
                        </div>
                        <div class="custom-file col-md-4 mr-6 ">
                            <input type="file" class="custom-file-input" id="photo">
                            <label class="custom-file-label" name="photo" for="photo">Photo du lot 2</label>
                        </div>
                        <div class="custom-file col-md-4 mr-6">
                            <label for="photo" class="custom-file-label">Photo du lot 3</label>
                            <input type="file" class="custom-file-input" id="photo" name="photo" >
                        </div>
                    </div>

                </div>
            </div>

        </div>

        <div class="col-lg-12">
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary text-uppercase"> <i class="fa fa-image"></i> visuelle</h6>
                </div>
                <div class="card-body">
                    <div class="form-row">
                        <div class="custom-file col-md-6 mr-4">
                            <label for="banner" class="custom-file-label">Bannière de la tombola</label>
                            <input type="file" class="custom-file-input" id="banner" name="banner" >
                        </div>
                        <div class="custom-file col-md-5 ">
                            <input type="file" class="custom-file-input" id="photo">
                            <label class="custom-file-label" name="photo" for="photo">Photo de la tombola</label>
                        </div>
                    </div>

                </div>
            </div>
            @csrf
        </div>

        <div class="col-12">
            <button type="submit" class="btn btn-primary btn-icon-split mb-4">
                <span class="icon text-white-50">
                    <i class="fas fa-arrow-right"></i>
                </span>
                <span class="text">Créer tombola</span>
            </button>
        </div>
    </form>
</div>

@endsection