<!-- Archivo: CZM_AlternatorModel.html -->
<!-- Ruta: src\templates\Operaciones\Ingenieria\PE\PE_DM\CZM_AlternatorModel.html -->
<!-- Lenguaje: HTML -->



{% extends "layout.html" %}

{% block title %}{{ _('Modelos de Generadores') }}{% endblock %}

{% block content %}
<!-- Conexion de CSS CZM_AlternatorModel -->
<link rel="stylesheet" href="{{ url_for('static', filename='css/Operaciones/Ingenieria/PE/PE_DM/CZM_AlternatorModel.css') }}">

<!-- DataTables CSS (Última versión estable) -->
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css">

<!-- Botones de DataTables (Última versión estable) -->
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.3.6/css/buttons.dataTables.min.css">

<!-- FontAwesome (para iconos) -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">



<main class="page">
    <section class="clean-block clean-form dark">
        <div class="container">
            <div class="block-heading">
                <h2 class="text-info">{{ _(' Modelos de Generadores ') }}</h2>
                <p>{{ _(' Bienvenido a modelos de generadores de IGSA ') }}</p>
            </div>

            <!-- Contenedor principal del formulario -->
            <div class="multi-step-container">
                
                <!-- SECCIONES -->
                <form id="generadoresForm" class="form-multipaso">
                    <!-- TEXTO PRINCIPAL FORMULARIO -->
                        <div class="form-step active">
                            <h3 class="form-step-title">{{ _(' DATOS GENERALES ') }}</h3>
                            
                            <!-- Sección: 1 DATOS GENERALES -->
                            <div class="form-row">                            
                                <!-- CAMPO MODELO -->
                                <div class="form-group">
                                    <label for="alternatormodel" class="required">{{ _(' Modelo ') }}</label>
                                    <input  type="text" 
                                            id="alternatormodel"
                                            name="alternatormodel"
                                            class="form-control"
                                            placeholder=""                                        
                                            required
                                        >
                                </div>

                                <!-- CAMPO MARCA -->
                                <div class="form-group">
                                    <label for="alternatorbrandid" class="required">{{ _(' Marca ') }}</label>
                                    <select id="alternatorbrandid" name="alternatorbrandid" class="form-select">
                                        <option selected disabled value="">{{ _(' Seleccione una opcion ') }}</option>
                                        <option value="1">{{ _(' Stamford ') }}</option>
                                        <option value="2">{{ _(' Leroy ') }}</option>
                                        <option value="3">{{ _(' Weg ') }}</option>
                                    </select>
                                </div>

                                 <!-- CAMPO PRECIO -->
                                 <div class="form-group">
                                    <label for="alternatorpricing" class="required">{{ _('Precio') }}</label>
                                    <input  type="text" 
                                            id="alternatorpricing"
                                            name="alternatorpricing"
                                            class="form-control"
                                            placeholder=""                                        
                                            required
                                    >
                                </div>
                            </div>
                        
                            <!-- Sección: 2 DATOS TECNICOS -->
                            <div class="section-interruptores">
                                <h4 class="section-subtitle">{{ _(' Datos Técnicos ') }}</h4>
                                <div class="form-row">
                                    <div class="form-group">
                                        <!-- CAMPO FICHA TECNICA -->
                                        <label for="technicalsheet" class="required">{{ _(' Ficha técnica ') }}</label>
                                        <div class="input-group">
                                            <input type="file" 
                                                class="form-control" 
                                                id="technicalsheet" 
                                                name="technicalsheet"
                                                aria-describedby="inputGroupFileAddon">
                                        </div>
                                        <small class="form-text text-muted">{{ _('Seleccione el archivo de la ficha técnica') }}</small>
                                    </div>
                                </div>                              
                            </div>                        
                            
                            <!-- BOTON DE GUARDAR -->
                            <div class="form-actions" style="margin-top: 20px; text-align: right;">
                                <button type="submit" class="btn btn-primary">
                                    {{ _(' Guardar ') }}
                                </button>
                            </div>
                        </div>
                        
                        <!-- Sección: 4 CONFIGURACION -->
                        <div class="section-interruptores">
                            <h4 class="section-subtitle">{{ _(' Configuracion ') }}</h4>
                            <div class="form-row">
                                <!-- CAMPO DATATABLE -->
                                <div class="form-group">
                                    <div id="loading-indicator" style="display: none; text-align: center; margin-top: 10px;">
                                        <span class="spinner-border text-primary" role="status" aria-hidden="true"></span>
                                        <span>{{ _('Cargando...') }}</span>
                                    </div>

                                    <!-- Botones de acción -->
                                    <div class="d-flex justify-content-between mb-3">
                                        <button type="button" class="btn btn-secondary dm-btn-Secundario" onclick="history.back();">
                                            <i class="fas fa-arrow-left"></i> {{ _('Regresar') }}
                                        </button>
                                    </div>
                                    
                                    <!-- Tabla para listar las compañías -->
                                    <table id="ApprovalAccessDistributorsTable" class="table table-striped">
                                        <thead>
                                            <tr>
                                                <th>{{ _('Voltaje') }}</th>
                                                <th>{{ _('Potencia') }}</th>
                                                <th>{{ _('Power_kw') }}</th>
                                                <th>{{ _('Power_kva') }}</th>
                                                <th>{{ _('Descripcion') }}</th>
                                                <th>{{ _('Editar') }}</th>
                                            </tr>
                                            <tr>
                                                <th><input type="text" placeholder="{{ _('Buscar Voltaje') }}"></th>
                                                <th><input type="text" placeholder="{{ _('Buscar Potencia') }}"></th>
                                                <th><input type="text" placeholder="{{ _('Buscar Powerkw') }}"></th>
                                                <th><input type="text" placeholder="{{ _('Buscar Powerkva') }}"></th>
                                                <th><input type="text" placeholder="{{ _('Buscar Descripcion') }}"></th>
                                                <th></th> 
                                            </tr>
                                        </thead>
                                        <tbody id="ApprovalAccessDistributorsbody">
                                            <!-- Los datos se cargarán dinámicamente con JavaScript -->
                                        </tbody>
                                    </table>
                                </div>

                                <!-- Modal para Asignar Vendedor y Descuento -->
                                <div class="modal fade" id="EstandarModal" tabindex="-1" aria-labelledby="EstandarModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-dialog-centered modal-lg modal-custom-width">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="EstandarModalLabel">{{ _('Información de distribuidores') }}</h5>
                                                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                            </div>
                                            <div class="modal-body">
                                                <form class="modal-form-custom">
                                                    <div class="form-row">
                                                        <div class="form-group form-group-comentario">
                                                            <label for="Comments">{{ _('Comentario:') }}</label>
                                                            <textarea class="form-control" id="Comments" rows="3" readonly></textarea>
                                                        </div>
                                                    </div>
                                                    <div class="form-row">
                                                        <div class="form-group">
                                                            <label for="sellerSelect" class="required">{{ _('Asignar vendedor:') }}</label>
                                                            <select id="sellerSelect" class="form-select">
                                                                <option selected disabled value="">{{ _('Seleccione una opción') }}</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="form-row">
                                                        <div class="form-group">
                                                            <label for="discountInput" class="required">{{ _('Máximo descuento autorizado:') }}</label>
                                                            <input type="text" id="discountInput" class="form-control" placeholder="{{ _('Ingrese un valor (0 - 25)') }}">
                                                        </div>
                                                    </div>
                                                </form>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{ _('Cancelar') }}</button>
                                                <button type="button" class="btn btn-primary" onclick="assignSeller()">{{ _('Guardar') }}</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Modal para Rechazar un distribuidor -->
                                <div class="modal fade" id="RejectModal" tabindex="-1" aria-labelledby="RejectModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-dialog-centered modal-lg modal-custom-width">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="RejectModalLabel">{{ _('Rechazo de distribuidores') }}</h5>
                                                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                            </div>
                                            <div class="modal-body">
                                                <form class="modal-form-custom">
                                                    <div class="form-row">
                                                        <div class="form-group form-group-comentario">
                                                            <label for="Comments2">{{ _('Comentario del distribuidor:') }}</label>
                                                            <textarea class="form-control" id="Comments2" rows="3" readonly></textarea>
                                                        </div>
                                                    </div>
                                                    <div class="form-row">
                                                        <div class="form-group form-group-comentario">
                                                            <label for="Commentsresp">{{ _('Motivo de rechazo (opcional):') }}</label>
                                                            <textarea class="form-control" id="Commentsresp" rows="3" placeholder="{{ _('Detalle el motivo por el cual se rechaza la solicitud...') }}"></textarea>
                                                        </div>
                                                    </div>
                                                </form>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{ _('Cancelar') }}</button>
                                                <button type="button" class="btn btn-danger" id="confirmRejectBtn">{{ _('Rechazar') }}</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>                
                </form>
            </div>
        </div>       
    </section>
</main>


<!-- jQuery (Debe ir antes de cualquier otro script de DataTables) -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<!-- DataTables -->
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>

<!-- Botones de DataTables (Última versión estable) -->
<!-- <script src="https://cdn.datatables.net/buttons/2.3.6/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.3.6/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.3.6/js/buttons.print.min.js"></script> -->

<!-- Dependencias para exportar a Excel/PDF -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>


<!-- Conexion de JS CZM_AlternatorModel -->
<script src="{{ url_for('static', filename='js/Operaciones/Ingenieria/PE/PE_DM/CZM_AlternatorModel.js') }}"></script>
{% endblock %}





