Prrrrrrrrrrr

ci4/app/Config/Routes/CatalogoRoutes.php

@@ -8,12 +8,28 @@ use CodeIgniter\Router\RouteCollection;
 $routes->group('catalogo', ['namespace' => 'App\Controllers\Catalogo'], function ($routes) {
     /* Libros */
     $routes->group('libros', ['namespace' => 'App\Controllers\Catalogo'], function ($routes) {
+        /**======================
+         *    CRUD
+         *========================**/
         $routes->get('', 'CatalogoLibros::index', ['as' => 'CatalogoLibrosList']);
         $routes->get('gettarifas', 'CatalogoLibros::getSelect2');
         $routes->match(['get', 'post'], 'add', 'CatalogoLibros::add', ['as' => 'CatalogoLibrosAdd']);
         $routes->match(['get', 'post'], 'edit/(:num)', 'CatalogoLibros::edit/$1', ['as' => 'CatalogoLibrosEdit']);
         $routes->get('delete/(:num)', 'CatalogoLibros::delete/$1', ['as' => 'CatalogoLibrosDelete']);
         $routes->get('datatable', 'CatalogoLibros::datatable', ['as' => 'CatalogoLibrosDT']);
-        $routes->get('select', 'CatalogoLibros::show_select', ["as" => "CatalogoLibrosShow"]);
+        
+        
+        /**======================
+         *    AJAX
+         *========================**/
+        $routes->get('clientlist', 'CatalogoLibros::getClientList', ['as' => 'clientList']);
+
+
+        /**======================
+         *    FILES
+         *========================**/
+        $routes->post('get_files', 'CatalogoLibros::get_files');
+        $routes->post('upload_files', 'CatalogoLibros::upload_files');
+
     });
 });

ci4/app/Controllers/Catalogo/CatalogoLibros.php

@@ -3,8 +3,8 @@ namespace App\Controllers\Catalogo;
 
 use App\Controllers\BaseResourceController;
 use App\Entities\Catalogo\CatalogoLibroEntity;
-use App\Models\Collection;
 use App\Models\Catalogo\CatalogoLibroModel;
+use App\Models\Clientes\ClienteModel;
 use Hermawan\DataTables\DataTable;
 
 class CatalogoLibros extends BaseResourceController
@@ -178,6 +178,10 @@ class CatalogoLibros extends BaseResourceController
             endif; // $noException && $successfulResult
         endif; // ($requestMethod === 'post')
 
+        $catalogoLibrosEntity->clienteName = model('App\Models\Clientes\ClienteModel')->find($catalogoLibrosEntity->cliente_id)->nombre;
+        $catalogoLibrosEntity->createdUser = model('App\Models\Usuarios\UserModel')->getFullName($catalogoLibrosEntity->user_created_id);
+        $catalogoLibrosEntity->updatedUser = model('App\Models\Usuarios\UserModel')->getFullName($catalogoLibrosEntity->user_update_id);
+
         $this->viewData['catalogoLibrosEntity'] = $catalogoLibrosEntity;
 
         $this->viewData['formAction'] = route_to('CatalogoLibrosEdit', $id);
@@ -297,4 +301,102 @@ class CatalogoLibros extends BaseResourceController
         }
     }
 
