terminada la vista cubierta

This commit is contained in:
2024-10-08 13:20:22 +02:00
parent 2e2888ec26
commit 1d3f817709
9 changed files with 402 additions and 292 deletions

View File

@ -118,6 +118,17 @@ return [
'cobre' => 'Cobre',
'bronce' => 'Bronce',
'retractiladoTitle' => 'Retractilado',
'papelSobrecubierta' => 'Papel sobrecubierta',
'tamanioSolapasSobrecubierta' => 'Tamaño solapas sobrecubierta',
'plastificadoSobrecubierta' => 'Plastificado sobrecubierta',
'faja' => 'Faja',
'altoFaja' => 'Alto faja',
'papelFaja' => 'Papel faja',
'tamanioSolapasFaja' => 'Tamaño solapas faja',
'plastificadoFaja' => 'Plastificado faja',
'estucadoMate170gr' => 'Estucado mate 170 gr',
'estucadoMate200gr' => 'Estucado mate 200 gr',
'fajaColor' => 'Imprimir faja a color',
'compInteriorPlana' => 'Interior en plana',
'compInteriorRotativa' => 'Interior en rotativa',
@ -346,6 +357,8 @@ return [
'integer_greatherThan_0' => 'Número entero > 0 requerido',
'tirada_no_valida' => "Tirada no valida",
'sin_gramaje' => "Seleccione gramaje",
'tipo_cubierta' => 'Seleccione tipo de cubierta',
'opcion_solapas' => 'Seleccione la opción para las solapas',
],
'errores' => [

View File

@ -9,27 +9,35 @@
</div><!--//.mb-3 -->
<div class="col-sm-8 mb-5 d-flex flex-column align-items-center">
<h6 class="mb-1 text-center"> Recuerde que la cubierta es el conjunto formado por la portada, contraportada, lomo y solapas, en caso de que las lleve. </h6>
<h6 class="mb-1 text-center"> Recuerde que la cubierta es el conjunto formado por la portada, contraportada,
lomo y solapas, en caso de que las lleve. </h6>
</div><!--//.mb-3 -->
<div id="divTipoCubierta" name="div_tipo_cubierta" class="row col-sm-10 mb-5 justify-content-center">
<div id="tapaBlanda" class="d-flex flex-column align-items-center justify-content-center tipo-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/tapa-blanda.jpg") ?>" alt="TapaBlanda">
<div id="tapaBlanda"
class="d-flex flex-column align-items-center justify-content-center tipo-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/tapa-blanda.jpg") ?>"
alt="TapaBlanda">
<label class="form-label">
Tapa blanda
</label>
</div>
<div id="tapaDura" class="d-flex flex-column align-items-center justify-content-center tipo-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/tapa-dura-lomo-recto.jpg") ?>" alt="TapaDura">
<div id="tapaDura"
class="d-flex flex-column align-items-center justify-content-center tipo-cubierta imagen-selector image-container">
<img class="image-presupuesto"
src="<?= site_url("assets/img/presupuestoCliente/tapa-dura-lomo-recto.jpg") ?>" alt="TapaDura">
<label class="form-label">
Tapa dura lomo recto
</label>
</div>
<div id="tapaDuraLomoRedondo" class="d-flex flex-column align-items-center justify-content-center tipo-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/tapa-dura-lomo-redondo.png") ?>" alt="TapaDuraLomoRedondo">
<div id="tapaDuraLomoRedondo"
class="d-flex flex-column align-items-center justify-content-center tipo-cubierta imagen-selector image-container">
<img class="image-presupuesto"
src="<?= site_url("assets/img/presupuestoCliente/tapa-dura-lomo-redondo.png") ?>"
alt="TapaDuraLomoRedondo">
<label class="form-label">
Tapa dura lomo redondo
</label>
@ -40,25 +48,31 @@
<div id="divSolapasCubierta" name="div_solapas_cubierta" class="row col-sm-10 mb-5 justify-content-center d-none">
<div id="solapasCubiertaNo" class="d-flex flex-column align-items-center justify-content-center solapas-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/sinSolapasCubierta.png") ?>" alt="Sin solapas">
<div id="solapasCubiertaNo"
class="d-flex flex-column align-items-center justify-content-center solapas-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/sinSolapasCubierta.png") ?>"
alt="Sin solapas">
<label class="form-label">
Sin solapas
</label>
</div>
<div id="solapasCubiertaSi" class="d-flex flex-column align-items-center justify-content-center solapas-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/conSolapasCubierta.png") ?>" alt="Con solapas">
<div id="solapasCubiertaSi"
class="d-flex flex-column align-items-center justify-content-center solapas-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/conSolapasCubierta.png") ?>"
alt="Con solapas">
<label class="form-label">
Con solapas
</label>
</div>
<div id="divTamanioSolapas" class="d-flex flex-column align-items-center justify-content-center image-container d-none">
<div id="divTamanioSolapas"
class="d-flex flex-column align-items-center justify-content-center image-container d-none">
<label for="solapasCubierta" class="form-label">
Tamaño solapas
</label>
<input id="solapasCubierta" name="solapas_cubierta" type="number" class="calcular-presupuesto form-control text-center num-input" min="60" max="120" step="1" value="60">
<input id="solapasCubierta" name="solapas_cubierta" type="number"
class="calcular-presupuesto form-control text-center num-input" min="60" max="120" step="1" value="60">
<div class="form-text">
Entre 60 y 120 mm
</div>
@ -83,7 +97,8 @@
<label for="guardasImpresas" class="form-label">
<?= lang('Presupuestos.guardasImpresas') ?>
</label>
<select class="form-select select2bs2 calcular-presupuesto" id="guardasImpresas" name="guardas_impresas">
<select class="form-select select2bs2 calcular-presupuesto" id="guardasImpresas"
name="guardas_impresas">
<option value="0"><?= lang('Presupuestos.sinImpresion') ?></option>
<option value="1"><?= lang('Presupuestos.unaCara') ?></option>
<option value="2"><?= lang('Presupuestos.dosCaras') ?></option>
@ -109,17 +124,21 @@
<h3 class="mb-1 fw-bold"> Papel cubierta </h3>
</div><!--//.mb-3 -->
<div id="divPapelCubierta" name="div_papel_cubierta" class="row col-sm-10 mb-3 justify-content-center">
<div id="divPapelCubierta" name="div_papel_cubierta" class="row col-sm-10 mb-5 justify-content-center">
<div id="cartulinaEstucada" class="min-width-fit d-flex flex-column align-items-center justify-content-center papel-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/cartulina-grafica.png") ?>" alt="Cartulina estucada">
<div id="cartulinaEstucada"
class="min-width-fit d-flex flex-column align-items-center justify-content-center papel-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/cartulina-grafica.png") ?>"
alt="Cartulina estucada">
<label class="form-label">
Cartulina gráfica estucada a una cara
</label>
</div>
<div id="estucadoMate" class="min-width-fit d-flex flex-column align-items-center justify-content-center papel-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/estucado-mate-cubierta.png") ?>" alt="Estucado mate">
<div id="estucadoMate"
class="min-width-fit d-flex flex-column align-items-center justify-content-center papel-cubierta imagen-selector image-container">
<img class="image-presupuesto"
src="<?= site_url("assets/img/presupuestoCliente/estucado-mate-cubierta.png") ?>" alt="Estucado mate">
<label class="form-label">
Estucado Mate
</label>
@ -127,49 +146,53 @@
</div>
<div id="divGramajeCubierta" name="div_gramaje_interior_color" class="row col-sm-10 mb-3 justify-content-center d-none">
<div id="divGramajeCubierta" name="div_gramaje_cubierta" class="row col-sm-10 mb-3 justify-content-center d-none">
<div id="divGramaje170Cubierta" class="checkbox-presupuesto-container col-md mb-md-0 mb-2">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-cubierta">
<label class="form-check-label custom-option-content" for="gramaje170Cubierta">
<span class="custom-option-body">
<span class="custom-option-title"> 170 gr </span>
</span>
<input id="gramaje170Cubierta" name="gramajeCubiertaRadio" data-value="170" class="form-check-input" type="radio" value="170" />
<input id="gramaje170Cubierta" name="gramajeCubiertaRadio" data-value="170"
class="check-gramaje-cubierta form-check-input" type="radio" value="170" />
</label>
</div>
</div>
<div id="divGramaje240Cubierta" class="checkbox-presupuesto-container col-md mb-md-0 mb-2">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="gramaje240Cubierta">
<div id="divGramaje250Cubierta" class="checkbox-presupuesto-container col-md mb-md-0 mb-2">
<div class="form-check custom-option custom-option-icon gramaje-cubierta">
<label class="form-check-label custom-option-content" for="gramaje250Cubierta">
<span class="custom-option-body">
<span class="custom-option-title"> 240 gr </span>
<span class="custom-option-title"> 250 gr </span>
</span>
<input id="gramaje240Cubierta" name="gramajeCubiertaRadio" data-value="240" class="form-check-input" type="radio" value="240" />
<input id="gramaje250Cubierta" name="gramajeCubiertaRadio" data-value="250"
class="check-gramaje-cubierta form-check-input" type="radio" value="250" />
</label>
</div>
</div>
<div id="divGramaje270Cubierta" class="checkbox-presupuesto-container col-md mb-md-0 mb-2">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-cubierta">
<label class="form-check-label custom-option-content" for="gramaje270Cubierta">
<span class="custom-option-body">
<span class="custom-option-title"> 270 gr </span>
</span>
<input id="gramaje270Cubierta" name="gramajeCubiertaRadio" data-value="270" class="form-check-input" type="radio" value="270" />
<input id="gramaje270Cubierta" name="gramajeCubiertaRadio" data-value="270"
class="check-gramaje-cubierta form-check-input" type="radio" value="270" />
</label>
</div>
</div>
<div id="divGramaje300Cubierta" class="checkbox-presupuesto-container col-md mb-md-0 mb-2">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-cubierta">
<label class="form-check-label custom-option-content" for="gramaje300Cubierta">
<span class="custom-option-body">
<span class="custom-option-title"> 300 gr </span>
</span>
<input id="gramaje300Cubierta" name="gramajeCubiertaRadio" data-value="300" class="form-check-input" type="radio" value="300" />
<input id="gramaje300Cubierta" name="gramajeCubiertaRadio" data-value="300"
class="check-gramaje-cubierta form-check-input" type="radio" value="300" />
</label>
</div>
<div class="form-text">
@ -178,12 +201,13 @@
</div>
<div id="divGramaje350Cubierta" class="checkbox-presupuesto-container col-md mb-md-0 mb-2">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-cubierta">
<label class="form-check-label custom-option-content" for="gramaje350Cubierta">
<span class="custom-option-body">
<span class="custom-option-title"> 350 gr </span>
</span>
<input id="gramaje350Cubierta" name="gramajeCubiertaRadio" data-value="350" class="form-check-input" type="radio" value="350" />
<input id="gramaje350Cubierta" name="gramajeCubiertaRadio" data-value="350"
class="check-gramaje-cubierta form-check-input" type="radio" value="350" />
</label>
</div>
</div>
@ -200,6 +224,7 @@
<div class="row col-sm-12 mb-5 justify-content-center">
<div class="row justify-content-center">
<div class="col-sm-3">
<label for="plastificado" class="form-label">
<?= lang('Presupuestos.plastificado') ?>
@ -240,8 +265,10 @@
</select>
</div>
<div id="solapasCubiertaNo" class="d-flex flex-column align-items-center justify-content-center solapas-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/retractilado.png") ?>" alt="Retractilado">
<div id="solapasCubiertaNo"
class="d-flex flex-column align-items-center justify-content-center solapas-cubierta imagen-selector image-container">
<img class="image-presupuesto" src="<?= site_url("assets/img/presupuestoCliente/retractilado.png") ?>"
alt="Retractilado">
<label class="form-label">
Retractilado
</label>
@ -250,4 +277,125 @@
</div>
</div>
<hr class="col-sm-10 my-10">
<div class="col-sm-8 mb-3 d-flex flex-column align-items-center">
<h3 class="mb-1 fw-bold"> Extras </h3>
</div><!--//.mb-3 -->
<div class="row col-sm-12 mb-3 justify-content-center">
<div class="row justify-content-center">
<div class="row col-sm-3 mb-3 d-flex flex-column align-items-center">
<div class="form-check form-switch mb-2">
<input class="calcular-presupuesto form-check-input" type="checkbox" id="addSobrecubierta"
name="add_sobrecubierta" value="1">
<label class="form-check-label"
for="addSobrecubierta"><?= lang('Presupuestos.sobrecubierta') ?></label>
</div>
</div>
<div class="col-sm-3 config-sobrecubierta d-none">
<label for="papelFaja" class="form-label">
<?= lang('Presupuestos.papelSobrecubierta') ?>
</label>
<select class="form-select select2bs2 calcular-presupuesto" id="papelFaja"
name="papel_sobrecubierta">
<option value="ESTMAT170"><?= lang('Presupuestos.estucadoMate170gr') ?></option>
<option value="ESTMAT200"><?= lang('Presupuestos.estucadoMate170gr') ?></option>
</select>
</div>
<div class="col-sm-3 config-sobrecubierta d-none">
<label for="solapasSobrecubierta" class="form-label">
<?= lang('Presupuestos.tamanioSolapasSobrecubierta') ?>
</label>
<input id="solapasSobrecubierta" name="solapas_sobrecubierta" type="number"
class="calcular-presupuesto form-control text-center num-input" min="60" max="120" step="1" value="60">
<div class="form-text">
Entre 60 y 120 mm
</div>
</div>
<div class="col-sm-3 config-sobrecubierta d-none">
<label for="plastificadoFaja" class="form-label">
<?= lang('Presupuestos.plastificadoFaja') ?>
</label>
<select class="form-select select2bs2 calcular-presupuesto" id="plastificadoFaja"
name="plastificado_faja">
<option value=""> - </option>
<option value="BRIL"><?= lang('Presupuestos.brillo') ?></option>
<option value="MATE"><?= lang('Presupuestos.mate') ?></option>
<option value="ANTI"><?= lang('Presupuestos.antirrayado') ?></option>
</select>
</div>
</div>
</div>
<div class="row col-sm-12 mb-0 justify-content-center">
<div class="row justify-content-center">
<div class="row col-sm-2 mb-3 d-flex flex-column align-items-center">
<div class="form-check form-switch mb-2">
<input class="calcular-presupuesto form-check-input" type="checkbox" id="addFaja"
name="add_faja" value="1">
<label class="form-check-label"
for="addFaja"><?= lang('Presupuestos.faja') ?></label>
</div>
</div>
<div class="col-sm-2 config-faja d-none">
<label for="altoFaja" class="form-label">
<?= lang('Presupuestos.altoFaja') ?>
</label>
<input id="altoFaja" name="alto_faja" type="number"
class="calcular-presupuesto form-control text-center num-input" min="60" step="1" value="60">
<div class="form-text">
Mayor 60 mm
</div>
</div>
<div class="col-sm-3 config-faja d-none">
<label for="barniz" class="form-label">
<?= lang('Presupuestos.papelFaja') ?>
</label>
<select class="form-select select2bs2 calcular-presupuesto" id="papelSobrecubierta"
name="papel_sobrecubierta">
<option value="ESTMAT170"><?= lang('Presupuestos.estucadoMate170gr') ?></option>
<option value="ESTMAT200"><?= lang('Presupuestos.estucadoMate170gr') ?></option>
</select>
</div>
<div class="col-sm-2 config-faja d-none">
<label for="solapasFaja" class="form-label">
<?= lang('Presupuestos.tamanioSolapasFaja') ?>
</label>
<input id="solapasFaja" name="solapas_faja" type="number"
class="calcular-presupuesto form-control text-center num-input" min="60" max="120" step="1" value="60">
<div class="form-text">
Entre 60 y 120 mm
</div>
</div>
<div class="col-sm-3 config-faja d-none">
<label for="plastificadoSobrecubierta" class="form-label">
<?= lang('Presupuestos.plastificadoSobrecubierta') ?>
</label>
<select class="form-select select2bs2 calcular-presupuesto" id="plastificadoSobrecubierta"
name="plastificado_sobrecubierta">
<option value=""> - </option>
<option value="BRIL"><?= lang('Presupuestos.brillo') ?></option>
<option value="MATE"><?= lang('Presupuestos.mate') ?></option>
<option value="ANTI"><?= lang('Presupuestos.antirrayado') ?></option>
</select>
</div>
</div>
</div>
</div>

