@section('scripts')
    {{-- {{ Html::script(config('app.assets_url').'/components/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.js') }} --}}
    {{-- {{ Html::script(config('app.assets_url').'/components/nestable2/dist/jquery.nestable.min.js') }} --}}
    {{ Html::script('//ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js') }}
    <script>
        var trees = {!! $attributes_tree !!};
        $("#detailTemplate").tmpl(trees).appendTo("#dd-empty-placeholder");
        $('.dd').nestable({
            maxDepth: 2,
            collapseBtnHTML: "",
            handleClass: "panel-heading",
            noDragClass: "heading-elements",
            beforeDragStop: function (l, e, p) {
                // console.log(e);
            }
        });

        $('.colorpicker-component').colorpicker();

        $('select[name=type]').change(function () {
            var type_val = $(this).val();
            var closest = $(this).closest('.panel-body');
            (type_val == 'color') ? closest.find('.color').removeClass('hide') : closest.find('.color').addClass('hide')
        });
        $('select[name=parent_id]').change(function () {
            var parent_id = $(this).val();
            (parent_id != 0) ? $('.type_select').removeClass('hide') : $('.type_select').addClass('hide');
        });

        $('#attribute-form-submit').click(function (e) {
            e.preventDefault();
            var formSubmit = $('#' + $(this).data('form'));
            formSubmit.ajaxSubmit({
                beforeSerialize: function () {
                    for (instance in CKEDITOR.instances) {
                        CKEDITOR.instances[instance].updateElement();
                    }
                    return true;
                },
                success: function (data) {
                    location.href = data.redirect;
                },
                error: function (data) {
                    WBForm.showError(formSubmit, data);
                }
            });
        });

        $('.save-attribute').click(function (e) {
            e.preventDefault();
            var attributes = $('.dd').nestable('toArray');
            var data = {attributes: attributes, _token: '{{ csrf_token() }}'};
            $.ajax({
                type: "POST",
                url: '{{route('admin.product.attribute.sort')}}',
                data: data,
                success: function (response) {
                    if (response.code) {
                        successNotice('Thông báo', 'Lưu thứ tự thành công');
                    } else {
                        errorNotice('Lỗi', 'Lưu thứ tự thất bại');
                    }
                }
            });
        });

        $('.btn-remove-item').click(function (e) {
            e.preventDefault();
            var form = $(this).closest('form');
            var url = form.find('input[name=router_destroy]').val().replace(':id', form.find('input[name=id]').val());
            form.ajaxSubmit({
                method: 'DELETE',
                url: url,
                success: function (response) {
                    form.parent('.dd-item').hide('fade').remove();
                    successNotice('Thông báo', "Xóa thành công");
                },
                error: function (response) {
                    errorNotice('Thông báo', "Xóa thất bại");
                }
            });
        });

        $('.btn-update-item').click(function (e) {
            e.preventDefault();
            var form = $(this).closest('form');
            var form_action = form.attr('action', form.attr('action').replace(':id', form.find('input[name=id]').val()));
            form.ajaxSubmit({
                success: function (response) {
                    form.find('.panel-title').html(form.find('input[name=name]').val());
                    successNotice('Thông báo', "Cập nhật thành công");
                },
                error: function (response) {
                    errorNotice('Thông báo', "Cập nhật thất bại");
                }
            });
        });



    </script>
@endsection