Merge branch 'dev/resumen_lateral' into 'main'

Dev/resumen lateral

See merge request jjimenez/safekat!374
This commit is contained in:
2024-11-13 07:45:23 +00:00
8 changed files with 349 additions and 13 deletions

View File

@ -344,7 +344,7 @@
</label>
<select class="form-select select2bs2 calcular-presupuesto" id="plastificadoSobrecubierta"
name="plastificado_sobrecubierta">
<option value="NONE"> - </option>
<option value="NONE">Sin plastificar </option>
<option value="BRIL"><?= lang('Presupuestos.brillo') ?></option>
<option value="MATE"><?= lang('Presupuestos.mate') ?></option>
<option value="ANTI"><?= lang('Presupuestos.antirrayado') ?></option>

View File

@ -29,7 +29,7 @@
<div class="bs-stepper-header">
<div <?= ($state == 2)? 'hidden': '' ?> class="step active titulos-menu" data-target="#datos-generales">
<div <?= ($state == 2) ? 'hidden' : '' ?> class="step active titulos-menu" data-target="#datos-generales">
<button type="button" class="step-trigger" aria-selected="false" disabled="disabled">
<span class="bs-stepper-circle"><i class="ti ti-info-circle ti-sm"></i></span>
<span class="bs-stepper-label">
@ -38,7 +38,7 @@
</button>
</div>
<div <?= ($state == 2)? 'hidden': '' ?> class="step titulos-menu" data-target="#interior-libro">
<div <?= ($state == 2) ? 'hidden' : '' ?> class="step titulos-menu" data-target="#interior-libro">
<button type="button" class="step-trigger" aria-selected="false" disabled="disabled">
<span class="bs-stepper-circle"><i class="ti ti-book ti-sm"></i></span>
<span class="bs-stepper-label">
@ -47,7 +47,7 @@
</button>
</div>
<div <?= ($state == 2)? 'hidden': '' ?> class="step titulos-menu" data-target="#cubierta-libro">
<div <?= ($state == 2) ? 'hidden' : '' ?> class="step titulos-menu" data-target="#cubierta-libro">
<button type="button" class="step-trigger" aria-selected="false" disabled="disabled">
<span class="bs-stepper-circle"><i class="ti ti-books ti-sm"></i></span>
<span class="bs-stepper-label">
@ -56,7 +56,7 @@
</button>
</div>
<div <?= ($state == 2)? 'hidden': '' ?> class="step titulos-menu" data-target="#direcciones-libro">
<div <?= ($state == 2) ? 'hidden' : '' ?> class="step titulos-menu" data-target="#direcciones-libro">
<button type="button" class="step-trigger" aria-selected="false" disabled="disabled">
<span class="bs-stepper-circle"><i class="ti ti-map-pins ti-sm"></i></span>
<span class="bs-stepper-label">
@ -78,6 +78,95 @@
<div id='divTiradasPrecio'></div>
<div id='resumenLateral' class="container align-items-center">
<div class="rl-datos-generales rl-item d-none">
<div class="row">Libro</div>
<div class="row">
<ul class="list-group list-group-timeline">
<li id="rl_tipo" class="list-group-item list-group-timeline-primary texto-resumen-lateral">Rustica
Fresado</li>
<li id="rl_tipo_cubierta" class="list-group-item list-group-timeline-primary texto-resumen-lateral">Tapa
dura</li>
<li id="rl_tamanio" class="list-group-item list-group-timeline-primary texto-resumen-lateral">170.0
x
240.0</li>
<li id="rl_tiradas" class="list-group-item list-group-timeline-primary texto-resumen-lateral">10,
50,
100, 200</li>
<li id="rl_paginas" class="list-group-item list-group-timeline-primary texto-resumen-lateral">340
páginas</li>
</ul>
</div>
</div>
<div class="rl-interior rl-item d-none">
<div class="row">Interior</div>
<div class="row">
<ul class="list-group list-group-timeline">
<li id="rl_tipo_interior" class="list-group-item list-group-timeline-primary texto-resumen-lateral">
Blanco y
negro estándar</li>
<li id="rl_papel_interior" class="list-group-item list-group-timeline-primary texto-resumen-lateral">
Offset
blanco 90 gr.</li>
<li id="rl_papel_interior_color"
class="list-group-item list-group-timeline-primary texto-resumen-lateral d-none">Offset
blanco 90 gr.</li>
</ul>
</div>
</div>
<div class="rl-cubierta rl-item d-none">
<div class="row">Cubierta</div>
<div class="row">
<ul class="list-group list-group-timeline">
<li id="rl_papel_cubierta" class="list-group-item list-group-timeline-primary texto-resumen-lateral">
Estucado
Mate
300 gr.</li>
<li id="rl_caras_cubierta" class="list-group-item list-group-timeline-primary texto-resumen-lateral">
Impresa
1
cara</li>
<li id="rl_acabado_cubierta" class="list-group-item list-group-timeline-primary texto-resumen-lateral">
Plastificado brillo</li>
</ul>
</div>
</div>
<div class="rl-sobrecubierta rl-item d-none">
<div class="row">Sobrecubierta</div>
<div class="row">
<ul class="list-group list-group-timeline">
<li id="rl_no_sobrecubierta" class="list-group-item list-group-timeline-primary texto-resumen-lateral">
No</li>
<li id="rl_papel_sobrecubierta"
class="list-group-item list-group-timeline-primary texto-resumen-lateral">Estucado mate 170 gr</li>
<li id="rl_tamanio_sobrecubierta"
class="list-group-item list-group-timeline-primary texto-resumen-lateral">
60mm</li>
<li id="rl_acabado_sobrecubierta"
class="list-group-item list-group-timeline-primary texto-resumen-lateral">
Plastificado brillo</li>
</ul>
</div>
</div>
<div class="rl-servicios-extra rl-item d-none">
<div class="row">Servicios extra</div>
<div class="row">
<ul class="list-group list-group-timeline">
<li id="rl_prototipo" class="list-group-item list-group-timeline-primary texto-resumen-lateral d-none">
Prototipo</li>
</ul>
</div>
</div>
</div>
</div> <!--//.bs-stepper-header -->

