@extends('_partials.master')
@section('page_title', 'Attribute Values')
@section('page_heading', 'Attribute Values')

@section('content')

<section>
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Attribute Name : <strong> {{ $attribute_name }} </strong></h4>
                </div>
                <div class="card-content">
                    <div class="card-body">
                        @foreach($attributes as $attribute)
                            <div class="form-row-card">
                                <div class="form-body">
                                    <div class="row">
                                        <div class="col-md-10">

                                            <form method="post" action="{{ route('attribute.updatevalue', $attribute->id) }}" class="form" novalidate="" data-parsley-validate="" autocomplete="off">
                                                @csrf
                                                <div class="row">
                                                    <div class="form-group col-md-5">
                                                        <label for="value_string">Value String *</label>
                                                        <input type="text" class="form-control" placeholder="Value" name="value_string" value="{{ $attribute->value_string }}" data-parsley-maxlength="255" required data-parsley-required-message="Please enter Value String" />
                                                    </div>
                                                    <div class="form-group col-md-5">
                                                        <label for="sku_slug">Sku Slug *</label>
                                                        <input type="text" class="form-control" placeholder="SKU Slug" name="sku_slug" value="{{ $attribute->sku_slug != '' ?  $attribute->sku_slug :$attribute->attribute_id .'-'. $attribute->id }}" data-parsley-maxlength="255" required data-parsley-required-message="Please enter SKU Value" />
                                                    </div>
                                                    <div class="form-group col-md-2">
                                                        <button type="submit" style="margin-top: 25px;" class="btn btn-info mr-1">
                                                            <i class="la la-check-square-o"></i> Update
                                                        </button>
                                                    </div>
                                                </div>
                                                <input type="hidden" name="attribute_id" value="{{ $attribute->attribute_id }}" />
                                            </form>

                                        </div>
                                        <div class="col-md-2">
                                            <div class="form-group col-md-12">
                                                {!! Form::open(array(
                                                        'route' => array('attribute.deletevalue', $attribute->id),
                                                        'method' => 'delete',
                                                        'class'=>'delSwalForm',
                                                )) !!}
                                                <button type="submit" style="margin-top: 25px;" class="btn delSwalSingle btn-icon btn-danger mr-1">
                                                    <i class="la la-close"></i> Delete
                                                </button>
                                                <input type="hidden" name="attribute_id" value="{{ $attribute->attribute_id }}" />
                                                {!! Form::close() !!}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <hr>
                            </div>
                        @endforeach

                        <form method="post" action="{{ route('attribute.storevalue')}}" class="form" novalidate="" data-parsley-validate="" autocomplete="off">
                            @csrf
                            <div class="form-body">
                                <div class="row">
                                    <div class="form-group col-md-4">
                                        <label for="attribute_name">Value String *</label>
                                        <input type="text" class="form-control" placeholder="Value String" name="value_string" data-parsley-maxlength="255" required data-parsley-required-message="Please enter Value String" />
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label for="attribute_type">Sku Slug *</label>
                                        <input type="text" class="form-control" placeholder="Sku Slug" name="sku_slug" data-parsley-maxlength="255" required data-parsley-required-message="Please enter SKU Value" />
                                    </div>
                                    <div class="form-group col-md-4">
                                        <button type="submit" style="margin-top: 25px;" class="btn btn-info mr-1">
                                            <i class="la la-check-square-o"></i> Create
                                        </button>
                                    </div>
                                    <input type="hidden" name="attribute_id" value="{{ $id }}" />
                                </div>
                            </div>
                        </form>

                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@stop

@push('page_scripts')
<script type="text/javascript">
    // SweetAlert in DELETE BUTTONS on attribute page
    $('body').on('click', '.delSwalSingle', function(e) {
        e.preventDefault();
        swal({
            title: 'Are you sure?',
            text: "You won't be able to revert this operation.",
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3c9fce',
            cancelButtonColor: '#e86256',
            confirmButtonText: 'Yes, delete it',
            cancelButtonText: 'No, cancel'
        }).then((result) => {
            if (result.value) {

                var $this = $(this);
                $.ajax({
                    url: $this.closest("form.delSwalForm").attr('action'),
                    type: "DELETE",
                    contentType: 'application/json',
                    data: {
                        '_token': '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        if (response.status) {
                            $this.closest(".form-row-card").fadeOut("normal", function() {
                                $(this).remove();
                            });

                            swal({
                                // position: 'top-end',
                                type: 'success',
                                title: response.message,
                                showConfirmButton: true,
                                timer: 2500
                            })
                        }
                    }
                });
            }
        })
    });
</script>
@endpush