@include('common.messages')
@include('common.errors')
<div class="mb-3">
    <label class="form-label" for="basic-default-fullname">Servey Name</label>
    <input type="text" name="name" class="form-control" id="basic-default-fullname" placeholder="Servey Name" value="{{ $servey->name ?? old('name') }}" />
</div>
<div class="mb-3">
    <label class="form-label" for="basic-default-fullname">Thank you Message (Display this message on the app after giving rating)</label>
    <textarea name="message" class="form-control" placeholder="Thank You Message">{{ $servey->message ?? old('message') }}</textarea>
</div>

<div class="mb-3">
    <label class="form-label">Configuration</label>
</div>

<div class="row g-3 mb-3">
    <div class="col">
        <label class="form-label">Date Style</label>
    </div>
    <div class="col">
        <div class="col-md">
            <div class="form-check form-check-inline mt-3">
                <input name="date_format" class="form-check-input" type="radio" value="1" id="defaultRadio1" checked> 
                <label class="form-check-label" for="inlineRadio1">dd/mm/yy</label>
            </div>
            <div class="form-check form-check-inline">
                <input name="date_format" class="form-check-input" type="radio" value="2" id="defaultRadio2" >
                <label class="form-check-label" for="inlineRadio2">mm/dd/yy</label>
            </div>
        </div>
    </div>
</div>

<div class="row g-3 mb-3">
    <div class="col">
        <label class="form-label">Clock Style</label>
    </div>
    <div class="col">
        <div class="col-md">
            <div class="form-check form-check-inline mt-3">
                <input name="clock_format" class="form-check-input" type="radio" value="1" id="defaultRadio1" >
                <label class="form-check-label" for="defaultRadio1"> 12 hr </label>
            </div>
            <div class="form-check form-check-inline">
                <input name="clock_format" class="form-check-input" type="radio" value="2" id="defaultRadio2" checked>
                <label class="form-check-label" for="defaultRadio2"> 24 hr </label>
            </div>
        </div>
    </div>
</div>

<div class="row g-3 mb-3">
    <div class="col">
        <label class="form-label">Ask Customer Details</label>
    </div>
    <div class="col">
        <div class="col-md">
            <div class="form-check form-switch mb-3">
                <input class="form-check-input" type="checkbox" id="flexSwitchCheckChecked" name="ask_customer_details" @if(isset($servey)) @if($servey->ask_customer_details ==1) checked @endif @endif>
            </div>
        </div>
    </div>
</div>

<div class="row g-3 mb-3">
    <div class="col">
        <label class="form-label">Advertisements</label>
        <div class="mb-3">
            <label class="form-label">Choose Mode</label>
            {!! Form::select('type', [0 => 'Select Mode'] + $image_types, old('type', (isset($servey->type) && $servey->type) ? $servey->type : ''), ['class' => 'form-control', 'id' => 'image_type']) !!}
        </div>
        <div class="mb-3">
            <label class="form-label">Choose Size</label>
            {!! Form::select('size', [0 => 'Select Size'] + $image_sizes, old('size', (isset($servey->size) && $servey->size) ? $servey->size : ''), ['class' => 'form-control', 'id' => 'image_size']) !!}
        </div>
        <div>
            <div class="table-responsive text-nowrap">
                @php
                    $element_counter = 0;
                @endphp
                <table class="table table-hover dynamic-table--warpper">
                    <thead>
                        <tr>
                            <th>Uploads</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody class="table-border-bottom-0 add-items-list">
                    @php $details = isset($servey->advertisements) ? $servey->advertisements->toArray() : []; @endphp
                    @if(!empty($details))
                                                @foreach($servey->advertisements as $sKey => $item)
                        <tr class="new-item">
                            <input type="hidden" class="advertisement_id" name="items[{{$element_counter}}][advertisement_id]" value="{{$item->id}}">
                            <td>
                                <input class="form-control advertise_file" type="file" name="items[{{$element_counter}}][image]">
                                <label class="mb-2 img-label"><a href="{{url($item->image)}}" target="_blank">{{$item->image}}</a></label>
                            </td>
                            <td>
                            <div class="delete-field-block">
                                <a href="javascript:void(0);"
                                    class="btn btn-remove delete-field btn btn-danger" data-toggle="tooltip"
                                    data-placement="bottom"
                                    title="Delete row">
                                        x
                                </a>
                            </div>
                        </td>
                        </tr>
                        @php
                        $element_counter++;
                        @endphp
                        @endforeach
                    @else
                        <tr class="new-item">
                            <input type="hidden" class="advertisement_id" name="items[{{$element_counter}}][advertisement_id]" value="">
                            <td><input class="form-control advertise_file" type="file" name="items[{{$element_counter}}][image]"></td>
                            <td>
                            <div class="delete-field-block">
                                <a href="javascript:void(0);"
                                    class="btn btn-remove delete-field btn btn-danger" data-toggle="tooltip"
                                    data-placement="bottom"
                                    title="Delete row">
                                        x
                                </a>
                            </div>
                        </td>
                        </tr>
                        @php
                        $element_counter++;
                        @endphp
                    @endif
                    </tbody>
                    <tfoot>
                        <tr>
                            <td colspan="3">
                                <a href="javascript:void(0);" class="btn btn-add add-item btn btn-success" data-toggle="tooltip" data-placement="bottom" title="Add New Department">+</a>
                            </td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>
</div> 
@section('scripts')
<script type="text/javascript">
addItem = function(element, item, element_counter)
{
    var item_template = item.clone();

    item_template.find(".advertisement_id").attr('name', 'items['+element_counter+'][advertisement_id]');
    item_template.find(".advertise_file").attr('name', 'items['+element_counter+'][image]');
    item_template.find('input').val('');
    item_template.find('.img-label').html('');
    item_template.find('input[type="file"]').val('');
    element.append(item_template);
};
var element_counter = "{{ $element_counter }}";

$(document).on('click', '.add-item', function() {
    $('.error').text('');
    var item = $(".add-items-list").children("tr.new-item:last-child");

    var has_error = false;

    // item.find('.item_code').each(function(){
    //     if (!($(this).val() && $(this).val().length)) {
    //         $(this).trigger('focus');
    //         has_error = true;
    //         return false;
    //     }
    //     has_error = false;
    // });

    // item.find('input[type=text]').each(function(){
    //     if (! $(this).val()) {
    //         $(this).trigger('focus');
    //         has_error = true;
    //         return false;
    //     }
    //     has_error = false;
    // });

    /*if (!item.find('input[type=text]').val()) {
        item.find('input[type=text]').trigger('focus');
        has_error = true;
        return false;
    }*/

    $(".error").text("");

    //addItem($(".add-items-list"),element_counter)
    addItem($(".add-items-list"), item, element_counter);
    $(".element_counter").val(element_counter);
    element_counter++;
    
});

$(document).on('click', '.delete-field', function(e) {
    e.preventDefault();
    var item_count = $(this).closest(".add-items-list").children("tr.new-item").length;

    if(item_count > 1)
    {
        if(confirm('Are you sure?'))
        {
            $(this).parents('.new-item').remove();
        }
    }
    else
    {
        $(".error").text("You must have to add at least one item.");
    }
});
</script>
@endsection