{% extends 'stela_control/base_list.html' %}
{% load static %}
{% load i18n %}
{% load crispy_forms_tags %}
{% block bsCall %}
    <script>
            
    </script>
{% endblock  %}
{% block title %}
            <h1 class="oxanium mx-4 text-dark pt-3">{% trans "Publishing" %} <i class="fa-solid fa-book"></i></h1>
{% endblock  %}
{% block side_title %}
            <h3 class="oxanium mx-4 d-flex justify-content-end"><b>STELA {% trans "CONTROL DYNAMIC" %} | {% trans "Inventory" %}</b></h3>
{% endblock  %}
{% block topButtons %}
    <div class="col-lg-2 col-md-6">
        <button type="button" class="button button-small fade-in btn-shappire btn-block px-3 mb-3 mx-2 reviews-list-btn" onclick="reviewList()">{% trans "Review List" %} <i class="fa-solid fa-clipboard-list"></i></button>
        <button type="button" class="button button-small fade-in btn-shappire btn-block px-3 mb-3 mx-2 works-list-btn d-none" onclick="pusblishList()">{% trans "Publishing List" %} <i class="fa-solid fa-clipboard-list"></i></button>
    </div>
    <div class="col-lg-2 col-md-6">
        <button type="button" class="button button-small fade-in btn-shappire btn-block px-3 mb-3 mx-2 works-btn" data-bs-toggle="modal" data-bs-target="#inventoryForm" onclick="loadInventoryData('WorksForm','CatalogForm','Inventory','Elements', 'Publishing', 'cke_base_content','','#id_published_date','')">{% trans "New Publishing" %} <i class="fas fa-plus"></i></button>
        <button type="button" class="button button-small fade-in btn-shappire btn-block px-3 mb-3 mx-2 review-btn d-none" data-bs-toggle="modal" data-bs-target="#inventoryForm" onclick="loadInventoryData('WorksReviewsForm','WorksReviewsCommentsForm','Inventory','CommentsWorks', 'Reviews Works', 'cke_base_content', 'cke_formset', '', '')">{% trans "New Review" %} <i class="fas fa-plus"></i></button>
    </div>
    <div class="col-lg-2 col-md-6">
        <button type="submit" data-bs-toggle="modal" data-bs-target="#removeObj" onclick="removeObjRequest()" class="btn btn-danger btn-danger px-3 mb-3 mx-2 delete-product hide" id="delete_btn">{% trans "Remove" %} <i class="fas fa-trash"></i></button>
        <button type="submit" data-bs-toggle="modal" data-bs-target="#removeObj7" onclick="removeObjRequest7()" class="btn btn-danger btn-danger px-3 mb-3 mx-2 delete-product hide" id="delete_revBtn">{% trans "Remove" %} <i class="fas fa-trash"></i></button>
    </div>
{% endblock  %}
{% block listTitle %}
        <h3 class="text-center fw-bold oxanium fs-4 my-2">{% trans "Control List" %}</h3>
{% endblock  %}