+
+    /* IMN */
+    public function getClientList()
+    {
+        $search = $this->request->getGet("q") ?? "";
+        $data = (new ClienteModel())->getIdName($search);
+        return $this->response->setJSON($data);
+        
+    }
+
+    public function get_files()
+    {
+
+        // Check if the request is a POST request
+        if ($_SERVER['REQUEST_METHOD'] == 'POST') {
+
+            $presupuesto_id = $this->request->getPost()['presupuesto_id'] ?? 0;
+
+            $model = model('App\Models\Presupuestos\PresupuestoFicheroModel');
+            $files = $model->getFiles($presupuesto_id);
+
+            $result = [];
+
+            foreach ($files as $file) {
+
+                $size = filesize($file->file_path);
+                $splitPath = explode("presupuestos/", $file->file_path);
+
+                // se crea un objeto con el nombre del fichero y el tamaño
+                $obj = (object) array(
+                    'name' => $file->nombre,
+                    'size' => $size,
+                    'hash' => $splitPath[1] ?? $file->file_path
+                );
+
+
+                // se añade el objeto al array
+                array_push($result, $obj);
+            }
+
+            return json_encode($result);
+        }
+    }
+
+    public function upload_files()
+    {
+
+        $model = model('App\Models\Presupuestos\PresupuestoFicheroModel');
+
+        if ($_SERVER['REQUEST_METHOD'] == 'POST') {
+
+            $presupuesto_id = $_POST['presupuesto_id'];
+            $old_files = json_decode($_POST['oldFiles']);
+            $ftp = new SafekatFtpClient();
+
+            // Comprobar si se han subido archivos
+            if (!empty($_FILES['file']) || !empty($old_files)) {
+
+
+                // Borrar los archivos existentes del presupuesto
+                $ftp->removeFiles($presupuesto_id);
+                $model->deleteFiles($presupuesto_id, $old_files);
+
+                if (!empty($_FILES['file'])) {
+                    $files = $_FILES['file'];
+
+                    // Iterar sobre los archivos
+                    for ($i = 0; $i < count($files['name']); $i++) {
+                        // Aquí puedes acceder a las propiedades del archivo
+                        $name = $files['name'][$i];
+                        $extension = explode('.', $files['name'][$i])[1];
+                        $tmp_name = $files['tmp_name'][$i];
+
+                        $new_name = $model->saveFileInBBDD($presupuesto_id, $name, $extension, auth()->id());
+
+                        // Se sube el fichero
+                        // Pero primero se comprueba que la carpeta presupuestos exista
+                        if (!is_dir(WRITEPATH . 'uploads/presupuestos')) {
+                            mkdir(WRITEPATH . 'uploads/presupuestos', 0777, true);
+                        }
+
+                        if (!is_null($new_name)) {
+                            $path = WRITEPATH . 'uploads/presupuestos/' . $new_name;
+                            move_uploaded_file($tmp_name, $path);
+                        }
+                    }
+                    $ftp->uploadFilePresupuesto($presupuesto_id);
+                }
+            } else {
+                // Borrar los archivos existentes del presupuesto
+                $ftp->removeFiles($presupuesto_id);
+                $model->deleteFiles($presupuesto_id);
+            }
+        }
+        return json_encode(['message' => 'Archivos subidos correctamente']);
+    }
+
+
 }

ci4/app/Controllers/Sistema/Intranet.php

@@ -56,10 +56,33 @@ class Intranet extends Controller
         }
 
     }