View File

@ -82,7 +82,7 @@
<div id="divGramajeInterior" name="div_gramaje_interior" class="row col-sm-10 mb-3 justify-content-center d-none">
<div id="interiorGramaje70" class="checkbox-presupuesto-container col-md mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje70">
<span class="custom-option-body">
<span class="custom-option-title"> 70 gr </span>
@ -93,7 +93,7 @@
</div>
<div id="interiorGramaje80" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje80">
<span class="custom-option-body">
<span class="custom-option-title"> 80 gr </span>
@ -104,7 +104,7 @@
</div>
<div id="interiorGramaje90" class="mb-md-0 mb-3 checkbox-presupuesto-container">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje90">
<span class="custom-option-body">
<span class="custom-option-title"> 90 gr </span>
@ -115,7 +115,7 @@
</div>
<div id="interiorGramaje100" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje100">
<span class="custom-option-body">
<span class="custom-option-title"> 100 gr </span>
@ -126,7 +126,7 @@
</div>
<div id="interiorGramaje115" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje115">
<span class="custom-option-body">
<span class="custom-option-title"> 115 gr </span>
@ -137,7 +137,7 @@
</div>
<div id="interiorGramaje120" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje120">
<span class="custom-option-body">
<span class="custom-option-title"> 120 gr </span>
@ -148,7 +148,7 @@
</div>
<div id="interiorGramaje135" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje135">
<span class="custom-option-body">
<span class="custom-option-title"> 135 gr </span>
@ -159,7 +159,7 @@
</div>
<div id="interiorGramaje150" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje150">
<span class="custom-option-body">
<span class="custom-option-title"> 150 gr </span>
@ -170,7 +170,7 @@
</div>
<div id="interiorGramaje170" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje170">
<span class="custom-option-body">
<span class="custom-option-title"> 170 gr </span>
@ -248,7 +248,7 @@
<div id="divGramajeInteriorColor" name="div_gramaje_interior_color" class="row col-sm-10 mb-3 justify-content-center d-none">
<div id="interiorGramaje70Color" class="checkbox-presupuesto-container col-md mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje70">
<span class="custom-option-body">
<span class="custom-option-title"> 70 gr </span>
@ -259,7 +259,7 @@
</div>
<div id="interiorGramaje80Color" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje80">
<span class="custom-option-body">
<span class="custom-option-title"> 80 gr </span>
@ -270,7 +270,7 @@
</div>
<div id="interiorGramaje90Color" class="mb-md-0 mb-3 checkbox-presupuesto-container">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje90">
<span class="custom-option-body">
<span class="custom-option-title"> 90 gr </span>
@ -281,7 +281,7 @@
</div>
<div id="interiorGramaje100Color" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje100">
<span class="custom-option-body">
<span class="custom-option-title"> 100 gr </span>
@ -292,7 +292,7 @@
</div>
<div id="interiorGramaje115Color" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje115">
<span class="custom-option-body">
<span class="custom-option-title"> 115 gr </span>
@ -303,7 +303,7 @@
</div>
<div id="interiorGramaje120Color" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje120">
<span class="custom-option-body">
<span class="custom-option-title"> 120 gr </span>
@ -314,7 +314,7 @@
</div>
<div id="interiorGramaje135Color" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje135">
<span class="custom-option-body">
<span class="custom-option-title"> 135 gr </span>
@ -325,7 +325,7 @@
</div>
<div id="interiorGramaje150Color" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje150">
<span class="custom-option-body">
<span class="custom-option-title"> 150 gr </span>
@ -336,7 +336,7 @@
</div>
<div id="interiorGramaje170Color" class="checkbox-presupuesto-container mb-md-0 mb-3">
<div class="form-check custom-option custom-option-icon">
<div class="form-check custom-option custom-option-icon gramaje-interior">
<label class="form-check-label custom-option-content" for="gramaje170">
<span class="custom-option-body">
<span class="custom-option-title"> 170 gr </span>