{% block thead %}
    <th style="width: 5%;">Id</th>
    <th style="width: 35%;">{% trans "Title" %}</th>
    <th style="width: 20%;" class="text-center">{% trans "Status" %}</th>
    <th style="width: 5%;">{% trans "Image" %}</th>
    <th style="width: 15%;">{% trans "Price" %}</th>
    <th style="width: 15%;">{% trans "View" %}</th>
    <th style="width: 10%;" class="text-center"> <input type="checkbox"  name="" id="parent"></th>          
{% endblock  %} 
{% block tbody %}
    {% for item in stock %}
        <tr>
            <td>{{item.id}}</td>
            <td class=text-link>{{item.title}}</td>
            {% if item.status == 'Active' %}
                <td class="text-center">{% trans "Active" %} <i class="fa-solid fa-circle-check color-green"></i></td>
            {% else %}
                <td class="text-center">{% trans "Inactive" %} <i class="fa-solid fa-exclamation color-red"></i></td>
            {% endif %}
            <td>{{item.image_tag}}</td>
            <td>{{item.price}}</td>
            <td class="my-1"><button class="btn btn-shappire" onclick="loadInventoryData('WorksForm','CatalogForm','Inventory','Elements', 'Publishing', 'cke_base_content','','#id_published_date', '{{item.pk}}')" data-bs-toggle="modal" data-bs-target="#inventoryForm"><i class="fa-solid fa-right-to-bracket"></i></button></td>
            <td class="text-center check-product"><input type="checkbox" class="child" name="product_id[]" value="{{item.id}}" id="delete_product"></td>
        </tr>
    {% endfor %}
{% endblock  %}
{% block errors %}
{% endblock  %}
{% block extratable %}
    <table id="table-reviews" class="mt-2 compact table table-borderless table-hover billing-table d-none">
        <thead>
            <tr class="text-center">
                <th style="width: 5%;">Id</th>
                <th style="width: 35%;">{% trans "Title" %}</th>
                <th style="width: 20%;" class="text-center">{% trans "Status" %}</th>
                <th style="width: 5%;">{% trans "Image" %}</th>
                <th style="width: 15%;">{% trans "Reviews" %}</th>
                <th style="width: 15%;">{% trans "View" %}</th>
                <th style="width: 10%;" class="text-center"> <input type="checkbox"  name="" id="reviewsChecker"></th>   
            </tr>
        </thead>
        <tbody>
            {% for item in reviews %}
                <tr>
                    <td>{{item.id}}</td>
                    <td class=text-link>{{item.title}}</td>
                    {% if item.status == 'Active' %}
                        <td class="text-center">{% trans "Active" %} <i class="fa-solid fa-circle-check color-green"></i></td>
                    {% else %}
                        <td class="text-center">{% trans "Inactive" %} <i class="fa-solid fa-exclamation color-red"></i></td>
                    {% endif %}
                    <td>{{item.image_tag}}</td>
                    <td>{{item.comments.all|length}}</td>
                    <td class="my-1"><button class="btn btn-shappire" onclick="loadInventoryData('WorksReviewsForm','WorksReviewsCommentsForm','Inventory','CommentsWorks', 'Reviews Works', 'cke_base_content', 'cke_formset', '', '{{item.pk}}')" data-bs-toggle="modal" data-bs-target="#inventoryForm"><i class="fa-solid fa-right-to-bracket"></i></button></td>
                    <td class="text-center check-product"><input type="checkbox" class="reviewsCheckControl" name="product_id[]" value="{{item.id}}" id="delete_product"></td>
                </tr>
            {% endfor %}
        </tbody>
            <tfoot>
                
        </tfoot>
    </table>
{% endblock  %}
{% block modals %}
    <div class="modal fade" data-bs-focus="false" id="inventoryForm" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title oxanium" id="staticBackdropLabel">{% trans "New Publishing" %}</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body mid-modal-scroll form-cage d-none">  
                    <form method="post" enctype="multipart/form-data" id="inventoryFormData">
                        <div id="formContent">
                            
                            
                        </div> 
                        <div class="row justify-content-end">
                            <div class="col-lg-3">
                                <button type="submit" class="form-btn-main btn btn-block btn-shappire oxanium form-btn-main d-flex justify-content-center align-items-center">{% trans "Send" %} <i class='bx bxs-send fs-4'></i></button>
                            </div>
                        </div>
                    </form>
                </div>    
                <div class="preload-cage-sendgrid vh-50 fade-in">
                    <h3 class="text-preload-sendgrid fs-6">{% trans "Proccess data, please wait" %}...</h3>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade max-overlay" id="removeObj" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="mb-3">
            <div class="container">
                <div class="row">
                    <div class="col-12"> 
                        <h3 class="text-center alert-title oxanium">{% trans "Are you sure?" %}</h3>
                        <div class="iconhigh">
                            <div id="anicon">

                            </div> 
                        </div>
                        <div id="contentAlert">
                            <p class="text-center text-dark">{% trans "This option cannot be reversed" %}.</p>   
                            <div class="d-flex justify-content-center">
                                <input type="hidden" id="removeData">
                                <button onclick="removeObjComplete()" class="btn btn-danger remove-btn">{% trans "Remove" %}</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            </div>                   
        </div>
        </div>
    </div>
    <div class="modal fade max-overlay" id="removeObj7" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="mb-3">
            <div class="container">
                <div class="row">
                    <div class="col-12"> 
                        <h3 class="text-center alert-title oxanium">{% trans "Are you sure?" %}</h3>
                        <div class="iconhigh">
                            <div id="anicon7">

                            </div> 
                        </div>
                        <div id="contentAlert7">
                            <p class="text-center text-dark">{% trans "This option cannot be reversed" %}.</p>   
                            <div class="d-flex justify-content-center">
                                <input type="hidden" id="removeData7">
                                <button onclick="removeObjComplete7()" class="btn btn-danger remove-btn">{% trans "Remove" %}</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            </div>                   
        </div>
        </div>
    </div>
    <script>
        const worksBtn = document.querySelector('.works-btn')
        const reviewBtn = document.querySelector('.review-btn')
        const reviewListBtn = document.querySelector('.reviews-list-btn')
        const worksListBtn = document.querySelector('.works-list-btn')
        const listReviews = document.getElementById('table-reviews')
        const listPublish = document.getElementById('stela-base')
    </script>
    <script src="https://stelacdn.s3.amazonaws.com/static/js/stela/inventory/functions.js"></script>   
{% endblock  %}