@section('title', __('site.page_polls_new_title'))
@section('head')
    <link rel="stylesheet" href="/assets/js/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css">
@endsection
@include('includes/header')
@include('includes/topSite')
<div class="content">

    <div class="row">
        <div class="col-12">
            <div class="d-flex flex-column flex-sm-row justify-content-sm-between align-items-sm-center py-2">
                <div class="flex-grow-1">
                    <h1 class="h3 fw-bold mb-2">
                        {{ __('site.page_polls_new_h1') }}
                    </h1>
                </div>
                <nav class="flex-shrink-0 mt-3 mt-sm-0 ms-sm-3" aria-label="breadcrumb">
                    <ol class="breadcrumb breadcrumb-alt push mb-0">
                        <li class="breadcrumb-item">
                            <a href="{{ route('site.home.r') }}">{{ __('general.top_menu_item_site') }}</a>
                        </li>
                        <li class="breadcrumb-item">
                            <a href="javascript:void(0)">{{ __('site.menu_item_5') }}</a>
                        </li>
                        <li class="breadcrumb-item">
                            <a href="{{ route('site.polls.r') }}">{{ __('site.menu_item_5_sub_6') }}</a>
                        </li>
                        <li class="breadcrumb-item active" aria-current="page">{{ __('site.action_add') }}</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>


    <div class="row">
        <div class="col-md-12">

            <div class="block block-rounded">
                <div class="block-content p-0">
                    <form action="{{ route('site.polls.c.do') }}" method="POST">

                    <div class="pt-3 ps-3 pe-3 mb-3 h-width @if (\Session::has('error_name')) erro-inp @endif  ">
                        <label class="form-label" for="val-name">{{ __('site.page_polls_new_input_1') }}</label>
                        <input type="text" class="form-control @if (\Session::has('error_name')) is-invalid @endif" id="val-name" name="name" value="{{ old('name') }}" autocomplete="off">
                        @if (\Session::has('error_name')) <div id="msgerror_name" class="form-text text-danger"> {!! \Session::get('error_name') !!} </div> @endif
                    </div>

                    <div class="ps-3 pe-3 mb-3 h-width">
                        <label class="form-label" for="example-text-input">{{ __('site.page_polls_new_input_2') }}</label>
                        <select class="form-select" name="multiple">
                            <option value="1" {{ (old('multiple') == '1' ? 'selected' : '') }}>{{ __('site.page_polls_new_input_2_1') }}</option>
                            <option value="0" {{ (empty(old('multiple')) || old('multiple') == '0' ? 'selected' : '') }}>{{ __('site.page_polls_new_input_2_2') }}</option>
                        </select>
                    </div>

                    <div class="ps-3 pe-3 mb-3 h-width">
                        <label class="form-label" for="example-text-input">{{ __('site.page_polls_new_input_3') }}</label>
                        <select class="form-select" name="unique_vote">
                            <option value="1" {{ (empty(old('unique_vote')) || old('unique_vote') == '1' ? 'selected' : '') }}>{{ __('site.page_polls_new_input_3_1') }}</option>
                            <option value="0" {{ (old('unique_vote') == '0' ? 'selected' : '') }}>{{ __('site.page_polls_new_input_3_2') }}</option>
                        </select>
                    </div>

                    <div class="ps-3 pe-3 mb-3 h-width">
                       <label class="form-label" for="example-text-input">{{ __('site.page_polls_new_input_4') }}</label>
                       <select class="form-select endSelect" name="end_select">
                          <option value="0" {{ (empty(old('end_select')) || old('end_select') == '0' ? 'selected' : '') }}>{{ __('site.action_no') }}</option>
                          <option value="1" {{ (old('end_select') == '1' ? 'selected' : '') }}>{{ __('site.action_yes') }}</option>
                       </select>
                    </div>

                    <div class="ps-3 pe-3 mb-3 h-width end_input d-none">
                         <label class="form-label" for="example-text-input">{{ __('site.page_promo_new_form_3') }}</label>
                         <input type="text" class="form-control" id="date_end" name="date_end" autocomplete="off">
                     </div>


                        <div class="mb-3 mt-4 border-bottom border-1 ps-3 pe-3 pb-1"></div>

                    <div class="ps-3 pe-3 mb-3 h-width @if (\Session::has('error_opt0')) erro-inp @endif">
                        <label class="form-label">{{ __('site.page_polls_new_option') }}</label>
                        <input type="text" class="form-control  @if (\Session::has('error_opt0')) is-invalid @endif" name="options[]" value="{{ (old('options') ? old('options')[0] : '') }}" autocomplete="off">
                        @if (\Session::has('error_opt0')) <div id="msgerror_name" class="form-text text-danger"> {!! \Session::get('error_opt0') !!} </div> @endif
                    </div>

                        <div class="ps-3 pe-3 mb-3 h-width @if (\Session::has('error_opt1')) erro-inp @endif">
                            <label class="form-label">{{ __('site.page_polls_new_option') }}</label>
                            <input type="text" class="form-control  @if (\Session::has('error_opt1')) is-invalid @endif" name="options[]" value="{{ (old('options') ? old('options')[1] : '') }}" autocomplete="off">
                            @if (\Session::has('error_opt1')) <div id="msgerror_name" class="form-text text-danger"> {!! \Session::get('error_opt1') !!} </div> @endif
                        </div>

                    <input type="hidden" value="{{ (old('total_chq') ? old('total_chq') : '0') }}" name="total_chq" id="total_chq">

                    <div id="new_chq">
                        @if(old('options') && count(old('options')) > 1)

                            @php
                                $i=0;
                                foreach(old('options') as $field){
                                    if($i > 1){
                                    if(!old('options')[$i]){ $addon = '<div id="msgerror_input_'.$i.'" class="form-text text-danger">'.__('site.site_input_req').'</div>'; }
                                    echo '<div class="ps-3 pe-3 mb-3 h-width addInp-'.$i.'  '.(!old('options')[$i] ? 'erro-inp' : '').'"><label class="form-label">'.__('site.page_polls_new_option').'</label><div class="input-group"> <input type="text" class="form-control '.(!old('options')[$i] ? 'is-invalid' : '').'" name="options[]" autocomplete="off"> <button type="button" id="'.$i.'" class="btn removeInp btn-danger"><i class="fa fa-xmark"></i></button> </div>'.$addon.'</div>';
                                    }
                                    $addon = '';
                                    $i++;
                                }
                            @endphp

                        @endif
                    </div>

                    <div class="mb-3"><a class="ps-3 addInput clickable mt-0">{{ __('site.page_polls_new_add_option') }}</a></div>

                </div>
                <div class="block-content py-2 border-top">
                    <button type="submit" class="btn btn-primary saveBtn">{{ __('site.action_save') }}</button>
                </div>
                </form>
            </div>

        </div>
    </div>