View File

@ -47,6 +47,15 @@
</span>
</button>
</div>
<div class="step" data-target="#direcciones-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">
<span class="bs-stepper-title">Direcciones</span>
</span>
</button>
</div>
<div class="line"></div>
@ -75,6 +84,12 @@
<?= view("themes/vuexy/form/presupuestos/cliente/items/_disenioCubierta") ?>
</div>
</div>
<div id="direcciones-libro" class="content fv-plugins-bootstrap5 fv-plugins-framework">
<div class="row g-3">
<?= view("themes/vuexy/form/presupuestos/cliente/items/_direcciones") ?>
</div>
</div>
<?= view("themes/vuexy/form/presupuestos/cliente/items/_buttons") ?>

View File

@ -54,7 +54,6 @@ class DatosGenerales {
this.papelDiferente.on('change', this.#handlePapelDiferente.bind(this));
this.titulo.on('change', () => { $(".titulo").html(this.titulo.val()); });
this.papelDiferente.on('change', () => { $(".titulo").html(this.titulo.val()); });
}
initValidation() {

View File

@ -27,11 +27,22 @@ class DisenioCubierta {
this.divGramajeCubierta = this.domItem.find("#divGramajeCubierta");
this.gramaje170 = $(this.domItem.find("#divGramaje170Cubierta"));
this.gramaje240 = $(this.domItem.find("#divGramaje240Cubierta"));
this.gramaje250 = $(this.domItem.find("#divGramaje250Cubierta"));
this.gramaje270 = $(this.domItem.find("#divGramaje270Cubierta"));
this.gramaje300 = $(this.domItem.find("#divGramaje300Cubierta"));
this.gramaje350 = $(this.domItem.find("#divGramaje350Cubierta"));
this.checksGramaje = $('.check-gramaje-cubierta');
this.configuracionSobrecubierta = this.domItem.find(".config-sobrecubierta");
this.sobrecubierta = this.domItem.find("#addSobrecubierta");
this.configuracionFaja = this.domItem.find(".config-faja");
this.faja = this.domItem.find("#addFaja");
this.solapasSobrecubierta = this.domItem.find("#solapasSobrecubierta");
this.solapasFaja = this.domItem.find("#solapasFaja");
this.altoFaja = this.domItem.find("#altoFaja");
this.initValidation();
// Creamos un nuevo observador que detecta cambios en los atributos
@ -46,6 +57,9 @@ class DisenioCubierta {
else if (targetElement.classList.contains('solapas-cubierta')) {
this.#handleMenuSolapas();
}
else if (targetElement.classList.contains('papel-cubierta')) {
this.#handleMenuPapel();
}
}
});
});
@ -54,19 +68,41 @@ class DisenioCubierta {
init() {
const self = this;
// Eventos
this.disenioCubierta.on('click', this.#handleDisenioCubierta.bind(this));
this.solapasCubierta.on('click', this.#handleSolapasCubierta.bind(this));
this.papelCubierta.on('click', this.#handlePapelCubierta.bind(this));
this.tamanioSolapasCubierta.on('change', this.#handleTamanioSolapas.bind(this));
this.altoFaja.on('blur', this.#handleInputs);
this.solapasSobrecubierta.on('blur', this.#handleInputs);
this.solapasFaja.on('blur', this.#handleInputs);
this.sobrecubierta.on('change', () => {
this.sobrecubierta.is(":checked") ? this.configuracionSobrecubierta.removeClass("d-none") : this.configuracionSobrecubierta.addClass("d-none") }
);
this.faja.on('change', () => {
this.faja.is(":checked") ? this.configuracionFaja.removeClass("d-none") : this.configuracionFaja.addClass("d-none") }
);
// Observadores
this.observer.observe(this.tapaBlanda[0], { attributes: true });
this.observer.observe(this.tapaDuraLomoRecto[0], { attributes: true });
this.observer.observe(this.tapaDuraLomoRedondo[0], { attributes: true });
this.observer.observe(this.cartulinaEstucada[0], { attributes: true });
this.observer.observe(this.estucadoMate[0], { attributes: true });
this.observer.observe(this.conSolapas[0], { attributes: true });
this.observer.observe(this.sinSolapas[0], { attributes: true });
this.checksGramaje.each(function () {
const customOptionEL = $(this);
customOptionEL.on('click', function () {
self.#handleClickGramaje(customOptionEL);
});
});
}
initValidation() {
@ -75,21 +111,21 @@ class DisenioCubierta {
this.formValidation = FormValidation.formValidation(this.wizardStep, {
fields: {
div_impresion_interior: {
div_tipo_cubierta: {
validators: {
callback: {
callback: function (input) {
const divImpresionInterior = $('#divImpresionInterior'); // Selecciona el div
const div = $('#divTipoCubierta'); // Selecciona el div
divImpresionInterior.find('.fv-plugins-message-container').remove();
if ($('.disenio-interior.selected').length > 0) {
div.find('.fv-plugins-message-container').remove();
if ($('.tipo-cubierta.selected').length > 0) {
return true;
}
else {
divImpresionInterior.append(`
div.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].disenio_interior}
<div data-field="div_tipo_cubierta" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].tipo_cubierta}
</div>
</div>
`);
@ -99,20 +135,46 @@ class DisenioCubierta {
}
}
},
div_papel_interior: {
div_solapas_cubierta: {
validators: {
callback: {
callback: function (input) {
const divPapelInterior = $('#divPapelInterior'); // Selecciona el div
const div = $('#divSolapasCubierta');
if (div.hasClass("d-none")) return true;
divPapelInterior.find('.fv-plugins-message-container').remove();
if ($('.papel-interior.selected').length > 0) {
div.find('.fv-plugins-message-container').remove();
if ($('.solapas-cubierta.selected').length > 0) {
return true;
}
else {
divPapelInterior.append(`
div.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
<div data-field="div_solapas_cubierta" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].opcion_solapas}
</div>
</div>
`);
}
return false;
},
}
}
},
div_papel_cubierta: {
validators: {
callback: {
callback: function (input) {
const div = $('#divPapelCubierta');
if (div.hasClass("d-none")) return true;
div.find('.fv-plugins-message-container').remove();
if ($('.papel-cubierta.selected').length > 0) {
return true;
}
else {
div.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_papel_cubierta" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].papel_interior}
</div>
</div>
@ -123,96 +185,20 @@ class DisenioCubierta {
}
}
},
div_gramaje_interior: {
div_gramaje_cubierta: {
validators: {
callback: {
callback: function (input) {
const divGramajeInterior = $('#divGramajeInterior'); // Selecciona el div
if ($("#divGramajeInterior").hasClass("d-none")) return true;
divGramajeInterior.find('.fv-plugins-message-container').remove();
if ($('.check-interior-gramaje:checked').length > 0) {
const div = $('#divGramajeCubierta'); // Selecciona el div
div.find('.fv-plugins-message-container').remove();
if ($('.check-gramaje-cubierta:checked').length > 0) {
return true;
}
else {
divGramajeInterior.append(`
div.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].gramaje_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
div_impresion_interior_color: {
validators: {
callback: {
callback: function (input) {
const divImpresionInterior = $('#divImpresionInteriorColor'); // Selecciona el div
if (divImpresionInterior.hasClass("d-none")) return true;
divImpresionInterior.find('.fv-plugins-message-container').remove();
if ($('.disenio-interior-color.selected').length > 0) {
return true;
}
else {
divImpresionInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior_color" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].disenio_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
div_papel_interior_color: {
validators: {
callback: {
callback: function (input) {
const divPapelInterior = $('#divPapelInteriorColor'); // Selecciona el div
if (divPapelInterior.hasClass("d-none")) return true;
divPapelInterior.find('.fv-plugins-message-container').remove();
if ($('.papel-interior.selected').length > 0) {
return true;
}
else {
divPapelInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].papel_interior}
</div>
</div>
`);
}
return false;
},
}
}
},
div_gramaje_interior_color: {
validators: {
callback: {
callback: function (input) {
const divGramajeInterior = $('#divGramajeInteriorColor'); // Selecciona el div
if ($("#divGramajeInterior").hasClass("d-none")) return true;
divGramajeInterior.find('.fv-plugins-message-container').remove();
if ($('.check-interior-gramaje:checked').length > 0) {
return true;
}
else {
divGramajeInterior.append(`
<div class="fv-plugins-message-container invalid-feedback">
<div data-field="div_impresion_interior" data-validator="callback" style="margin-top: 50px;">
<div data-field="div_gramaje_cubierta" data-validator="callback" style="margin-top: 50px;">
${window.translations["validation"].gramaje_interior}
</div>
</div>
@ -234,12 +220,10 @@ class DisenioCubierta {
// field is the field name
// ele is the field element
switch (field) {
case 'div_impresion_interior':
case 'div_papel_interior':
case 'div_gramaje_interior':
case 'div_impresion_interior_color':
case 'div_papel_interior_color':
case 'div_gramaje_interior_color':
case 'div_tipo_cubierta':
case 'div_solapas_cubierta':
case 'div_papel_cubierta':
case 'div_gramaje_cubierta':
return '.col-sm-10';
default:
return '.col-sm-3';
@ -274,17 +258,17 @@ class DisenioCubierta {
$(".papel-cubierta").removeClass("selected");
if(this.tapaBlanda.hasClass("selected")){
if (this.tapaBlanda.hasClass("selected")) {
this.cartulinaEstucada.removeClass("d-none");
this.divGramajeCubierta.addClass("d-none");
}
else{
else {
this.cartulinaEstucada.addClass("d-none");
this.estucadoMate.addClass("selected");
this.divGramajeCubierta.removeClass("d-none");
this.gramaje170.removeClass("d-none");
this.gramaje170.closest(".checkbox-presupuesto-container").addClass("checked");
this.gramaje240.addClass("d-none");
this.gramaje250.addClass("d-none");
this.gramaje270.addClass("d-none");
this.gramaje300.addClass("d-none");
this.gramaje350.addClass("d-none");
@ -329,34 +313,78 @@ class DisenioCubierta {
element.closest('.image-presupuesto').toggleClass('selected');
}
#handleMenuTipoCubierta(){
#handleMenuTipoCubierta() {
if(this.tapaBlanda.hasClass("selected")){
if (this.tapaBlanda.hasClass("selected")) {
this.divSolapas.removeClass("d-none");
this.divConfigTapaDura.addClass("d-none");
}
else if(this.tapaDuraLomoRecto.hasClass("selected") || this.tapaDuraLomoRedondo.hasClass("selected")){
else if (this.tapaDuraLomoRecto.hasClass("selected") || this.tapaDuraLomoRedondo.hasClass("selected")) {
this.solapasCubierta.removeClass("selected");
this.divSolapas.addClass("d-none");
this.divConfigTapaDura.removeClass("d-none");
this.#handleMenuPapel();
}
else{
else {
this.divSolapas.addClass("d-none");
this.divConfigTapaDura.addClass("d-none");
this.#handleMenuPapel();
}
}
#handleMenuSolapas(){
if(this.conSolapas.hasClass("selected")){
#handleMenuSolapas() {
if (this.conSolapas.hasClass("selected")) {
this.divTamanioSolapas.removeClass("d-none");
}
else{
else {
this.divTamanioSolapas.addClass("d-none");
}
}
#handleMenuPapel() {
$(".check-gramaje-cubierta").prop("checked", false);
if(!this.tapaBlanda.hasClass("selected") && !this.tapaDuraLomoRecto.hasClass("selected") && !this.tapaDuraLomoRedondo.hasClass("selected")) {
this.divGramajeCubierta.addClass("d-none");
this.estucadoMate.removeClass("selected");
this.cartulinaEstucada.removeClass("selected");
return;
}
if (this.cartulinaEstucada.hasClass("selected")) {
this.divGramajeCubierta.removeClass("d-none");
this.gramaje170.addClass("d-none");
this.gramaje250.removeClass("d-none");
this.gramaje270.removeClass("d-none");
this.gramaje300.removeClass("d-none");
this.gramaje350.removeClass("d-none");
}
else if(this.estucadoMate.hasClass("selected")) {
if(this.tapaBlanda.hasClass("selected")) {
this.divGramajeCubierta.removeClass("d-none");
this.gramaje170.addClass("d-none");
this.gramaje250.removeClass("d-none");
this.gramaje270.addClass("d-none");
this.gramaje300.removeClass("d-none");
this.gramaje350.removeClass("d-none");
}
else{
this.divGramajeCubierta.removeClass("d-none");
this.gramaje170.removeClass("d-none");
this.gramaje250.addClass("d-none");
this.gramaje270.addClass("d-none");
this.gramaje300.addClass("d-none");
this.gramaje350.addClass("d-none");
$('#gramaje170Cubierta').trigger("click");
}
}
}
#handleTamanioSolapas() {
@ -371,127 +399,37 @@ class DisenioCubierta {
this.tamanioSolapasCubierta.val(max);
}
#handleClickGramaje(customOption) {
#handleUpdateGramaje() {
const el = customOption[0];
let showGramaje = false;
$(".check-interior-gramaje ").prop("checked", false);
if (this.negroEstandar.hasClass("selected") || this.colorEstandar.hasClass("selected")) {
if (this.offsetBlanco.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.removeClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.removeClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
if (el.checked) {
// If custom option element is radio, remove checked from the siblings (closest `.row`)
if (el.type === 'radio') {
const customRadioOptionList = [].slice.call(el.closest('.row').querySelectorAll('.custom-option'))
customRadioOptionList.map(function (customRadioOptionEL) {
customRadioOptionEL.closest('.custom-option').classList.remove('checked')
})
}
else if (this.offsetAhuesado.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.removeClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesadoVolumen.hasClass("selected")) {
this.gramaje70.removeClass("d-none");
this.gramaje80.addClass("d-none");
this.gramaje90.addClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.estucadoMate.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.addClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.removeClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
}
else if (this.negroPremium.hasClass("selected") || this.colorPremium.hasClass("selected")) {
if (this.offsetBlanco.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.removeClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.removeClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.removeClass("d-none");
this.gramaje170.removeClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesado.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.removeClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.removeClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.offsetAhuesadoVolumen.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.addClass("d-none");
this.gramaje90.addClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.addClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.addClass("d-none");
this.gramaje150.addClass("d-none");
this.gramaje170.addClass("d-none");
showGramaje = true;
}
else if (this.estucadoMate.hasClass("selected")) {
this.gramaje70.addClass("d-none");
this.gramaje80.addClass("d-none");
this.gramaje90.removeClass("d-none");
this.gramaje100.addClass("d-none");
this.gramaje115.removeClass("d-none");
this.gramaje120.addClass("d-none");
this.gramaje135.removeClass("d-none");
this.gramaje150.removeClass("d-none");
this.gramaje170.removeClass("d-none");
showGramaje = true;
}
}
if ($("#divGramajeInterior").hasClass("d-none") && showGramaje) {
$("#divGramajeInterior").removeClass("d-none");
}
else if (!showGramaje) {
$("#divGramajeInterior").addClass("d-none");
el.closest('.custom-option').classList.add('checked')
} else {
el.closest('.custom-option').classList.remove('checked')
}
}
#handleInputs() {
const id = $(this).attr('id');
const min = parseInt($('#' + id).attr('min'));
const max = parseInt($('#' + id).attr('max'));
if ($('#' + id).val() < min || $('#' + id).val() == '' || isNaN($('#' + id).val())) {
$('#' + id).val(min);
}
else if ($('#' + id).val() > max)
$('#' + id).val(max);
}
}

View File

@ -50,7 +50,7 @@ class DisenioInterior {
this.gramaje150_color = this.domItem.find("#interiorGramaje150Color");
this.gramaje170_color = this.domItem.find("#interiorGramaje170Color");
this.checksGramaje = $('.custom-option .form-check-input');
this.checksGramaje = $('.gramaje-interior');
this.initValidation();
@ -98,10 +98,6 @@ class DisenioInterior {
this.checksGramaje.each(function () {
const customOptionEL = $(this);
// Update custom options check on page load
//self.#handleClickGramaje(customOptionEL);
// Update custom options check on click
customOptionEL.on('click', function () {
self.#handleClickGramaje(customOptionEL);
});
@ -371,7 +367,8 @@ class DisenioInterior {
let showGramaje = false;
$(".check-interior-gramaje ").prop("checked", false);
$(".check-interior-color-gramaje ").prop("checked", false);
if (this.negroEstandar.hasClass("selected") || this.colorEstandar.hasClass("selected")) {
if (this.offsetBlanco.hasClass("selected")) {

View File

@ -40,7 +40,7 @@ class PresupuestoCliente {
this.disenioInterior.init();
this.disenioCubierta.init();
this.RELLENAR_PRESUPUESTO();
//this.RELLENAR_PRESUPUESTO();
}
@ -104,12 +104,12 @@ class PresupuestoCliente {
case 1:
this.disenioInterior.formValidation.validate();
break;
/*
case 2:
FormValidation4.validate();
this.disenioCubierta.formValidation.validate();
break;
/*
case 3:
FormValidation5.validate();
break;