diff --git a/ci4/app/Views/themes/vuexy/form/presupuestos/cliente/items/_resumen.php b/ci4/app/Views/themes/vuexy/form/presupuestos/cliente/items/_resumen.php index 3f447a46..042ab029 100644 --- a/ci4/app/Views/themes/vuexy/form/presupuestos/cliente/items/_resumen.php +++ b/ci4/app/Views/themes/vuexy/form/presupuestos/cliente/items/_resumen.php @@ -19,8 +19,11 @@ -
-
+
+
+ +
+
diff --git a/httpdocs/assets/js/safekat/components/preview.js b/httpdocs/assets/js/safekat/components/preview.js index 3a95d29a..a084a452 100644 --- a/httpdocs/assets/js/safekat/components/preview.js +++ b/httpdocs/assets/js/safekat/components/preview.js @@ -1322,6 +1322,8 @@ class previewFormas { var fitElement = this.actualPreview.fit.domElement; this.actualPreview.renderer.domElement.setAttribute('viewBox', `0 0 ${this.actualPreview.width} ${this.actualPreview.height}`); this.actualPreview.renderer.domElement.setAttribute('preserveAspectRatio', 'xMidYMid meet'); // Optional, for aspect ratio + this.actualPreview.renderer.domElement.setAttribute('width', '100%'); // Optional, for aspect ratio + this.actualPreview.renderer.domElement.setAttribute('height', "40rem"); // Optional, for aspect ratio } diff --git a/httpdocs/assets/js/safekat/pages/presupuestoAdmin/presupuestoAdminEdit.js b/httpdocs/assets/js/safekat/pages/presupuestoAdmin/presupuestoAdminEdit.js index 1784b657..8f18578d 100644 --- a/httpdocs/assets/js/safekat/pages/presupuestoAdmin/presupuestoAdminEdit.js +++ b/httpdocs/assets/js/safekat/pages/presupuestoAdmin/presupuestoAdminEdit.js @@ -614,21 +614,24 @@ class PresupuestoAdminEdit { const svgData = serializer.serializeToString(shapeSvgEl); const svgBlob = new Blob([svgData], { type: 'image/svg+xml;charset=utf-8' }); const svgUrl = URL.createObjectURL(svgBlob); - const img = new Image(); + const img = new Image(shapeSvgEl.getBoundingClientRect().width,shapeSvgEl.getBoundingClientRect().height); img.onload = () => { + const scaleFactor = 3; // Increase resolution (e.g., 2x, 3x) const canvas = document.createElement('canvas'); - canvas.width = img.width; - canvas.height = img.height; + // Scale canvas for high resolution + const width = img.naturalWidth || img.width; + const height = img.naturalHeight || img.height; + canvas.width = width * scaleFactor; + canvas.height = height * scaleFactor; const ctx = canvas.getContext('2d'); - ctx.drawImage(img, 0, 0); + ctx.scale(scaleFactor, scaleFactor); + ctx.drawImage(img, 0,0,width,height); const pngUrl = canvas.toDataURL('image/png'); const downloadLink = document.createElement('a'); downloadLink.href = pngUrl; downloadLink.download = filename ?? '.png'; document.body.appendChild(downloadLink); downloadLink.click(); - document.body.removeChild(downloadLink); - URL.revokeObjectURL(svgUrl); }; diff --git a/httpdocs/assets/js/safekat/pages/presupuestoCliente/resumen.js b/httpdocs/assets/js/safekat/pages/presupuestoCliente/resumen.js index 0ccd5839..cf8814ec 100644 --- a/httpdocs/assets/js/safekat/pages/presupuestoCliente/resumen.js +++ b/httpdocs/assets/js/safekat/pages/presupuestoCliente/resumen.js @@ -56,7 +56,7 @@ class Resumen { this.divPreview = $(this.domItem.find("#pv_ec_shape")); this.btnPreviewCubierta = $(this.domItem.find("#btnPreviewCubierta")); - + this.btnDownloadPreviewCubierta = this.domItem.find('.download-shape'); this.submitFiles = $(this.domItem.find("#submit-all-files")); this.dropzone = null; @@ -67,9 +67,8 @@ class Resumen { init(presupuesto_id = -1) { this.btnPreviewCubierta.on('click', this.#btnPreview.bind(this)); - this.submitFiles.on('click', this.#btnUploadFiles.bind(this)); - + this.downloadPreviewImage() if (presupuesto_id != -1) { this.presupuesto_id = presupuesto_id; } @@ -193,10 +192,12 @@ class Resumen { 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'); } } @@ -229,21 +230,21 @@ class Resumen { this.disenioCubierta.disenioCubierta.filter('.selected').attr('id'), "resumen", { - ancho: () => {return ancho}, - alto: () => {return alto}, - lomo: () => {return $('#lc').val() === '' ? parseFloat('0.0') : parseFloat($('#lc').val())}, - solapas: () => {return this.disenioCubierta.getSolapasCubierta()}, - lomoRedondo: ()=> {return this.disenioCubierta.tapaDuraLomoRedondo.hasClass('selected')? 1: 0}, + ancho: () => { return ancho }, + alto: () => { return alto }, + lomo: () => { return $('#lc').val() === '' ? parseFloat('0.0') : parseFloat($('#lc').val()) }, + solapas: () => { return this.disenioCubierta.getSolapasCubierta() }, + lomoRedondo: () => { return this.disenioCubierta.tapaDuraLomoRedondo.hasClass('selected') ? 1 : 0 }, } ).previewEsquemaCubierta(); this.paginas.text(this.datosGenerales.paginas.val()); this.paginasColor.text(this.datosGenerales.paginasColor.val()); this.paginasNegro.text(this.datosGenerales.paginasNegro.val()); - if(this.datosGenerales.selectedTirada){ + if (this.datosGenerales.selectedTirada) { this.tirada.text(this.datosGenerales.selectedTirada); } - else{ + else { this.tirada.text(parseInt($($('.check-tirada-envio:checked')[0]).attr('tirada'))); } this.prototipo.text(this.datosGenerales.prototipo.is(':checked') ? 'Sí' : 'No'); @@ -310,7 +311,7 @@ class Resumen { return parseInt($(this).find('.tarjeta-tiradas-precios-tirada').attr('data')) == unidades; }); - + let envios = tarjetaPrecio.find('.tarjeta-tiradas-precios-envio').val(); this.total_envios.text(this.#changeDecimalFormat(parseFloat(envios).toFixed(2))); @@ -323,10 +324,10 @@ class Resumen { const total_antes_iva_text = this.#changeDecimalFormat((parseFloat(base) + parseFloat(envios)).toFixed(2)); const iva_porcentaje = parseInt(this.datosGenerales.ivaReducido.find('option:selected').val()) == 1 ? 0.04 : 0.21; - const iva = ((parseFloat(base) + parseFloat(envios))* iva_porcentaje).toFixed(2); + const iva = ((parseFloat(base) + parseFloat(envios)) * iva_porcentaje).toFixed(2); let iva_text = this.#changeDecimalFormat(iva); - const total = (parseFloat(base) + parseFloat(envios) +parseFloat(iva)).toFixed(2); + const total = (parseFloat(base) + parseFloat(envios) + parseFloat(iva)).toFixed(2); let total_text = this.#changeDecimalFormat(total); @@ -349,7 +350,7 @@ class Resumen { let total_antes_iva = parseFloat(base) + parseFloat(total_envio); let total_antes_iva_text = this.#changeDecimalFormat(total_antes_iva.toFixed(2)); - const iva_porcentaje = !iva_reducido? 0.21 : 0.04; + const iva_porcentaje = !iva_reducido ? 0.21 : 0.04; const iva = ((parseFloat(base) + parseFloat(total_envio)) * iva_porcentaje).toFixed(2); let iva_text = this.#changeDecimalFormat(iva); @@ -360,7 +361,7 @@ class Resumen { this.total_base.text(base_text); this.total_envios.text(envios_text); this.total_antes_iva.text(total_antes_iva_text); - this.iva_porcentaje.text(!iva_reducido? '21' : '4'); + this.iva_porcentaje.text(!iva_reducido ? '21' : '4'); this.iva.text(iva_text); this.total.text(total_text); } @@ -373,6 +374,38 @@ class Resumen { partes[0] = partes[0].replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1.'); return partes.join(','); } + downloadPreviewImage() { + $(document).on("click", ".download-shape", (event) => { + let parentDiv = $(event.currentTarget).parent().parent(); + let shapeSvgElQuery = $(parentDiv).find("svg"); + let shapeSvgEl = shapeSvgElQuery[0]; + console.log(shapeSvgEl) + const filename = shapeSvgElQuery.parent().attr("id") ?? "image" + const serializer = new XMLSerializer(); + const svgData = serializer.serializeToString(shapeSvgEl); + const svgBlob = new Blob([svgData], { type: 'image/svg+xml;charset=utf-8' }); + const svgUrl = URL.createObjectURL(svgBlob); + const img = new Image(); + img.onload = () => { + const canvas = document.createElement('canvas'); + canvas.width = img.width; + canvas.height = img.height; + const ctx = canvas.getContext('2d'); + ctx.drawImage(img, 0, 0); + const pngUrl = canvas.toDataURL('image/png'); + const downloadLink = document.createElement('a'); + downloadLink.href = pngUrl; + downloadLink.download = filename ?? '.png'; + document.body.appendChild(downloadLink); + downloadLink.click(); + document.body.removeChild(downloadLink); + + URL.revokeObjectURL(svgUrl); + }; + + img.src = svgUrl; + }) + } } export default Resumen; \ No newline at end of file