</div>

</div>

</main>


@include('includes/footer')

</div>
<script src="/assets/js/lib/jquery.min.js"></script>
<script src="/assets/js/main.min.js"></script>
<script src="/assets/js/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script>
<script src="/assets/js/plugins/bootstrap-datepicker/locales/bootstrap-datepicker.pt-BR.min.js" charset="UTF-8"></script>
<script>
    $('#date_end').datepicker({
        autoclose: true,
        startDate: '{{ date('d/m/Y') }}',
        endDate: Infinity,
        orientation: "bottom",
        format: 'dd/mm/yyyy',
        language: 'pt-BR',
    });


    $('.addInput').on('click', add);
    $('body').on('click','.removeInp', remove);

    $(".endSelect").change(function(){
        if($(this).val() == 1){
            $('.end_input').removeClass('d-none');
        }else{
            $('.end_input').addClass('d-none');
        }
    });

    function add() {
        var new_chq_no = parseInt($('#total_chq').val()) + 1;
        var new_input = '<div class="ps-3 pe-3 mb-3 h-width addInp-'+new_chq_no+'"><label class="form-label">Opção</label><div class="input-group"> <input type="text" class="form-control" name="options[]" autocomplete="off"> <button type="button" id="'+new_chq_no+'"  class="btn removeInp btn-danger"><i class="fa fa-xmark"></i></button></div></div>';
        $('#new_chq').append(new_input);
        $('#total_chq').val(new_chq_no);
    }

    function remove() {
        var id = $(this).attr('id');
        var last_chq_no = $('#total_chq').val();
        $('.addInp-'+id).remove();
        $('#total_chq').val(last_chq_no - 1);
    }

</script>
</body>
</html>