
<div class="row">
    <div class="panel panel-default"  style=" width:100%;border-top: 2px solid #27ad5e;">

        {% if attributes['message'] %}

        <p class="lead required"> {{ attributes['message'] }}</p>

        {% elseif attributes.result %}

        <form id="myform" >
            {% for attribute in attributes.result %}

                <div class="col-sm-4 form-group">




                    {% if attribute.required %}

                        <label class="required text-danger" style="font-size: 10px;height: 25px;display: block;vertical-align: bottom;" >{{ attribute.name }}</label>

                    {% else %}

                        <label style="font-size: 10px;height: 25px;display: block;vertical-align: bottom;">{{ attribute.name }}</label>

                    {% endif %}

                    {%  if  attribute.values|length > 100  and  not attribute.name| split(' ') %}

                        <a href="#"  id="{{ attribute.name }}" style=" z-index: 9999;   height: 40px;
    display: block;" class="eslestir" id2="{{ attribute.attribute_id }}" data-type="typeaheadjs" attr-id="{{ attribute.attribute_id }}"
                           data-pk="{{ product_id }}"  data-value="{% if  attribute.name in s_attr_name %}{% for selectedattr in selected_attributes %}{% if (selectedattr.name==attribute.name) %}{{ selectedattr.value}}{% endif %}{% endfor %}{% endif %}"
                           data-emptytext="Ürün özellik eşleştir"
                           data-url="index.php?route=entegrasyon/category/save_attribute_value&code=n11&market_option_id={{ attribute.attribute_id }}&category_id={{ category_id }}&{{ token_link }}"
                           data-title="Lütfen seçenek değeri arayın"></a>
                        <input type="hidden" name="{{ attribute.name }}" value="{% if  attribute.name in s_attr_name %}{% for selectedattr in selected_attributes %}{% if (selectedattr.name==attribute.name) %}{{ selectedattr.value}}{% endif %}{% endfor %}{% endif %}">

                    {% else %}

                        <select name="{{attribute.name}}" data-live-search="true" class="select2 form-control attribute">

                            <option value='0'>==Seçiniz==</option>
                            {% if attribute.name == 'Marka' %}
                                {% if 'Diğer' in s_attr %}

                                    <option selected="selected"  value='Diğer'>Diğer</option>

                                {% else %}
                                    <option  value='Diğer'>Diğer</option>

                                {% endif %}


                            {% endif %}

                            {% for value in attribute.values %}

                                {% if manufacturer == value.name and attribute.name == 'Marka'   %}
                                    <option selected="selected" value='{{ value.name }}'>{{ value.name }}</option>

                                {% endif %}
                                {% if value.name |replace({"''":'x_x'}) in s_attr %}
                                    <option selected="selected" value='{{ value.name |replace({"''":'x_x'}) }}'>{{ value.name}}</option>

                                {% else %}
                                    <option value="{{ value.name |replace({"''":'x_x'}) }}">{{ value.name}}</option>
                                {% endif %}
                            {% endfor %}

                        </select>

                    {% endif %}

                </div>

            {% endfor %}
        </form>




    </div>
    <div class="panel-footer">

        <div class="form-group">

            <button id="btn-send" class="btn btn-lg btn-primary btn-block">Kaydet</button>


        </div>

    </div>

</div>
{% else %}

    <p style="margin-top: 10px " class="text-info">Bu ürünün bulunduğu kategori için herhangi bir zorunlu N11 özelliği bulunmamaktadır. Ürünlerinizi Gönderebilirsiniz.</p>

        {% endif %}
</div>

<span class="hidden"  id="attrid" ></span>
<span class="hidden"   id="attrname" ></span>


<script>

    $('.select2').selectpicker();

    $('#btn-send').on('click',function () {

        var attributes=$('#myform').serializeArray();

        var product_id='{{ product_id}}';

        $.post('index.php?route=entegrasyon/genel/save_setting&code=n11&controller={{ controller }}&{{ token_link }}&product_id='+product_id,{pk:+'{{  primary_id}}',name:'selected_attributes',value:attributes},
            function(datas){


                $.toast({heading: 'Başarılı',text: 'Ürün Özelliği Güncellendi!', position: 'top-right',loader: false,allowToastClose: false,showHideTransition: 'slide',icon: 'success'});
                $('#btn-send').html("Güncellendi");
                $('.n11_default_category_attributes_container').empty().hide('slow');



            },'JSON');
    })
</script>

<script>

    var attrid=null;
    $('.eslestir').on('click',function (event){

        $('#attrid').text($(this).attr('attr-id'));
        $('#attrname').text($(this).attr('id'));

        attrid=$(this).attr('attr-id');
        //   alert( $('#attrid').text());



    })


    $('.eslestir').editable({
        mode: 'inline',

        typeahead: {

            limit: 200,
            remote: {
                url:"index.php?route=entegrasyon/category/attribute_search&filter_category_id={{ category_id }}&filter_code=n11&{{ token_link }}",
                replace: function (url, query) {
// if ($('#school').val()) {
                    url += "&filter_name="+$('.tt-query').val()+"&filter_attribute_id="+$('#attrid').text();
//   }
                    return url;
                }
            },
            displayKey: 'id',
            valueKey: 'name',
            display: function (item) {
                return item.name
            },

        }, success: function (json, newValue) {

            if (!json['status']) {

                $.toast({
                    heading: 'Hata',
                    text: json['message'],
                    position: 'top-right',
                    loader: true,
                    allowToastClose: false,
                    showHideTransition: 'slide',
                    icon: 'warning'
                });


            } else {

                $("input[name="+$('#attrname').text()+"]").val(newValue);

                $.toast({
                    heading: 'Başarılı',
                    text: json['message'],
                    position: 'top-right',
                    loader: true,
                    allowToastClose: false,
                    showHideTransition: 'slide',
                    icon: 'success'
                });

            }

        }
    });



    $.fn.editableform.buttons =
        '<button type="submit" class="btn btn-primary btn-sm editable-submit">' +
        '<i class="fa fa-check"></i>' +
        '</button>' +
        '<button type="button" class="btn btn-danger btn-sm editable-cancel">' +
        '<i class="fa fa-times"></i>' +
        '</button>';


</script>