{% extends 'admin/admin_base_new.html.twig' %}

{% block breadcrumb %}
    {{ include('admin/Common/_breadcrumb.html.twig', {
        title: 'Ürün Ayarları',
        indexPath: path('admin_product_index'),
        paths: [
            {title: 'Ayarlar'},
            {title: 'Ürün Ekle'}
        ]
    }) }}
{% endblock %}

{% block body %}
    <div class="col-xxl-6">
        <form method="post" id="entityForm">
            <div class="card">
                <div class="card-body">
                    <div class="mb-5">
                        <label class="form-label" for="productCode">Ürün Kodu</label>
                        <input type="text" id="productCode" class="form-control form-control-solid"
                               name="product_code" placeholder="Ürün Kodu"/>
                    </div>
                    <hr class="border">
                    <div id="productUnits">
                        <div data-repeater-list="product_units">
                            <div data-repeater-item>
                                <div class="form-group row align-items-center mb-3">
                                    <div class="col-md-3">
                                        <label class="form-label">Ürün Birimi:</label>
                                        <input type="text" class="form-control form-control-solid" placeholder="Ürün birimi giriniz" aria-label="Birim" />
                                    </div>
                                    <div class="col-md-4">
                                        <a href="javascript:void(0);" data-repeater-delete class="btn btn-sm btn-light-danger mt-3 mt-md-8">
                                            <i class="ki-duotone ki-trash fs-5">
                                                <span class="path1"></span>
                                                <span class="path2"></span>
                                                <span class="path3"></span>
                                                <span class="path4"></span>
                                                <span class="path5"></span>
                                            </i> Sil
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="form-group mt-5">
                            <a href="javascript:void(0);" data-repeater-create class="btn btn-light-primary">
                                <i class="ki-duotone ki-plus fs-3"></i> Ekle
                            </a>
                            <button type="submit" class="btn btn-light-success ms-3">
                                <i class="ki-duotone ki-disk fs-3">
                                    <span class="path1"></span>
                                    <span class="path2"></span>
                                </i> Kaydet
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
{% endblock %}

{% block javascripts %}
    <script src="{{ asset('assets/theme/plugins/custom/formrepeater/formrepeater.bundle.js') }}"></script>
    <script>
        $('#productUnits').repeater({
            initEmpty: false,
            defaultValues: {
                'text-input': 'foo'
            },
            show: function () {
                $(this).slideDown();
            },
            hide: function (deleteElement) {
                $(this).slideUp(deleteElement);
            }
        });
    </script>
{% endblock %}