@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/votes/main.js") }}"></script>
@endsection

@section("pageContent")

<div class="container-fluid">

    <!-- Page Heading -->
    <h1 class="h3 mb-0 text-gray-800">Créer une vote</h1>
    <p class="mb-4">Créer une vote pour un événement </p>
    <form id="addVote" 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="fas fa-vote-yea"></i>
                        Informations générales</h6>
                </div>
                <div class="card-body">
                    <div class="form-row">
                        <div class="form-group col-md-3">
                            <label for="promoter">Promoteur</label>
                            <input type="text" class="form-control" id="promoter" name="promoter">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="event_id">Evènement </label>
                            <select name="event_id" id="event_id" class="form-control">
                                @foreach (App\Models\Event::where("user_id",auth()->user()->id)->get() as $event)
                                <option value="{{ $event->id }}">{{ $event->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group col-md-3">
                            <label for="channel">Canaux</label>
                            <input type="text" class="form-control" name="channel" id="channel">
                        </div>
                    </div>
                    <div class="form-row mb-4 mt-2">
                        <div class="col-md-4">
                            <div class="custom-control custom-radio custom-control-inline">
                                <input type="radio" id="voteState" name="voteState" value="unique"
                                    class="custom-control-input">
                                <label class="custom-control-label" for="voteState">Vote Unique</label>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="custom-control custom-radio custom-control-inline">
                                <input type="radio" id="voteStateUnlimited" name="voteState" value="unlimited"
                                    class="custom-control-input">
                                <label class="custom-control-label" for="voteStateUnlimited">Vote Illimité</label>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="custom-control custom-radio custom-control-inline">
                                <input type="radio" id="voteStateCustom" name="voteState" value="custom"
                                    class="custom-control-input">
                                <label class="custom-control-label" for="voteStateCustom">Vote Personnalisé</label>
                            </div>
                        </div>
                    </div>
                    <div class="form-row" style="display: none" id="voteNumber">
                        <div class="form-group col-md-12">
                            <label for="number">Nombre de vote</label>
                            <input type="number" disabled class="form-control" name="number" id="number">
                        </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 mb-3 mb-2">
                        <div class="col-md-4">
                            <div class="custom-control custom-switch">
                                <input type="checkbox" class="custom-control-input" id="free" name="free">
                                <label class="custom-control-label" for="free">Cette vote est-elle payant ?</label>
                            </div>
                        </div>
                    </div>
                    <div class="form-row" style="display: none" id="votePrice">
                        <div class="form-group col-md-12" >
                            <label for="price">Prix </label>
                            <input type="number" class="form-control" disabled name="price" id="price">
                        </div>
                    </div>
                    <div class="form-row">
                        <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 class="form-group col-md-4">
                            <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-4">
                            <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>
                </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 une vote</span>
            </button>
        </div>
    </form>
</div>

@endsection