View File

@ -56,6 +56,16 @@ class DatosGenerales {
this.excluirRotativa = this.domItem.find("#excluirRotativa");
this.prototipo = this.domItem.find("#prototipo");
this.rl_datos_generales = $(".rl-datos-generales");
this.rl_tipo = $("#rl_tipo");
this.rl_tipo_cubierta = $('#rl_tipo_cubierta');
this.rl_tamanio = $("#rl_tamanio");
this.rl_tiradas = $("#rl_tiradas");
this.rl_paginas = $("#rl_paginas");
this.rl_servicios_extra = $(".rl-servicios-extra");
this.rl_prototipo = $("#rl_prototipo");
this.initValidation();
}
@ -373,10 +383,97 @@ class DatosGenerales {
}
}).on('core.form.valid', () => {
if (this.allowNext)
stepper.next();
});
}
processMenuLateral() {
let menu_off = true;
if (this.tiposLibro.filter('.selected').length > 0) {
let tipo = String(this.tiposLibro.filter('.selected').attr('id'));
tipo = tipo.charAt(0).toUpperCase() + tipo.slice(1);
this.rl_tipo.text(tipo);
this.rl_tipo.removeClass('d-none');
menu_off = false;
}
else {
this.rl_tipo.addClass('d-none');
}
if($('.tipo-cubierta.selected').length>0){
this.rl_tipo_cubierta.text($($('.tipo-cubierta.selected').find('.form-label')).text());
this.rl_tipo_cubierta.removeClass('d-none');
}
else{
this.rl_tipo_cubierta.addClass('d-none');
}
if (this.checkFormatoPersonalizado.is(':checked')) {
let ancho = parseFloat(this.anchoPersonalizado.val());
let alto = parseFloat(this.altoPersonalizado.val());
if (!isNaN(ancho) && !isNaN(alto)) {
this.rl_tamanio.text(ancho + ' x ' + alto);
this.rl_tamanio.removeClass('d-none');
menu_off = false;
}
else {
this.rl_tamanio.addClass('d-none');
}
}
else {
if (this.papelFormatoId.val() != null) {
this.rl_tamanio.text(this.papelFormatoId.find('option:selected').text());
this.rl_tamanio.removeClass('d-none');
menu_off = false;
}
else {
this.rl_tamanio.addClass('d-none');
}
}
const tiradas = this.getTiradas();
if (tiradas.length > 0) {
this.rl_tiradas.text(tiradas.join(', '));
this.rl_tiradas.removeClass('d-none');
}
else
this.rl_tiradas.addClass('d-none');
if (this.paginas.val() > 0) {
this.rl_paginas.text(this.paginas.val() + " páginas");
this.rl_paginas.removeClass('d-none');
}
else
this.rl_paginas.addClass('d-none');
if (!menu_off)
this.rl_datos_generales.removeClass('d-none');
else
this.rl_datos_generales.addClass('d-none');
// servicios extra
menu_off = true;
if(this.prototipo.is(':checked')){
this.rl_prototipo.removeClass("d-none");
menu_off = false;
}
else{
this.rl_prototipo.addClass('d-none');
}
if(!menu_off){
this.rl_servicios_extra.removeClass('d-none');
}
else{
this.rl_servicios_extra.addClass('d-none');
}
}
cargarDatos(datos) {
this.titulo.val(datos.titulo);

View File

@ -66,6 +66,17 @@ class DisenioCubierta {
this.fresado = $(this.domItem.find("#fresado")[0]);
this.cosido = $(this.domItem.find("#cosido")[0]);
this.rl_cubierta = $(".rl-cubierta");
this.rl_papel_cubierta = $("#rl_papel_cubierta");
this.rl_caras_cubierta = $("#rl_caras_cubierta");
this.rl_acabado_cubierta = $("#rl_acabado_cubierta");
this.rl_sobrecubierta = $(".rl-sobrecubierta");
this.rl_no_sobrecubierta = $("#rl_no_sobrecubierta");
this.rl_papel_sobrecubierta = $('#rl_papel_sobrecubierta');
this.rl_tamanio_sobrecubierta = $('#rl_tamanio_sobrecubierta');
this.rl_acabado_sobrecubierta = $("#rl_acabado_sobrecubierta");
this.initValidation();
// Creamos un nuevo observador que detecta cambios en los atributos
@ -324,6 +335,69 @@ class DisenioCubierta {
}
processMenuLateral() {
let menu_off = true;
if($('.papel-cubierta.selected').length>0 && this.getGramaje() != null){
this.rl_papel_cubierta.text($($('.papel-cubierta.selected').find('.form-label')).text() + " " +
this.getGramaje() + " gr");
this.rl_acabado_cubierta.text(this.domItem.find("#plastificado").children("option:selected").text());
this.rl_papel_cubierta.removeClass('d-none');
this.rl_acabado_cubierta.removeClass('d-none');
if(this.carasCubierta.find('option:selected').length>0){
this.rl_caras_cubierta.text("Impresa " + this.carasCubierta.find('option:selected').text());
this.rl_caras_cubierta.removeClass('d-none');
menu_off = false;
}
else{
this.rl_caras_cubierta.addClass('d-none');
}
menu_off = false;
}
else{
this.rl_papel_cubierta.addClass('d-none');
this.rl_acabado_cubierta.addClass('d-none');
}
if (!menu_off)
this.rl_cubierta.removeClass('d-none');
else
this.rl_cubierta.addClass('d-none');
// Sobrecubierta solo se muestra si cubierta ok
if(!this.rl_cubierta.hasClass('d-none')){
this.rl_sobrecubierta.removeClass('d-none');
if(!this.sobrecubierta.is(":checked")){
this.rl_no_sobrecubierta.removeClass('d-none');
this.rl_papel_sobrecubierta.addClass('d-none');
this.rl_tamanio_sobrecubierta.addClass('d-none');
this.rl_acabado_sobrecubierta.addClass('d-none');
}
else{
this.rl_no_sobrecubierta.addClass('d-none');
this.rl_papel_sobrecubierta.removeClass('d-none');
this.rl_tamanio_sobrecubierta.removeClass('d-none');
this.rl_acabado_sobrecubierta.removeClass('d-none');
const sobrecubierta = this.getSobrecubierta(true);
this.rl_papel_sobrecubierta.text(sobrecubierta.papel + " " + sobrecubierta.gramaje + " gr")
this.rl_tamanio_sobrecubierta.text("Solapas: " + sobrecubierta.solapas + " mm")
let acabado_text = sobrecubierta.plastificado;
if(acabado_text.includes("Sin plastificar"))
acabado_text = "Sin plastificar";
this.rl_acabado_sobrecubierta.text(acabado_text);
}
}
else{
this.rl_sobrecubierta.addClass('d-none');
}
}
getSolapasCubierta() {
try {

View File

@ -59,6 +59,11 @@ class DisenioInterior {
this.checksGramaje = $('.gramaje-interior');
this.rl_interior = $(".rl-interior");
this.rl_tipo_interior = $("#rl_tipo_interior");
this.rl_papel_interior = $("#rl_papel_interior");
this.rl_papel_interior_color = $("#rl_papel_interior_color");
this.initValidation();
// Creamos un nuevo observador que detecta cambios en los atributos
@ -370,9 +375,7 @@ class DisenioInterior {
});
}
getIsHq() {
try {
@ -394,6 +397,43 @@ class DisenioInterior {
}
}
processMenuLateral() {
let menu_off = true;
this.rl_tipo_interior.removeClass('d-none');
const HQ = this.getIsHq();
const color = $("#paginasColor").val()>0?true:false;
const papelInterior = this.getPapel(true);
const gramajeInterior = this.getGramaje();
if (HQ != null && papelInterior != null && gramajeInterior != null) {
menu_off = false;
if ($(".interior-color").hasClass('d-none')) {
if (!this.rl_papel_interior_color.hasClass('d-none')) {
this.rl_papel_interior_color.addClass('d-none');
}
const impInterior = (color ? "Color " : "Blanco y Negro ") + (HQ ? "Premium" : "Estándar");
this.rl_tipo_interior.text(impInterior);
this.rl_papel_interior.text(papelInterior + " " + gramajeInterior + "gr");
}
else {
this.rl_papel_interior_color.removeClass('d-none');
const impInterior = ("Negro " + (HQ.negro ? "Premium" : "Estándar") + " / Color " + (HQ.color ? "Premium" : "Estándar"));
this.rl_tipo_interior.text(impInterior);
this.rl_papel_interior.text(papelInterior.negro + " " + gramajeInterior.negro + "gr");
this.rl_papel_interior_color.text(papelInterior.color + " " + gramajeInterior.color + "gr");
}
}
if (!menu_off)
this.rl_interior.removeClass('d-none');
else
this.rl_interior.addClass('d-none');
}
getPapel(forResumen = false) {

View File

@ -27,6 +27,10 @@ class PresupuestoCliente {
this.lc = $("#lc");
this.lsc = $("#lsc");
this.rl_interior = $(".rl-interior");
this.rl_cubierta = $(".rl-cubierta");
this.rl_sobrecubierta = $(".rl-sobrecubierta");
this.datosGenerales = new DatosGenerales($("#datos-generales"), this.clientePresupuestoWizard, this.validationStepper);
this.disenioInterior = new DisenioInterior($("#interior-libro"), this.clientePresupuestoWizard, this.validationStepper);
this.disenioCubierta = new DisenioCubierta($("#cubierta-libro"), this.clientePresupuestoWizard, this.validationStepper);
@ -45,6 +49,10 @@ class PresupuestoCliente {
this.actualizarTiradasEnvio = false;
this.calcularPresupuesto = false;
if(!window.location.href.includes("edit")) {
this.#processResumenLateral();
}
}
@ -84,7 +92,10 @@ class PresupuestoCliente {
if (window.location.href.includes("edit")) {
this.#cargarPresupuesto();
setTimeout(() => {
this.#cargarPresupuesto();
}, 0);
const successMessage = sessionStorage.getItem('message');
if (successMessage) {
popSuccessAlert(successMessage);
@ -99,6 +110,14 @@ class PresupuestoCliente {
}
#processResumenLateral() {
this.datosGenerales.processMenuLateral();
this.disenioInterior.processMenuLateral();
this.disenioCubierta.processMenuLateral();
}
#checkTiradas() {
let tiradas = [parseInt(this.datosGenerales.tirada1.val())];
@ -135,6 +154,8 @@ class PresupuestoCliente {
checkForm(event) {
this.#processResumenLateral();
if (!this.#checkTiradas()) {
return;
}
@ -194,12 +215,21 @@ class PresupuestoCliente {
return;
}
if (nextElement === 'resumen-libro') {
$(".rl-item").addClass('d-none');
}
if (currentElement !== 'resumen-libro') {
this.#validateCurrentForm(currentElement, nextElement);
}
else {
this.#goToForm(nextElement);
}
if(!nextElement.includes('resumen-libro'))
this.#processResumenLateral();
else{
$(".rl-item").addClass('d-none');
}
}
#goToForm(form) {
@ -695,6 +725,8 @@ class PresupuestoCliente {
}
async function validateForm(formValidation) {
try {
const validationResult = await formValidation.validate();

View File

@ -201,7 +201,7 @@ class Resumen {
generate() {
this.titulo.text(this.datosGenerales.titulo.val());
this.tipoLibro.text(this.#capitalizeFirstLetter(this.datosGenerales.tiposLibro.filter('.selected').attr('id')));
this.tipoLibro.text(this.capitalizeFirstLetter(this.datosGenerales.tiposLibro.filter('.selected').attr('id')));
let ancho = 0, alto = 0;
if (this.datosGenerales.checkFormatoPersonalizado.is(':checked')) {
@ -246,7 +246,7 @@ class Resumen {
if ($(".interior-color").hasClass('d-none')) {
this.domItem.find(".mismoInterior").removeClass('d-none');
this.domItem.find(".diferenteInterior").addClass('d-none');
const impInterior = (color ? "Color " : "Blanco y Negro") + (HQ ? "Premium" : "Estándar");
const impInterior = (color ? "Color " : "Blanco y Negro ") + (HQ ? "Premium" : "Estándar");
this.impresionInterior.text(impInterior);
this.papelInterior.text(papelInterior);
this.gramajeInterior.text(gramajeInterior);
@ -254,7 +254,7 @@ class Resumen {
else {
this.domItem.find(".mismoInterior").addClass('d-none');
this.domItem.find(".diferenteInterior").removeClass('d-none');
const impInterior = ("Negro " + (HQ.negro ? "Premium" : "Estándar") + " / Color" + (HQ.color ? "Premium" : "Estándar"));
const impInterior = ("Negro " + (HQ.negro ? "Premium" : "Estándar") + " / Color " + (HQ.color ? "Premium" : "Estándar"));
this.impresionInterior.text(impInterior);
this.papelInteriorNegro.text(papelInterior.negro);
this.papelInteriorColor.text(papelInterior.color);
@ -346,7 +346,7 @@ class Resumen {
}
#capitalizeFirstLetter(string) {
capitalizeFirstLetter(string) {
return string.charAt(0).toUpperCase() + string.slice(1);
}

View File

@ -472,4 +472,8 @@
background-color: var(--white);
transform: translate3d(0, 0, 1px) rotateY(0);
}
}
.texto-resumen-lateral{
font-size: 0.9em;
}