-    function orden_trabajo($ot_id,$resource_name)
+    function orden_trabajo($ot_id, $resource_name)
     {
         helper('file');
-        $resource_path = WRITEPATH . 'uploads/orden_trabajo/'.$ot_id. '/' . $resource_name;
+        $resource_path = WRITEPATH . 'uploads/orden_trabajo/' . $ot_id . '/' . $resource_name;
+        if (file_exists($resource_path)) {
+            // Get the mime type of the file
+            $mime_type = mime_content_type($resource_path);
+
+            // Get an instance of the Response class
+            $response = service('response');
+
+            // Set the content type
+            $response->setContentType($mime_type);
+
+            // Set the output
+            $response->setBody(file_get_contents($resource_path));
+
+            // Send the response to the browser
+            $response->send();
+        }
+
+    }
+
+    function catalogo($catalogo_id, $resource_name)
+    {
+        helper('file');
+        $resource_path = WRITEPATH . 'uploads/catalogo/' . $catalogo_id . '/' . $resource_name;
         if (file_exists($resource_path)) {
             // Get the mime type of the file
             $mime_type = mime_content_type($resource_path);

ci4/app/Models/Catalogo/CatalogoLibroModel.php

@@ -4,15 +4,16 @@ namespace App\Models\Catalogo;
 
 use CodeIgniter\Model;
 use App\Entities\Catalogo\CatalogoLibroEntity;
+use App\Models\Clientes\ClienteModel;
 
 class CatalogoLibroModel extends Model
 {
-    protected $table            = 'catalogo_libros';
-    protected $primaryKey       = 'id';
+    protected $table = 'catalogo_libros';
+    protected $primaryKey = 'id';
 
-    protected $returnType       = CatalogoLibroEntity::class;
-    protected $useSoftDeletes   = true;
-    protected $useTimestamps    = true;
+    protected $returnType = CatalogoLibroEntity::class;
+    protected $useSoftDeletes = true;
+    protected $useTimestamps = true;
 
     protected $allowedFields = [
         'cliente_id',
@@ -68,16 +69,16 @@ class CatalogoLibroModel extends Model
     ];
 
     protected $useAutoIncrement = true;
-    protected $protectFields    = true;
+    protected $protectFields = true;
 
-    protected $createdField  = 'created_at';
-    protected $updatedField  = 'updated_at';
-    protected $deletedField  = 'deleted_at';
+    protected $createdField = 'created_at';
+    protected $updatedField = 'updated_at';
+    protected $deletedField = 'deleted_at';
 
     // Opcional: reglas de validación
-    protected $validationRules    = [];
+    protected $validationRules = [];
     protected $validationMessages = [];
-    protected $skipValidation     = false;
+    protected $skipValidation = false;
 
 
 
@@ -107,4 +108,19 @@ class CatalogoLibroModel extends Model
         return $builder;
     }
 
+    public function getClientList($search = "")
+    {
+        $clienteModel = new ClienteModel();
+
+        $query = $clienteModel->builder()
+            ->select('id, nombre as name') // O el campo que quieras usar como "name"
+            ->where('deleted_at', null);
+        if ($search != "") {
+            $query->groupStart()
+                ->orLike("nombre", $search)
+                ->groupEnd();
+        }
+        return $query->get()->getResultObject();
+    }
+
 }

ci4/app/Views/themes/vuexy/form/catalogo/_datosGeneralesFormItems.php

@@ -32,8 +32,12 @@
                     <div class="col-md-12 col-lg-10 px-4">
                         <div class="row">
                             <div class="col-md-4 mb-3">
-                                <label for="cliente_id" class="form-label">Cliente</label>
-                                <select id="cliente_id" name="cliente_id" class="form-select select2bs5"></select>
+                                <label for="clienteId" class="form-label">Cliente</label>
+                                <select id="clienteId" name="clienteId" class="form-select select2bs5">
+                                    <option value="<?= $catalogoLibrosEntity->cliente_id ?>">
+                                        <?= $catalogoLibrosEntity->clienteName ?>
+                                    </option>
+                                </select>
                             </div>
 
                             <div class="col-md-8 mb-3">
@@ -81,8 +85,8 @@
 
                             <div class="col-md-6 mb-3">
                                 <label for="ean" class="form-label">EAN</label>
-                                <input type="text" id="ean" name="ean" class="form-control" readonly style="background: #E8E8E8;"
-                                    value="<?= old('ean', $catalogoLibrosEntity->ean) ?>">
+                                <input type="text" id="ean" name="ean" class="form-control" readonly
+                                    style="background: #E8E8E8;" value="<?= old('ean', $catalogoLibrosEntity->ean) ?>">
                             </div>
 
                             <div class="col-md-3 mb-3">

ci4/app/Views/themes/vuexy/form/catalogo/_ficherosLibroFormItems.php

@@ -12,19 +12,34 @@
 
                 <div class="row">
                     <!-- Zona de subida -->
-                    <div class="col-md-12 col-lg-3 px-4">
-                        <div id="dropzone" class="border border-secondary border-dashed rounded p-4 text-center"
-                            style="min-height: 200px; cursor: pointer;">
-                            <p class="text-muted m-0">
-                                Arrastre los ficheros<br>o haz click para<br><strong>subir ficheros</strong>
-                            </p>
-                            <!-- Aquí podrías usar DropzoneJS u otro uploader -->
-                            <input type="file" multiple name="archivos[]" class="d-none" id="fileUploader">
+                    <div class="col-12 mb-3">
+                        <h3>Ficheros</h3>
+                        <div class="col-12">
+                            <div class="dropzone needsclick" id="dropzone-multi">
+                                <div class="dz-message needsclick">
+                                    Arrastre aquí los ficheros o haga click
+                                </div>
+                                <div class="fallback">
+                                    <input name="file" type="file" />
+                                </div>
+                            </div>
                         </div>
+                        <button id="btnUploadFile"
+                            class="btn mt-3 btn-primary btn-submit waves-effect waves-light ml-2 ">
+                            <span
+                                class="align-middle d-sm-inline-block d-none me-sm-1"><?= lang('App.global_upload_files') ?></span>
+                            <i class="ti ti-upload ti-xs"></i>
+                        </button>
+                        <button id="submit-all-files"
+                            class="btn mt-3 btn-success btn-submit waves-effect waves-light ml-2">
+                            <span
+                                class="align-middle d-sm-inline-block d-none me-sm-1"><?= lang('App.global_save_file') ?></span>
+                            <i class="ti ti-device-floppy ti-xs"></i>
+                        </button>
                     </div>
 
                     <!-- Tabla de ficheros -->
-                    <div class="col-md-12 col-lg-9 px-4">
+                    <div class="col-md-12 col-lg-12 px-4">
                         <div class="table-responsive">
                             <table class="table table-bordered">
                                 <thead class="table-light">

ci4/app/Views/themes/vuexy/form/catalogo/_trackingFormItems.php

@@ -4,15 +4,15 @@
         <div class="col-md-6">
             <p>
                 <strong><?= lang("Catalogo.created_by_at") ?></strong>
-                <span id="created_by"></span>,
-                <span id="created_at"></span>
+                <span id="created_by"><?= $catalogoLibrosEntity->createdUser ?></span>,
+                <span id="created_at"><?= $catalogoLibrosEntity->created_at ?></span>
             </p>
         </div>
         <div class="col-md-6">
             <p>
                 <strong><?= lang("Catalogo.updated_by_at") ?></strong>
-                <span id="updated_by"></span>,
-                <span id="updated_at_footer"></span>
+                <span id="updated_by"><?= $catalogoLibrosEntity->updatedUser ?></span>,
+                <span id="updated_at_footer"><?= $catalogoLibrosEntity->updated_at ?></span>
             </p>
         </div>
     </div>

ci4/app/Views/themes/vuexy/form/catalogo/viewCatalogoLibrosForm.php

@@ -36,4 +36,16 @@
 		</div><!-- //.card -->
 	</div><!--//.col -->
 </div><!--//.row -->
+<?= $this->endSection() ?>
+
+
+<?= $this->section('css') ?>
+	<link rel="stylesheet" href="<?= site_url('themes/vuexy/vendor/libs/dropzone/dropzone.css') ?>" />
+	<link rel="stylesheet" href="<?= site_url('themes/vuexy/css/safekat.css') ?>">
+<?= $this->endSection() ?>
+
+
+<?= $this->section("additionalExternalJs") ?>
+	<script src="<?= site_url("themes/vuexy/vendor/libs/dropzone/dropzone.js") ?>"></script>
+	<script type="module" src="<?= site_url('assets/js/safekat/pages/catalogo/catalogo.js?' . 'token' . '=' . (csrf_token() ?? "token")) ?>"></script>
 <?= $this->endSection() ?>

httpdocs/assets/js/safekat/pages/catalogo/catalogo.js

@@ -0,0 +1,528 @@
+import ClassSelect from '../../components/select2.js';
+import Ajax from '../../components/ajax.js';
+
+class Catalogo {
+
+    constructor() {
+
+        this.cliente = new ClassSelect($("#clienteId"), '/catalogo/libros/clientlist', "Seleccione un cliente");
+        
+        this.encuadernacion = new ClassSelect($("#encuadernacion"), '/importador/getencuadernacion', "Seleccione una encuadernación");
+
+        this.compPapelNegroSelected = new ClassSelect($("#compPapelNegroSelected"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+            {
+
+                tipo_impresion: () => this.encuadernacion.getVal(),
+                tirada: () => $('#tirada').val(),
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: 0,
+                lomo: 0,
+                tipo: () => $('#isHq').val() ? 'negrohq' : 'negro',
+            });
+        this.compGramajeNegro = new ClassSelect($('#compGramajeNegro'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
+            {
+                tipo_impresion: () => this.encuadernacion.getVal(),
+                papel_generico: () => this.compPapelNegroSelected.getVal(),
+                tirada: () => $('#tirada').val(),
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: 0,
+                lomo: 0,
+                tipo: () => $('#isHq').val() ? 'negrohq' : 'negro',
+            });
+        this.compPapelColorSelected = new ClassSelect($("#compPapelColorSelected"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+            {
+                tipo_impresion: () => this.encuadernacion.getVal(),
+                tirada: () => $('#tirada').val(),
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: 0,
+                lomo: 0,
+                tipo: () => $('#isHq').val() ? 'colorhq' : 'color',
+            });
+        this.compGramajeColor = new ClassSelect($('#compGramajeColor'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
+            {
+                tipo_impresion: () => this.encuadernacion.getVal(),
+                papel_generico: () => this.compPapelColorSelected.getVal(),
+                tirada: () => $('#tirada').val(),
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: 0,
+                lomo: 0,
+                tipo: () => $('#isHq').val() ? 'colorhq' : 'color',
+            });
+        this.compPapelCubiertaSelected = new ClassSelect($("#compPapelCubiertaSelected"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+            {
+                tipo_impresion: this.encuadernacion.getVal(),
+                tirada: () => $('#tirada').val(),
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: () => $('#compSolapasCubierta').val(),
+                lomo: () => 0,
+                tipo: 'colorhq',
+                uso: 'cubierta',
+            });
+        this.compGramajeCubierta = new ClassSelect($('#compGramajeCubierta'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
+            {
+                tipo_impresion: () => this.encuadernacion.getVal(),
+                papel_generico: () => this.compPapelCubiertaSelected.getVal(),
+                tirada: () => $('#tirada').val(),
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: () => $('#compSolapasCubierta').val(),
+                lomo: 0,
+                tipo: 'colorhq',
+            });
+        this.compSobrecubiertaSelected = new ClassSelect($("#compPapelSobrecubiertaSelected"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+            {
+                tipo_impresion: this.encuadernacion.getVal(),
+                tirada: () => $('#tirada').val(),
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: () => $('#compSolapasSobrecubierta').val(),
+                lomo: () => 0,
+                tipo: 'colorhq',
+                uso: 'sobrecubierta',
+            });
+        this.compGramajeSobrecubierta = new ClassSelect($('#compGramajeSobrecubierta'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
+            {
+                tipo_impresion: () => this.encuadernacion.getVal(),
+                papel_generico: () => this.compPapelCubiertaSelected.getVal(),
+                tirada: () => $('#tirada').val(),
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: () => $('#compSolapasSobrecubierta').val(),
+                lomo: 0,
+                tipo: 'colorhq',
+            });
+
+        this.acabadoCubierta = new ClassSelect($("#compAcabadoCubiertaSelected"),
+            '/serviciosacabados/getacabados',
+            '',
+            false,
+            {
+                "cubierta": 1
+            }
+        );
+        this.acabadosSobrecubierta = new ClassSelect($("#compAcabadoSobrecubiertaSelected"),
+            '/serviciosacabados/getacabados',
+            '',
+            false,
+            {
+                "sobrecubierta": 1
+            }
+        );
+
+        this.dropzone = null;
+        this.submitFiles = $("#submit-all-files");
+
+
+        this.openBtn = $('#openOld');
+
+    }
+
+    init() {
+
+        // Fuerza el foco en el campo de búsqueda de select2
+        $(document).on('select2:open', () => {
+            document.querySelector('.select2-search__field').focus();
+        });
+
+        let clienteId = $("#clienteId").val();
+        let clienteName = $("#clienteId").text();
+        this.cliente.init();
+        this.cliente.setOption(clienteId, clienteName);
+        
+        this.encuadernacion.init();
+
+        this.compPapelNegroSelected.init();
+        this.compGramajeNegro.init();
+        this.compPapelColorSelected.init();
+        this.compGramajeColor.init();
+        this.compPapelCubiertaSelected.init();
+        this.compGramajeCubierta.init();
+        this.compSobrecubiertaSelected.init();
+        this.compGramajeSobrecubierta.init();
+
+        this.acabadoCubierta.init();
+        this.acabadosSobrecubierta.init();
+
+        this.cliente.item.on('change', () => {
+
+
+        });
+
+        
+        this.submitFiles.on('click', this.#btnUploadFiles.bind(this));
+
+
+
+        
+
+
+
+        $(document).on('change', '.warning-change', function () {
+            $(this).addClass('bg-warning');
+            let select2Container = $(this).next('.select2').find('.select2-selection');
+            select2Container.addClass('bg-warning');
+        });
+    }
+
+    init_dropzone() {
+
+        let id = this.presupuesto_id;
+        Dropzone.autoDiscover = false;
+
+        const previewTemplate = `<div class="dz-preview dz-file-preview">
+        <div class="dz-details">
+        <div class="dz-thumbnail">
+            <!---<img data-dz-thumbnail>
+            <span class="dz-nopreview">No preview</span> --->
+            <div class="dz-success-mark"></div>
+            <div class="dz-error-mark"></div>
+            <div class="dz-error-message"><span data-dz-errormessage></span></div>
+            <div class="progress">
+            <div class="progress-bar progress-bar-primary" role="progressbar" aria-valuemin="0" aria-valuemax="100" data-dz-uploadprogress></div>
+            </div>
+        </div>
+        <div class="dz-filename" data-dz-name></div>
+        <div class="dz-size" data-dz-size></div>
+        </div>
+        </div>`;
+
+        this.dropzone = new Dropzone('#dropzone-multi', {
+            url: "/presupuestos/presupuestocliente/upload_files",
+            addRemoveLinks: true,
+            previewTemplate: previewTemplate,
+            paramName: "file",
+            uploadMultiple: true,
+            parallelUploads: 4, // Ajusta este número al máximo número de archivos que esperas subir a la vez
+            maxFiles: 5, // Ajusta este número al máximo número de archivos que esperas subir a la vez
+            autoProcessQueue: true,
+            dictRemoveFile: "Eliminar",
+            acceptedFiles: 'image/*, application/pdf',
+            maxFilesize: 5e+7, // Bytes
+            init: function () {
+                let thisDropzone = this;
+                $('#loader').show();
+
+                $.ajax({
+                    url: "/presupuestos/presupuestocliente/get_files",
+                    type: 'POST',
+                    data: { presupuesto_id: id }
+
+                }).done(function (response) {
+                    if (response == null || response == "") {
+                        return;
+                    }
+                    let values = JSON.parse(response);
+                    for (var i = 0; i < values.length; i++) {
+                        var mockFile = { name: values[i].name, size: values[i].size, hash: values[i].hash };
+
+                        thisDropzone.files.push(mockFile);    // add to files array
+                        thisDropzone.emit("addedfile", mockFile);
+                        thisDropzone.emit("thumbnail", mockFile, window.location.host + "/sistema/intranet/catalogo/" + values[i].hash);
+                        thisDropzone.emit("complete", mockFile);
+                        thisDropzone.options.success.call(thisDropzone, mockFile);
+                    };
+                }).always(function () {
+                    $('#loader').hide();
+                });
+
+                this.on("addedfile", function (file) {
+                    if (file.hash) {
+                        var viewButton = Dropzone.createElement("<span class='dz-remove'>Ver</span>");
+                        file.previewElement.appendChild(viewButton);
+                        // Listen to the view button click event
+                        viewButton.addEventListener("click", function (e) {
+
+                            window.open(window.location.protocol + "//" + window.location.host + "/sistema/intranet/catalogo/" + file.hash, '_blank');
+                        });
+                    }
+                });
+            },
+        });
+    }
+
+    #btnUploadFiles() {
+
+        var files = this.dropzone.files;
+        $('#loader').show();
+
+        var formData = new FormData();
+        var oldFiles = [];
+        var counter = 0;
+        for (var i = 0; i < files.length; i++) {
+
+            if (files[i].upload) {
+                var file = files[i];
+                formData.append('file[' + counter + ']', file);
+                counter += 1;
+            }
+            else {
+                oldFiles.push(files[i].name);
+            }
+        }
+        formData.append('oldFiles', JSON.stringify(oldFiles));
+
+        formData.append('presupuesto_id', this.presupuesto_id);
+
+        $.ajax({
+            url: "/catalogo/libros/upload_files",
+            type: 'POST',
+            data: formData,
+            processData: false,  // Indicar a jQuery que no procese los datos
+            contentType: false   // Indicar a jQuery que no establezca el tipo de contenido
+        }).done(function (response) {
+            popSuccessAlert("Archivos actualizados correctamente");
+        }).always(function () {
+            $('#loader').hide();
+        });
+    }
+
+
+    #btnPreview() {
+
+        if (this.divPreview.hasClass('d-none')) {
+            this.btnPreviewCubierta.text('Ocultar desarrollo cubierta');
+            this.divPreview.removeClass('d-none');
+            this.btnDownloadPreviewCubierta.parent().removeClass('d-none')
+            this.generate();
+        }
+        else {
+            this.btnPreviewCubierta.text('Mostrar desarrollo cubierta');
+            this.btnDownloadPreviewCubierta.parent().addClass('d-none')
+            this.divPreview.addClass('d-none');
+        }
+    }
+
+    
+
+    collectData() {
+
+        let data = {};
+
+        data.id;
+        data.cliente_id = $("#clienteId").val();
+
+        data.paginas = $('#paginas').val();
+        data.tirada = $('#tirada').val();
+        data.papel_formato_id = $('#tamanio').val();
+        data.papel_formato_personalizado = $('#papelFormatoPersonalizado').prop('checked') ? 1 : 0;
+        data.papel_formato_ancho = $('#papelFormatoAncho').val();
+        data.papel_formato_alto = $('#papelFormatoAlto').val();
+
+        data.encuadernacion = this.encuadernacion.getVal();
+        data.isHq = $('#isHq').val();
+
+        data.paginas_bn = $('#compPaginasNegro').val();
+        data.papel_bn = this.compPapelNegroSelected.getVal();
+        data.gramaje_bn = this.compGramajeNegro.getVal();
+
+        data.paginas_color = $('#compPaginasColor').val();
+        data.papel_color = this.compPapelColorSelected.getVal();
+        data.gramaje_color = this.compGramajeColor.getVal();
+
+        data.paginas_cubierta = $('#compCarasCubierta').val();
+        data.papel_cubierta = this.compPapelCubiertaSelected.getVal();
+        data.gramaje_cubierta = this.compGramajeCubierta.getVal();
+        data.solapas_cubierta = $('#compSolapasCubierta').val();
+        data.acabado_cubierta = this.acabadoCubierta.getVal();
+
+        data.sobrecubierta = $('#compSobrecubierta').val();
+        data.papel_sobrecubierta = this.compSobrecubiertaSelected.getVal();
+        data.gramaje_sobrecubierta = this.compGramajeSobrecubierta.getVal();
+        data.solapas_sobrecubierta = $('#compSolapasSobrecubierta').val();
+        data.acabado_sobrecubierta = this.acabadosSobrecubierta.getVal();
+
+        data.servicios = {
+            marcapaginas: $('#marcapaginas').prop('checked') ? 1 : 0,
+            serviciosExtra: []
+        };
+
+ 
+
+        return data;
+    }
+
+
+
+    
+
+    getDimensionLibro() {
+        let ancho = 0;
+        let alto = 0;
+        if ($('#papelFormatoPersonalizado').prop('checked')) {
+            ancho = $('#papelFormatoAncho').val();
+            alto = $('#papelFormatoAlto').val();
+        }
+        else {
+            const text = $('#tamanio').text();
+            ancho = text.split('x')[0];
+            alto = text.split('x')[1];
+        }
+        return { ancho, alto };
+    }
+
+
+    fillInitialData(data) {
+
+        $('#paginas').val(data.datosGenerales.paginas);
+        $('#tirada').val(data.datosGenerales.tirada);
+        if (data.datosGenerales.papel_formato_personalizado) {
+            $('#papelFormatoPersonalizado').prop('checked', true);
+            $('#tamanio').addClass('d-none');
+            $('#formatoPersonalizado').removeClass('d-none');
+            $('#papelFormatoAncho').val(data.datosGenerales.papel_formato_ancho);
+            $('#papelFormatoAlto').val(data.datosGenerales.papel_formato_alto);
+        }
+        else {
+            $('#tamanio').removeClass('d-none');
+            $('#formatoPersonalizado').addClass('d-none');
+            $('#papelFormatoPersonalizado').prop('checked', false);
+            $('#tamanio').append('<option value="' + data.datosGenerales.papel_formato_id + '" selected>' + data.datosGenerales.papel_formato_texto + '</option>');
+            $('#tamanio').val(data.datosGenerales.papel_formato_id).trigger('change');
+        }
+
+        if (data.encuadernacion) {
+            $('#encuadernacion_old').val(data.encuadernacion.encuadernacionOld);
+            // check if data.encuadernacion.encuadernacion exists and is not empty
+            if (data.encuadernacion.encuadernacion) {
+                this.encuadernacion.setOption(data.encuadernacion.encuadernacion.id, data.encuadernacion.encuadernacion.encuadernacion);
+            }
+        }
+
+        if (data.lineas) {
+            if (data.lineas.isHq) {
+                $('#isHq').val(data.lineas.isHq);
+            }
+            else {
+                $('#isHq').val(0);
+            }
+
+            if (data.lineas.bn && data.lineas.bn.paginas) {
+                $('#compPaginasNegro').val(data.lineas.bn.paginas);
+                $('#compPapelNegroOrigen').val(data.lineas.bn.papel_nombre);
+                this.compGramajeNegro.setOption(parseFloat(data.lineas.bn.gramaje).toFixed(0), parseFloat(data.lineas.bn.gramaje).toFixed(0));
+                this.compPapelNegroSelected.item.prop('disabled', false);
+                this.compPapelNegroSelected.setOption(data.lineas.bn.new_papel_id, data.lineas.bn.new_papel_nombre);
+            }
+            else {
+                $('#compPaginasNegro').val(0);
+                $('#compPapelNegroOrigen').val("");
+                this.compGramajeNegro.empty();
+                this.compPapelNegroSelected.empty();
+                this.compPapelNegroSelected.item.prop('disabled', true);
+                this.compGramajeNegro.item.prop('disabled', true);
+            }
+
+            if (data.lineas.color && data.lineas.color.paginas) {
+                $('#compPaginasColor').val(data.lineas.color.paginas);
+                $('#compPapelColorOrigen').val(data.lineas.color.papel_nombre);
+                this.compGramajeColor.setOption(parseFloat(data.lineas.color.gramaje).toFixed(0), parseFloat(data.lineas.color.gramaje).toFixed(0));
+                this.compPapelColorSelected.item.prop('disabled', false);
+                this.compPapelColorSelected.setOption(data.lineas.color.new_papel_id, data.lineas.color.new_papel_nombre);
+            }
+            else {
+                $('#compPaginasColor').val(0);
+                $('#compPapelColorOrigen').val("");
+                this.compGramajeColor.empty();
+                this.compPapelColorSelected.empty();
+                this.compPapelColorSelected.item.prop('disabled', true);
+            }
+
+            if (data.lineas.cubierta && data.lineas.cubierta.paginas) {
+                $('#compPaginasCubierta').val(data.lineas.cubierta.paginas);
+                $('#compPapelCubiertaOrigen').val(data.lineas.cubierta.papel_nombre);
+                this.compGramajeCubierta.setOption(parseFloat(data.lineas.cubierta.gramaje).toFixed(0), parseFloat(data.lineas.cubierta.gramaje).toFixed(0));
+                $('#compSolapasCubierta').val(parseFloat(data.lineas.cubierta.solapas).toFixed(0));
+                this.compPapelCubiertaSelected.item.prop('disabled', false);
+                this.compPapelCubiertaSelected.setOption(data.lineas.cubierta.new_papel_id, data.lineas.cubierta.new_papel_nombre);
+            }
+            else {
+                $('#compPaginasCubierta').val(0);
+                $('#compPapelCubiertaOrigen').val("");
+                this.compGramajeCubierta.empty();
+                $('#compSolapasCubierta').val("");
+                this.compPapelCubiertaSelected.empty();
+                this.compPapelCubiertaSelected.item.prop('disabled', true);
+            }
+
+            if (data.lineas.sobrecubierta && data.lineas.sobrecubierta.paginas) {
+                $('#compSobrecubierta').val(1);
+                $('#compPapelSobrecubiertaOrigen').val(data.lineas.sobrecubierta.papel_nombre);
+                this.compGramajeSobrecubierta.setOption(parseFloat(data.lineas.sobrecubierta.gramaje).toFixed(0), parseFloat(data.lineas.sobrecubierta.gramaje).toFixed(0));
+                $('#compSolapasSobrecubierta').val(parseFloat(data.lineas.sobrecubierta.solapas).toFixed(0));
+                this.compSobrecubiertaSelected.item.prop('disabled', false);
+                this.compSobrecubiertaSelected.setOption(data.lineas.sobrecubierta.new_papel_id, data.lineas.sobrecubierta.new_papel_nombre);
+            }
+            else {
+                $('#compSobrecubierta').val(0);
+                $('#compPapelSobrecubiertaOrigen').val("");
+                this.compGramajeSobrecubierta.empty();
+                $('#compSolapasSobrecubierta').val("");
+                this.compSobrecubiertaSelected.empty();
+                this.compSobrecubiertaSelected.item.prop('disabled', true);
+            }
+
+            if (data.acabados) {
+                if (data.acabados.cubierta && data.acabados.cubierta.acabadoOld) {
+                    $('#compAcabadoCubiertaOrigen').val(data.acabados.cubierta.acabadoOld);
+                    this.acabadoCubierta.setOption(data.acabados.cubierta.acabado.id, data.acabados.cubierta.acabado.name);
+                    this.acabadoCubierta.item.prop('disabled', false);
+                }
+                else {
+                    $('#compAcabadoCubiertaOrigen').val("");
+                    this.acabadoCubierta.empty();
+                    this.acabadoCubierta.item.prop('disabled', true);
+                }
+
+                if (data.acabados.sobrecubierta && data.acabados.sobrecubierta.acabadoOld) {
+                    $('#compAcabadoSobrecubiertaOrigen').val(data.acabados.sobrecubierta.acabadoOld);
+                    this.acabadosSobrecubierta.setOption(data.acabados.sobrecubierta.acabado.id, data.acabados.sobrecubierta.acabado.name);
+                    this.acabadosSobrecubierta.item.prop('disabled', false);
+                }
+                else {
+                    $('#compAcabadoSobrecubiertaOrigen').val("");
+                    this.acabadosSobrecubierta.empty();
+                    this.acabadosSobrecubierta.item.prop('disabled', true);
+                }
+            }
+
+            if (data.servicios.ferro == 1) {
+                $('#ferro').prop('checked', true);
+            }
+            else {
+                $('#ferro').prop('checked', false);
+            }
+            if (data.servicios.ferroDigital == 1) {
+                $('#ferroDigital').prop('checked', true);
+            }
+            else {
+                $('#ferroDigital').prop('checked', false);
+            }
+            if (data.servicios.marcapaginas == 1) {
+                $('#marcapaginas').prop('checked', true);
+            }
+            else {
+                $('#marcapaginas').prop('checked', false);
+            }
+            if (data.servicios.prototipo == 1) {
+                $('#prototipo').prop('checked', true);
+            }
+            else {
+                $('#prototipo').prop('checked', false);
+            }
+        }
+        this.makeImport.prop('disabled', false);
+    }
+}
+
+document.addEventListener('DOMContentLoaded', function () {
+
+    let catalogo = new Catalogo();
+    catalogo.init();
+});
+
+export default Catalogo;