{% extends 'base.html.twig' %}
{% set titleName = "Dolibarr Products" %}
{% block title %} POWER DATA | {{titleName}} {% endblock %}
{% block page %}{{titleName}}{% endblock %}
{% block breadcrumb %} {% if titleName != "Home" %} {{titleName}} {% endif %} {% endblock %}

{% block content %}
    <!-- Main content -->
    <section class="content">

        <!-- Default box -->
        <div class="card card-solid">
            <div class="card-header">
                <span class="h3">Total imported : {{ count }}</span>
                <button type="button" id="getLastProducts" class="btn   btn-sm mr-1 btn-add-plan btn-warning float-right"  >
                    <i class="fas fa-download" id="importIcon-last"></i>
                    <i class="fas fa-spinner fa-spin mr-2 " id="loadingIcon-last" style="display: none;"></i>
                    Get All Products
                </button>

            </div>
            <!-- /.card-header -->
            <div class="card-body table-responsive p-0" style="height: 63vh;">
                <table class="table table-head-fixed table-striped"> <!-- text-nowrap -->
                    <thead>
                    <tr>
                        <th>Id</th>
                        <th>Action</th>
                        <th>Status</th>
                        <th>Item Existed</th>
                        <th>Item Founded</th>
                        <th>Item Imported</th>
                        <th>Last ID</th>
                        <th>Created At</th>
                        <th>Updated At</th>
                        <th>Import</th>
                    </tr>
                    </thead>
                    <tbody id="listOfPlans">
                    {%for plan in plans %}
                        <tr {{ plan.status == true? 'style="  background: lightgreen;   "': '' }} id="planId-{{ plan.id }}">
                            <td class="text-center">{{ plan.id }}</td>
                            <td class="text-center">{{ plan.action }}</td>
                            <td class="text-center">{{ plan.status == true? '<span class="badge badge-success">Imported</span>': '<span class="badge badge-warning">Not Yet</span>' }}</td>
                            <td class="text-center">{{ plan.existed }}</td>
                            <td class="text-center">{{ plan.founded }}</td>
                            <td class="text-center">{{ plan.qty }}</td>
                            <td class="text-center">{{ plan.lastId }}</td>
                            <td class="text-center">{{ plan.createdAt is not null ? plan.createdAt|date }}</td>
                            <td class="text-center">{{ plan.updatedAt is not null ? plan.updatedAt|date }}</td>
                            <td class="text-center">
                                {% if  plan.status == true and ( plan.existed == plan.founded or  plan.founded == plan.qty or  plan.founded == (plan.qty + plan.existed)  )   %}
                                    <button class="btn btn-info  btn-sm "  >
                                        <i class="fas fa-thumbs-up" id="importIcon-{{ plan.id }}"></i>

                                        Imported</button>
                                {% else %}
                                    <button class="btn btn-info  btn-sm {{ plan.action }}" data-id="{{ plan.id }}" data-action="{{ plan.action }}">
                                        <i class="fas fa-download" id="importIcon-{{ plan.id }}"></i>
                                        <i class="fas fa-spinner fa-spin mr-2 " id="loadingIcon-{{ plan.id }}" style="display: none;"></i>

                                        Import</button>

                                {% endif %}
                            </td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
            <!-- /.card-body -->
        </div>
        <!-- /.card -->

    </section>


{% endblock %}
 {% block script %}
     <script src="{{ asset('assets/js/dolibarr/products/script.js?2025' ) }}"></script>

 {% endblock %}