mirror of
https://git.imnavajas.es/jjimenez/safekat.git
synced 2025-07-25 22:52:08 +00:00
arreglado todo
This commit is contained in:
94
httpdocs/assets/js/safekat/components/modalDireccion.js
Normal file
94
httpdocs/assets/js/safekat/components/modalDireccion.js
Normal file
@ -0,0 +1,94 @@
|
||||
class Direccionmodal {
|
||||
constructor(modal, saveCallback) {
|
||||
this.modal = modal;
|
||||
this.saveCallback = saveCallback;
|
||||
|
||||
this.alias = $(this.modal.find('#add_alias'));
|
||||
this.att = $(this.modal.find('#add_att'));
|
||||
this.email = $(this.modal.find('#add_email'));
|
||||
this.direccion = $(this.modal.find('#add_direccion'));
|
||||
this.pais = $(this.modal.find('#add_pais_id'));
|
||||
this.municipio = $(this.modal.find('#add_municipio'));
|
||||
this.provincia = $(this.modal.find('#add_provincia'));
|
||||
this.cp = $(this.modal.find('#add_cp'));
|
||||
this.telefono = $(this.modal.find('#add_telefono'));
|
||||
|
||||
this.btnCancel = $(this.modal.find('#cancelAdd'));
|
||||
this.btnSave = $(this.modal.find('#saveAdd'));
|
||||
|
||||
this.error = $(this.modal.find('.texto-error'));
|
||||
}
|
||||
|
||||
init() {
|
||||
this.btnCancel.on('click', () => {
|
||||
|
||||
this.modal.modal("hide");
|
||||
});
|
||||
|
||||
this.modal.on('hidden.bs.modal', () => {
|
||||
this.error.addClass('d-none');
|
||||
this.alias.val("");
|
||||
this.att.val("");
|
||||
this.email.val("");
|
||||
this.direccion.val("");
|
||||
this.pais.val("").trigger('change');
|
||||
this.municipio.val("");
|
||||
this.provincia.val("");
|
||||
this.cp.val("");
|
||||
this.telefono.val("");
|
||||
this.btnSave.off('click');
|
||||
});
|
||||
|
||||
this.pais.on('change', () => {
|
||||
var nombre_pais = $("#add_pais_id option:selected").text().trim();
|
||||
if (nombre_pais.localeCompare('España') == 0) {
|
||||
$('#divPais').removeClass('col-lg-12').addClass('col-lg-6')
|
||||
$('#divMunicipio').removeClass('col-lg-12').addClass('col-lg-6')
|
||||
$('.spain-data').css('display', 'inline')
|
||||
}
|
||||
else {
|
||||
$('.spain-data').css('display', 'none')
|
||||
$('#divPais').removeClass('col-lg-6').addClass('col-lg-12')
|
||||
$('#divMunicipio').removeClass('col-lg-6').addClass('col-lg-12')
|
||||
}
|
||||
});
|
||||
|
||||
this.btnSave.on('click', () => {
|
||||
if (this.#validatemodal()) {
|
||||
this.saveCallback();
|
||||
}
|
||||
else {
|
||||
$(this.modal.find('.texto-error')).removeClass('d-none');
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
this.modal.modal('show');
|
||||
}
|
||||
|
||||
#validatemodal() {
|
||||
|
||||
if(this.alias.val() == "" || this.att.val() == "" || this.direccion.val() == "" || this.municipio.val() == "" || this.cp.val() == "" ){
|
||||
return false;
|
||||
}
|
||||
if(this.pais.children("option:selected").val() < 1)
|
||||
return false;
|
||||
return true;
|
||||
}
|
||||
|
||||
getData() {
|
||||
return {
|
||||
alias: this.alias.val(),
|
||||
att: this.att.val(),
|
||||
email: this.email.val(),
|
||||
direccion: this.direccion.val(),
|
||||
pais_id: this.pais.children("option:selected").val(),
|
||||
municipio: this.municipio.val(),
|
||||
provincia: this.provincia.val(),
|
||||
cp: this.cp.val(),
|
||||
telefono: this.telefono.val()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default Direccionmodal;
|
||||
@ -0,0 +1,105 @@
|
||||
class tarjetaDireccion {
|
||||
|
||||
constructor(container, id, direccion) {
|
||||
|
||||
this.container = container;
|
||||
this.id = id;
|
||||
this.direccionId = direccion.id;
|
||||
this.card = this.#generateHTML(id, direccion);
|
||||
this.deleteBtn = this.card.find('.direccion-eliminar');
|
||||
this.editBtn = this.card.find('.direccion-editar');
|
||||
}
|
||||
|
||||
|
||||
#generateHTML(id, direccion) {
|
||||
|
||||
// Crear los elementos usando jQuery
|
||||
var $parent = $('<div>', {
|
||||
class: 'direccion-cliente col-sm-5 form-check custom-option custom-option-basic checked justify-content-center mb-4',
|
||||
id: id
|
||||
});
|
||||
|
||||
var $label = $('<label>', { class: 'form-check-label custom-option-content' });
|
||||
|
||||
var $header = $('<span>', { class: 'custom-option-header mb-2' });
|
||||
var $name = $('<h6>', { class: 'fw-semibold mb-0', text: direccion.att });
|
||||
var $unidades = $('<span>', { class: 'badge bg-label-primary unidades', text: direccion.unidades + ' unidades' });
|
||||
|
||||
var $body = $('<span>', { class: 'custom-option-body' });
|
||||
var $direccion = $('<small>', { class: 'address-direccion', text: direccion.direccion });
|
||||
var $cp = $('<small>', { class: 'address-cp', text: direccion.cp });
|
||||
var $municipioPais = $('<small>', { class: 'address-municipio-pais', text: direccion.municipio + ', '+ direccion.pais });
|
||||
var $telefono = $('<small>', { class: 'address-telefono', text: direccion.telefono });
|
||||
var $email = $('<small>', { class: 'address-email', text: direccion.email });
|
||||
|
||||
var $palets = $('<small>', {class: 'address-palets', html: '<i>Envío en palets</i>'});
|
||||
|
||||
var $hr = $('<hr>', { class: 'my-2' });
|
||||
var $eliminar = $('<a>', { class: 'ms-auto direccion-eliminar', href: 'javascript:void(0)', text: 'Eliminar' });
|
||||
var $editar = $('<a>', { class: 'me-auto direccion-editar', href: 'javascript:void(0)', text: 'Editar' });
|
||||
var $eliminarContainer = $('<span>', { class: 'd-flex w-100 position-relative' }).append($editar, $eliminar);
|
||||
|
||||
// Construir la estructura del HTML
|
||||
$header.append($name, $unidades);
|
||||
$body.append($direccion, '<br>', $cp, '<br>', $municipioPais, '<br>', $telefono, '<br>', $email, '<br>', $palets, '<br>', $hr, $eliminarContainer);
|
||||
$label.append($header, $body);
|
||||
$parent.append($label);
|
||||
|
||||
return $parent;
|
||||
}
|
||||
|
||||
|
||||
init() {
|
||||
|
||||
this.container.append(this.card);
|
||||
}
|
||||
|
||||
|
||||
setDireccion(direccion) {
|
||||
this.card.find('.address-direccion').text(direccion.direccion);
|
||||
this.card.find('.address-cp').text(direccion.cp);
|
||||
this.card.find('.address-municipio-pais').text(direccion.municipioPais);
|
||||
this.card.find('.address-telefono').text(direccion.telefono);
|
||||
this.card.find('.address-email').text(direccion.email);
|
||||
this.card.find('.address-palets').toggleClass('d-none', !direccion.palets);
|
||||
}
|
||||
|
||||
|
||||
setEntregaPalets(palets) {
|
||||
this.card.find('.address-palets').toggleClass('d-none', !palets);
|
||||
}
|
||||
|
||||
getEntregaPalets() {
|
||||
return !this.card.find('.address-palets').hasClass('d-none');
|
||||
}
|
||||
|
||||
setUnidades(unidades) {
|
||||
this.card.find('.unidades').text(unidades + ' unidades');
|
||||
}
|
||||
|
||||
getUnidades() {
|
||||
return this.card.find('.unidades').text().split(' ')[0];
|
||||
}
|
||||
|
||||
getCp() {
|
||||
return this.card.find('.address-cp').text();
|
||||
}
|
||||
|
||||
getId() {
|
||||
return this.id;
|
||||
}
|
||||
|
||||
getDireccionId() {
|
||||
return this.direccionId;
|
||||
}
|
||||
|
||||
getFormData() {
|
||||
return {
|
||||
id: this.direccionId,
|
||||
unidades: this.getUnidades(),
|
||||
entregaPalets: this.getEntregaPalets()
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export default tarjetaDireccion;
|
||||
@ -0,0 +1,51 @@
|
||||
|
||||
class ErrorPresupuestoView {
|
||||
constructor(domItem) {
|
||||
this.item = domItem
|
||||
this.datatableItem = this.item.find("#tableErrorPresupuesto")
|
||||
this.datatableColumns = [
|
||||
{ data: 'presupuestoId', searchable: true, sortable: false },
|
||||
{ data: 'presupuestoUser',searchable: true, sortable: false },
|
||||
{ data: 'lastUser', searchable: true, sortable: false },
|
||||
{ data: 'visto', searchable: false, sortable: false ,
|
||||
render : (d,t) => {
|
||||
const iconClass = d == "1" ? "ti ti-sm ti-check" : "ti ti-sm ti-x"
|
||||
return `<span class="${iconClass}"</span>`
|
||||
}
|
||||
},
|
||||
{ data: 'created_at', searchable: false, sortable: true },
|
||||
{
|
||||
data: 'action', sortable: false, searchable: false,
|
||||
render: (d, t) => {
|
||||
return `
|
||||
<div class="btn-group btn-group-sm">
|
||||
<a href="/configuracion/errores-presupuesto/edit/${d}" data-id="${d}" class="edit-error-presupuesto"><i class="ti ti-eye ti-sm mx-2"></i></a>
|
||||
</div>
|
||||
`
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
init() {
|
||||
this.datatable = this.datatableItem.DataTable({
|
||||
processing: true,
|
||||
layout :{
|
||||
topStart: 'pageLength',
|
||||
topEnd: 'search',
|
||||
bottomStart: 'info',
|
||||
bottomEnd: 'paging'
|
||||
},
|
||||
serverSide: true,
|
||||
pageLength : 50,
|
||||
language: {
|
||||
url: "/themes/vuexy/vendor/libs/datatables-sk/plugins/i18n/es-ES.json"
|
||||
},
|
||||
columns: this.datatableColumns,
|
||||
ajax: '/configuracion/errores-presupuesto/datatable'
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default ErrorPresupuestoView;
|
||||
@ -0,0 +1,79 @@
|
||||
|
||||
|
||||
import Ajax from "../../../components/ajax.js";
|
||||
import ajax from "../../../components/ajax.js"
|
||||
|
||||
class ErrorPresupuestoForm {
|
||||
constructor(domItem) {
|
||||
this.item = domItem
|
||||
this.form = this.item.find("#error-presupuesto-form")
|
||||
this.inputPresupuestoUserId = this.item.find("#presupuesto-user-id")
|
||||
this.inputDatos = this.item.find("#datos-presupuesto")
|
||||
this.inputError = this.item.find("#error-presupuesto-text")
|
||||
this.inputComments = this.item.find("#comments-presupuesto")
|
||||
this.errorPresupuestoId = this.item.find("#error-presupuesto-id").attr("value")
|
||||
this.updateBtnIcon = this.item.find(".button-update-comment")
|
||||
this.checkVisto = this.item.find("#error-presupuesto-visto")
|
||||
this.loader = this.item.find("#update-button-loader")
|
||||
this.btnIcon = this.item.find("#update-button-icon")
|
||||
|
||||
}
|
||||
init() {
|
||||
this.item.on("click",".button-update-comment",this.handlePostErrorPresupuesto.bind(this))
|
||||
this.handleGetErrorPresupuesto()
|
||||
}
|
||||
handleGetErrorPresupuesto()
|
||||
{
|
||||
const ajax = new Ajax(
|
||||
`/configuracion/errores-presupuesto/get/${this.errorPresupuestoId}`,
|
||||
null,
|
||||
null,
|
||||
this.handleGetErrorPresupuestoSuccess.bind(this),
|
||||
this.handleGetErrorPresupuestoError.bind(this)
|
||||
)
|
||||
ajax.get()
|
||||
}
|
||||
handleGetErrorPresupuestoSuccess(data){
|
||||
const dataJson = JSON.parse(data.data.datos_presupuesto)
|
||||
const error = data.data.error
|
||||
this.inputPresupuestoUserId.val(data.data.presupuestoUser)
|
||||
this.inputDatos.val(JSON.stringify(dataJson,null,4))
|
||||
this.inputError.val(error)
|
||||
this.inputComments.val(data.data.comment)
|
||||
this.updateBtnIcon.prop("disabled",false)
|
||||
this.checkVisto.prop("checked",parseInt(data.data.visto) == 1 ? true : false)
|
||||
this.setLoader(false)
|
||||
|
||||
}
|
||||
setLoader(state = true){
|
||||
this.loader.prop("hidden",!state)
|
||||
this.btnIcon.prop("hidden",state)
|
||||
}
|
||||
handleGetErrorPresupuestoError(){}
|
||||
handlePostErrorPresupuesto()
|
||||
{
|
||||
let data =
|
||||
{
|
||||
"comments" : this.inputComments.val()
|
||||
}
|
||||
this.updateBtnIcon.prop("disabled",true)
|
||||
this.setLoader()
|
||||
const ajax = new Ajax(
|
||||
`/configuracion/errores-presupuesto/edit/${this.errorPresupuestoId}`,
|
||||
data,
|
||||
null,
|
||||
this.handlePostErrorPresupuestoSuccess.bind(this),
|
||||
this.handlePostErrorPresupuestoError.bind(this)
|
||||
)
|
||||
ajax.post()
|
||||
}
|
||||
handlePostErrorPresupuestoSuccess(){
|
||||
|
||||
this.handleGetErrorPresupuesto()
|
||||
}
|
||||
handlePostErrorPresupuestoError(error){}
|
||||
|
||||
|
||||
}
|
||||
|
||||
export default ErrorPresupuestoForm;
|
||||
@ -0,0 +1,6 @@
|
||||
import ErrorPresupuestoForm from "./errorPresupuestoForm.js";
|
||||
|
||||
$(document).ready(() => {
|
||||
const errorPresupuestoForm = new ErrorPresupuestoForm($("#error-presupuesto-container"))
|
||||
errorPresupuestoForm.init()
|
||||
})
|
||||
@ -0,0 +1,6 @@
|
||||
import ErrorPresupuestoView from "./errorPresupuesto.js";
|
||||
|
||||
$(document).ready(()=>{
|
||||
const errorPresupuesto = new ErrorPresupuestoView($("#errorPresupuestoCard"))
|
||||
errorPresupuesto.init()
|
||||
})
|
||||
@ -0,0 +1,679 @@
|
||||
import ClassSelect from '../../components/select2.js';
|
||||
import tarjetaTiradasPrecio from './tarjetaTiradasPrecio.js';
|
||||
|
||||
|
||||
class DatosGenerales {
|
||||
|
||||
constructor(domItem, wizardForm, validatorStepper) {
|
||||
|
||||
this.domItem = domItem;
|
||||
this.allowNext = true;
|
||||
|
||||
this.wizardStep = wizardForm.querySelector('#datos-generales');
|
||||
this.validatorStepper = validatorStepper;
|
||||
|
||||
this.formatoLibro = new ClassSelect($("#papelFormatoId"), '/papel-formato/getSelect2', window.translations["formatoLibro"]);
|
||||
this.cliente = new ClassSelect($("#clienteId"), '/clientes/cliente/getSelect2', window.translations["selectCliente"]);
|
||||
|
||||
this.titulo = this.domItem.find("#titulo");
|
||||
this.autor = this.domItem.find("#autor");
|
||||
this.isbn = this.domItem.find("#isbn");
|
||||
this.coleccion = this.domItem.find("#coleccion");
|
||||
this.referenciaCliente = this.domItem.find("#referenciaCliente");
|
||||
|
||||
this.tirada1 = this.domItem.find("#tirada");
|
||||
this.tirada2 = this.domItem.find("#tirada2");
|
||||
this.tirada3 = this.domItem.find("#tirada3");
|
||||
this.tirada4 = this.domItem.find("#tirada4");
|
||||
|
||||
this.papelFormatoId = this.domItem.find("#papelFormatoId");
|
||||
this.checkFormatoPersonalizado = this.domItem.find("#papelFormatoPersonalizado");
|
||||
this.formatoPersonalizado = this.domItem.find("#formatoPersonalizado");
|
||||
this.formatoEstandar = this.domItem.find("#formatoEstandar");
|
||||
this.anchoPersonalizado = this.domItem.find("#papelFormatoAncho");
|
||||
this.altoPersonalizado = this.domItem.find("#papelFormatoAlto");
|
||||
|
||||
this.fresado = $(this.domItem.find("#fresado")[0]);
|
||||
this.cosido = $(this.domItem.find("#cosido")[0]);
|
||||
this.grapado = $(this.domItem.find("#grapado")[0]);
|
||||
this.espiral = $(this.domItem.find("#espiral")[0]);
|
||||
|
||||
this.tiposLibro = this.domItem.find(".tipo-libro");
|
||||
|
||||
this.paginas = this.domItem.find("#paginas");
|
||||
this.paginasNegro = this.domItem.find("#paginasNegro");
|
||||
this.paginasColor = this.domItem.find("#paginasColor");
|
||||
this.divPaginasCuaderillo = this.domItem.find("#divPaginasCuadernillo");
|
||||
this.paginasCuadernillo = this.domItem.find("#paginasCuadernillo");
|
||||
this.divPaginasColorConsecutivas = this.domItem.find("#divPaginasColorConsecutivas");
|
||||
this.pagColorConsecutivas = this.domItem.find("#pagColorConsecutivas");
|
||||
this.divPapelDiferente = this.domItem.find("#divPapelDiferente");
|
||||
this.papelDiferente = this.domItem.find("#papelDiferente");
|
||||
this.divPosPaginasColor = this.domItem.find("#divPosPaginasColor");
|
||||
this.posPaginasColor = this.domItem.find("#posPaginasColor");
|
||||
|
||||
this.ivaReducido = this.domItem.find("#ivaReducido");
|
||||
this.excluirRotativa = this.domItem.find("#excluirRotativa");
|
||||
this.prototipo = this.domItem.find("#prototipo");
|
||||
|
||||
this.initValidation();
|
||||
}
|
||||
|
||||
|
||||
init() {
|
||||
|
||||
// Selects
|
||||
this.formatoLibro.init();
|
||||
this.cliente.init();
|
||||
|
||||
|
||||
// Inicializa el tipo de impresion
|
||||
this.#handlePaginas();
|
||||
|
||||
// Eventos
|
||||
this.checkFormatoPersonalizado.bind('change', this.#handleFormatoLibro.bind(this));
|
||||
this.tiposLibro.on('click', this.#handleTipolibro.bind(this));
|
||||
this.domItem.find('.input-paginas').on('change', this.#handlePaginas.bind(this));
|
||||
this.anchoPersonalizado.on('blur', this.#handleCheckFormatoPersonalizado.bind(this));
|
||||
this.altoPersonalizado.on('blur', this.#handleCheckFormatoPersonalizado.bind(this));
|
||||
this.pagColorConsecutivas.on('change', this.#handPaginasConsecutivas.bind(this));
|
||||
this.papelDiferente.on('change', this.#handlePapelDiferente.bind(this));
|
||||
|
||||
this.titulo.on('change', () => { $(".titulo").html(this.titulo.val()); });
|
||||
}
|
||||
|
||||
initValidation() {
|
||||
|
||||
const stepper = this.validatorStepper;
|
||||
|
||||
this.formValidation = FormValidation.formValidation(this.wizardStep, {
|
||||
fields: {
|
||||
titulo: {
|
||||
validators: {
|
||||
notEmpty: {
|
||||
message: window.translations["validation"].requerido_short
|
||||
},
|
||||
}
|
||||
},
|
||||
cliente_id: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].cliente,
|
||||
callback: function (input) {
|
||||
// Get the selected options
|
||||
if (!$(this.excluirRotativa).prop('hidden'))
|
||||
return true;
|
||||
const options = $("#clienteId").select2('data');
|
||||
const hasValidOption = options.some(option => parseInt(option.id) > 0);
|
||||
return options !== null && options.length > 0 && hasValidOption;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
tirada: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
const value = $("#tirada").val();
|
||||
const value2 = $("#tirada2").val();
|
||||
const value3 = $("#tirada3").val();
|
||||
const value4 = $("#tirada4").val();
|
||||
let tiradas = [value];
|
||||
|
||||
if (!(value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0)) {
|
||||
return {
|
||||
valid: false,
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
};
|
||||
}
|
||||
if (value2.length > 0 && Number.isInteger(parseInt(value2)) && parseInt(value2) > 0) {
|
||||
tiradas.push(value2);
|
||||
}
|
||||
if (value3.length > 0 && Number.isInteger(parseInt(value3)) && parseInt(value3) > 0) {
|
||||
tiradas.push(value3);
|
||||
}
|
||||
if (value4.length > 0 && Number.isInteger(parseInt(value4)) && parseInt(value4) > 0) {
|
||||
tiradas.push(value4);
|
||||
}
|
||||
// comprobar si hay valores > 30
|
||||
const noPOD = (tiradas.some(tirada => parseInt(tirada) > 30));
|
||||
const siPOD = (tiradas.some(tirada => parseInt(tirada) <= 30));
|
||||
if (noPOD && siPOD) {
|
||||
return {
|
||||
valid: false,
|
||||
message: "No se pueden mezclar tiradas <30 con >30",
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
tirada2: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
let field = $("#tirada2");
|
||||
field.val(field.val().replace(/[^0-9]/g, ''));
|
||||
let value = field.value;
|
||||
if (value == '')
|
||||
return true;
|
||||
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
tirada3: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
let field = $("#tirada3");
|
||||
field.val(field.val().replace(/[^0-9]/g, ''));
|
||||
let value = field.value;
|
||||
if (value == '')
|
||||
return true;
|
||||
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
tirada4: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
let field = $("#tirada4");
|
||||
field.val(field.val().replace(/[^0-9]/g, ''));
|
||||
let value = field.value;
|
||||
if (value == '')
|
||||
return true;
|
||||
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
papel_formato_id: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].papelFormato,
|
||||
callback: function (input) {
|
||||
// Get the selected options
|
||||
const options = $("#papelFormatoId").select2('data');
|
||||
const hasValidOption = options.some(option => parseInt(option.id) > 0);
|
||||
const custom_format = $("#papelFormatoPersonalizado").is(":checked");
|
||||
if (custom_format)
|
||||
return true;
|
||||
return options !== null && options.length > 0 && hasValidOption;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
papel_formato_ancho: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
// Get the selected options
|
||||
const custom_format = $("#papelFormatoPersonalizado").is(":checked");
|
||||
if (!custom_format)
|
||||
return true;
|
||||
const value = $("#papelFormatoAncho").val();
|
||||
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
papel_formato_alto: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
// Get the selected options
|
||||
const custom_format = $("#papelFormatoPersonalizado").is(":checked");
|
||||
if (!custom_format)
|
||||
return true;
|
||||
const value = $("#papelFormatoAlto").val();
|
||||
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
paginasColor: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
// Get the selected options
|
||||
const value = $("#paginasColor").val();
|
||||
if (value.length >= 0 && Number.isInteger(parseInt(value)) && parseInt(value) >= 0) {
|
||||
|
||||
if (parseInt(value) % 2 != 0) {
|
||||
return {
|
||||
valid: false,
|
||||
message: window.translations["validation"].paginas_pares
|
||||
};
|
||||
}
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
paginasNegro: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
// Get the selected options
|
||||
const value = $("#paginasNegro").val();
|
||||
if (value.length >= 0 && Number.isInteger(parseInt(value)) && parseInt(value) >= 0) {
|
||||
|
||||
if (parseInt(value) % 2 != 0) {
|
||||
return {
|
||||
valid: false,
|
||||
message: window.translations["validation"].paginas_pares
|
||||
};
|
||||
}
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
paginas: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: window.translations["validation"].integer_greatherThan_0,
|
||||
callback: function (input) {
|
||||
// Get the selected options
|
||||
const value = $("#paginas").val();
|
||||
return value.length > 0 && Number.isInteger(parseInt(value)) && parseInt(value) > 0;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
div_tipo_libro: {
|
||||
validators: {
|
||||
callback: {
|
||||
callback: function (input) {
|
||||
const divTipoLibro = $('#divTipoLibro'); // Selecciona el div
|
||||
|
||||
divTipoLibro.find('.fv-plugins-message-container').remove();
|
||||
if ($('.tipo-libro.selected').length > 0) {
|
||||
if ($('#cosido').hasClass('selected')) {
|
||||
const value = parseInt($("#paginas").val());
|
||||
if (value % 4 != 0) {
|
||||
divTipoLibro.append(`
|
||||
<div class="fv-plugins-message-container invalid-feedback">
|
||||
<div data-field="div_tipo_libro" data-validator="callback" style="margin-top: 50px;">
|
||||
${window.translations["validation"].paginas_cosido}
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
divTipoLibro.append(`
|
||||
<div class="fv-plugins-message-container invalid-feedback">
|
||||
<div data-field="div_tipo_libro" data-validator="callback" style="margin-top: 50px;">
|
||||
${window.translations["validation"].tipo_libro}
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
// Use this for enabling/changing valid/invalid class
|
||||
// eleInvalidClass: '',
|
||||
eleValidClass: '',
|
||||
rowSelector: function (field, ele) {
|
||||
// field is the field name
|
||||
// ele is the field element
|
||||
switch (field) {
|
||||
case 'div_tipo_libro':
|
||||
return '.col-sm-10';
|
||||
case 'titulo':
|
||||
return '.col-sm-8';
|
||||
case 'cliente_id':
|
||||
return '.col-sm-5';
|
||||
case 'papel_formato_id':
|
||||
return '.col-sm-4';
|
||||
case 'papel_formato_ancho':
|
||||
case 'papel_formato_ancho':
|
||||
return '.col-sm-3';
|
||||
case 'tirada':
|
||||
case 'tirada2':
|
||||
case 'tirada3':
|
||||
case 'tirada4':
|
||||
return '.col-sm-2';
|
||||
|
||||
default:
|
||||
return '.col-sm-3';
|
||||
}
|
||||
}
|
||||
}),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus(),
|
||||
submitButton: new FormValidation.plugins.SubmitButton()
|
||||
}
|
||||
}).on('core.form.valid', () => {
|
||||
if (this.allowNext)
|
||||
stepper.next();
|
||||
});
|
||||
}
|
||||
|
||||
cargarDatos(datos) {
|
||||
|
||||
this.titulo.val(datos.titulo);
|
||||
this.autor.val(datos.autor);
|
||||
this.isbn.val(datos.isbn);
|
||||
this.coleccion.val(datos.coleccion);
|
||||
this.referenciaCliente.val(datos.referenciaCliente);
|
||||
|
||||
this.cliente.setOption(datos.clienteId, datos.clienteNombre);
|
||||
this.cliente.setVal(datos.clienteId);
|
||||
$(this.cliente).trigger('change');
|
||||
|
||||
if (datos.excluirRotativa) {
|
||||
this.excluirRotativa.prop('checked', true);
|
||||
}
|
||||
|
||||
this.tirada1.val(parseInt(datos.tirada));
|
||||
if (datos.tirada2)
|
||||
this.tirada2.val(parseInt(datos.tirada2));
|
||||
if (datos.tirada3)
|
||||
this.tirada3.val(parseInt(datos.tirada3));
|
||||
if (datos.tirada4)
|
||||
this.tirada4.val(parseInt(datos.tirada4));
|
||||
|
||||
if (datos.papelFormatoPersonalizado) {
|
||||
this.checkFormatoPersonalizado.prop('checked', true);
|
||||
this.formatoEstandar.addClass('d-none');
|
||||
this.formatoPersonalizado.removeClass('d-none');
|
||||
this.formValidation.revalidateField('papel_formato_id');
|
||||
this.altoPersonalizado.val(datos.papelFormatoAlto);
|
||||
this.anchoPersonalizado.val(datos.papelFormatoAncho);
|
||||
}
|
||||
else {
|
||||
this.formatoLibro.setOption(datos.papelFormatoId, datos.papelFormatoNombre);
|
||||
this.formatoLibro.setVal(datos.papelFormatoId);
|
||||
}
|
||||
|
||||
this.paginas.val(parseInt(datos.paginas));
|
||||
this.paginasNegro.val(parseInt(datos.paginasNegro));
|
||||
this.paginasColor.val(parseInt(datos.paginasColor)).trigger('change');
|
||||
|
||||
this.pagColorConsecutivas.prop('checked', datos.paginasColorConsecutivas);
|
||||
if (datos.paginasColorConsecutivas) {
|
||||
this.divPapelDiferente.removeClass('d-none');
|
||||
this.papelDiferente.prop('checked', datos.papelInteriorDiferente).trigger('change');
|
||||
}
|
||||
this.posPaginasColor.val(datos.posPaginasColor);
|
||||
|
||||
this.paginasCuadernillo.val(datos.paginasCuadernillo);
|
||||
|
||||
if (datos.tipo != "") {
|
||||
this.tiposLibro.removeClass('selected');
|
||||
this.tiposLibro.find('.image-presupuesto').removeClass('selected');
|
||||
this.domItem.find('#' + datos.tipo).addClass('selected');
|
||||
}
|
||||
|
||||
this.prototipo.prop('checked', datos.prototipo);
|
||||
this.ivaReducido.val(datos.ivaReducido ? 1 : 0).trigger('change');
|
||||
}
|
||||
|
||||
getCliente() {
|
||||
if ($(this.excluirRotativa).prop('hidden'))
|
||||
return $('#clienteId').val();
|
||||
return this.cliente.getVal();
|
||||
}
|
||||
|
||||
getDimensionLibro() {
|
||||
|
||||
let ancho = 0;
|
||||
let alto = 0;
|
||||
|
||||
if (this.checkFormatoPersonalizado.is(':checked')) {
|
||||
ancho = parseFloat(this.anchoPersonalizado.val());
|
||||
alto = parseFloat(this.altoPersonalizado.val());
|
||||
}
|
||||
else {
|
||||
if (this.papelFormatoId.val() != null) {
|
||||
const selectedText = this.papelFormatoId.find('option:selected').text();
|
||||
if (selectedText.length > 0) {
|
||||
ancho = parseFloat(selectedText.trim().split(" x ")[0]);
|
||||
alto = parseFloat(selectedText.trim().split(" x ")[1]);
|
||||
}
|
||||
}
|
||||
else
|
||||
return null;
|
||||
}
|
||||
return {
|
||||
ancho: ancho,
|
||||
alto: alto
|
||||
}
|
||||
}
|
||||
|
||||
getTiradas() {
|
||||
let tiradas = [];
|
||||
tiradas.push(parseInt(this.tirada1.val()));
|
||||
if (this.tirada2.val().length > 0 && parseInt(this.tirada2.val()) > 0)
|
||||
tiradas.push(parseInt(this.tirada2.val()));
|
||||
if (this.tirada3.val().length > 0 && parseInt(this.tirada3.val()) > 0)
|
||||
tiradas.push(parseInt(this.tirada3.val()));
|
||||
if (this.tirada4.val().length > 0 && parseInt(this.tirada4.val()) > 0)
|
||||
tiradas.push(parseInt(this.tirada4.val()));
|
||||
return tiradas;
|
||||
}
|
||||
|
||||
|
||||
getIsColor() {
|
||||
if (this.paginasColor.val() > 0) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
#handleFormatoLibro() {
|
||||
|
||||
if (this.checkFormatoPersonalizado.is(':checked')) {
|
||||
this.formatoEstandar.addClass('d-none');
|
||||
this.formatoPersonalizado.removeClass('d-none');
|
||||
this.formValidation.revalidateField('papel_formato_id');
|
||||
}
|
||||
else {
|
||||
this.formatoEstandar.removeClass('d-none');
|
||||
this.formatoPersonalizado.addClass('d-none');
|
||||
this.formValidation.revalidateField('papel_formato_ancho');
|
||||
this.formValidation.revalidateField('papel_formato_alto');
|
||||
}
|
||||
}
|
||||
|
||||
#handleTipolibro(event) {
|
||||
// Accede al ID del elemento que disparó el evento
|
||||
const element = $(event.target);
|
||||
|
||||
let containers = element.closest('.tipo-libro').parent().find('.tipo-libro');
|
||||
for (let container of containers) {
|
||||
if (container != element.closest('.tipo-libro')[0]) {
|
||||
$(container).removeClass('selected');
|
||||
$(container).find('.image-presupuesto').removeClass('selected');
|
||||
}
|
||||
}
|
||||
|
||||
element.closest('.tipo-libro').toggleClass('selected');
|
||||
element.closest('.image-presupuesto').toggleClass('selected');
|
||||
|
||||
if (this.fresado.hasClass('selected') || this.cosido.hasClass('selected')) {
|
||||
$('#tapaDuraLomoRedondo').removeClass('d-none');
|
||||
if (this.cosido.hasClass('selected')) {
|
||||
//$('#tapaDuraLomoRedondo').addClass('selected');
|
||||
this.divPaginasCuaderillo.removeClass('d-none');
|
||||
}
|
||||
else {
|
||||
this.divPaginasCuaderillo.addClass('d-none');
|
||||
}
|
||||
}
|
||||
else {
|
||||
$('#tapaDuraLomoRedondo').addClass('d-none');
|
||||
$('#tapaDuraLomoRedondo').removeClass('selected');
|
||||
this.divPaginasCuaderillo.addClass('d-none');
|
||||
}
|
||||
|
||||
if (this.grapado.hasClass('selected') || this.espiral.hasClass('selected')) {
|
||||
$('#addSobrecubierta').prop('checked', false).trigger('change');
|
||||
$(".sobrecubierta-items").addClass('d-none');
|
||||
}
|
||||
else {
|
||||
if ($('#addSobrecubierta').hasClass('d-none')) {
|
||||
$('#addSobrecubierta').removeClass('d-none');
|
||||
}
|
||||
}
|
||||
|
||||
// Para recalcular el presupuesto
|
||||
element.trigger('change');
|
||||
}
|
||||
|
||||
#handlePaginas() {
|
||||
|
||||
let paginasNegro = this.paginasNegro.val();
|
||||
let paginasColor = this.paginasColor.val();
|
||||
|
||||
if (paginasNegro == '' || isNaN(paginasNegro)) {
|
||||
paginasNegro = 0;
|
||||
}
|
||||
if (paginasColor == '' || isNaN(paginasColor)) {
|
||||
paginasColor = 0;
|
||||
}
|
||||
|
||||
let totalPaginas = parseInt(paginasNegro) + parseInt(paginasColor);
|
||||
this.paginas.val(totalPaginas);
|
||||
|
||||
let tipos = [this.domItem.find('#fresado'), this.domItem.find('#cosido')];
|
||||
if (totalPaginas < 32) {
|
||||
for (let tipo of tipos) {
|
||||
tipo.removeClass('selected');
|
||||
tipo.find('.image-presupuesto').removeClass('selected');
|
||||
|
||||
tipo.hide();
|
||||
}
|
||||
}
|
||||
else {
|
||||
for (let tipo of tipos) {
|
||||
tipo.show();
|
||||
}
|
||||
}
|
||||
|
||||
if (totalPaginas < 12 || totalPaginas > 40) {
|
||||
this.domItem.find('#grapado').removeClass('selected');
|
||||
this.domItem.find('#grapado').find('.image-presupuesto').removeClass('selected');
|
||||
this.domItem.find('#grapado').hide();
|
||||
}
|
||||
else {
|
||||
this.domItem.find('#grapado').show();
|
||||
}
|
||||
this.formValidation.revalidateField('paginas');
|
||||
|
||||
// Se configura dependiento si hay color o no
|
||||
if (paginasColor == 0) {
|
||||
|
||||
this.#handleInteriorLayout('negro');
|
||||
this.divPaginasColorConsecutivas.addClass('d-none');
|
||||
this.divPosPaginasColor.addClass('d-none');
|
||||
this.posPaginasColor.val("");
|
||||
this.pagColorConsecutivas.prop('checked', false);
|
||||
}
|
||||
else {
|
||||
if (this.papelDiferente.is(":checked"))
|
||||
this.#handleInteriorLayout('mixto');
|
||||
else
|
||||
this.#handleInteriorLayout('color');
|
||||
this.divPaginasColorConsecutivas.removeClass('d-none');
|
||||
this.divPosPaginasColor.removeClass('d-none');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handPaginasConsecutivas() {
|
||||
if (this.pagColorConsecutivas.is(':checked')) {
|
||||
this.divPapelDiferente.removeClass('d-none');
|
||||
}
|
||||
else {
|
||||
this.divPapelDiferente.addClass('d-none');
|
||||
this.papelDiferente.prop('checked', false);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handlePapelDiferente() {
|
||||
if (this.papelDiferente.is(':checked')) {
|
||||
$(".papel-interior").removeClass('selected');
|
||||
$(".interior-color").removeClass('d-none');
|
||||
this.#handleInteriorLayout('mixto');
|
||||
|
||||
}
|
||||
else {
|
||||
$(".interior-color").addClass('d-none');
|
||||
$("#divGramajeInteriorColor").addClass('d-none');
|
||||
$(".papel-interior").removeClass('selected');
|
||||
$(".gramaje-interior").prop('checked', false);
|
||||
$(".gramaje-interior-color").prop('checked', false);
|
||||
this.#handlePaginas();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handleInteriorLayout(layout) {
|
||||
switch (layout) {
|
||||
case 'negro':
|
||||
case 'mixto':
|
||||
$('#negroEstandar').removeClass('d-none');
|
||||
$('#negroPremium').removeClass('d-none');
|
||||
$('#colorEstandar').addClass('d-none');
|
||||
$('#colorPremium').addClass('d-none');
|
||||
break;
|
||||
case 'color':
|
||||
$('#negroEstandar').addClass('d-none');
|
||||
$('#negroPremium').addClass('d-none');
|
||||
$('#colorEstandar').removeClass('d-none');
|
||||
$('#colorPremium').removeClass('d-none');
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
#handleCheckFormatoPersonalizado() {
|
||||
|
||||
const minAncho = this.anchoPersonalizado.min;
|
||||
const minAlto = this.altoPersonalizado.min;
|
||||
|
||||
if (this.anchoPersonalizado.val() < minAncho || this.anchoPersonalizado.val() == '' || isNaN(this.anchoPersonalizado.val())) {
|
||||
this.anchoPersonalizado.val(minAncho);
|
||||
}
|
||||
|
||||
if (this.altoPersonalizado.val() < minAlto || this.altoPersonalizado.val() == '' || isNaN(this.altoPersonalizado.val())) {
|
||||
this.altoPersonalizado.val(minAlto);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
export default DatosGenerales;
|
||||
@ -0,0 +1,377 @@
|
||||
import ClassSelect from '../../components/select2.js';
|
||||
import Ajax from '../../components/ajax.js';
|
||||
import tarjetaDireccion from '../../components/tarjetaDireccionPresupuesto.js';
|
||||
import SelectorTiradaEnvio from './selectorTiradaEnvio.js';
|
||||
import DireccionForm from '../../components/modalDireccion.js';
|
||||
|
||||
|
||||
class Direcciones {
|
||||
|
||||
constructor(domItem, wizardForm, validatorStepper) {
|
||||
|
||||
this.domItem = domItem;
|
||||
this.wizardStep = wizardForm.querySelector('#direcciones-libro');
|
||||
this.validatorStepper = validatorStepper;
|
||||
this.allowNext = true;
|
||||
|
||||
this.unidadesAdd = this.domItem.find('#unidadesEnvio');
|
||||
this.btnAdd = this.domItem.find('#insertarDireccion');
|
||||
this.btnNew = this.domItem.find('#nuevaDireccion');
|
||||
this.entregaPieCallero = this.domItem.find('#entregaPieCalle');
|
||||
|
||||
this.direccionesCliente = new ClassSelect($("#direcciones"), '/misdirecciones/getSelect2');
|
||||
|
||||
this.divDirecciones = $(this.domItem.find('#divDirecciones'));
|
||||
this.divTiradas = this.domItem.find('#containerTiradasEnvios');
|
||||
|
||||
this.checksTiradasEnvio = $('.check-tirada-envio');
|
||||
|
||||
this.direcciones = [];
|
||||
|
||||
this.direcciones.calcularPresupuesto = false;
|
||||
|
||||
this.initValidation();
|
||||
|
||||
}
|
||||
|
||||
|
||||
init() {
|
||||
|
||||
$("#clienteId").on('change', this.handleChangeCliente.bind(this));
|
||||
|
||||
this.direccionesCliente.init();
|
||||
this.btnAdd.on('click', this.#insertDireccion.bind(this));
|
||||
this.btnNew.on('click', this.#nuevaDireccion.bind(this));
|
||||
}
|
||||
|
||||
|
||||
cargarDatos(datos, datosGenerales) {
|
||||
|
||||
self = this;
|
||||
|
||||
try {
|
||||
|
||||
let tiradas_envio = [datosGenerales.tirada];
|
||||
if (datosGenerales.tirada2) {
|
||||
tiradas_envio.push(datosGenerales.tirada2);
|
||||
}
|
||||
if (datosGenerales.tirada3) {
|
||||
tiradas_envio.push(datosGenerales.tirada3);
|
||||
}
|
||||
if (datosGenerales.tirada4) {
|
||||
tiradas_envio.push(datosGenerales.tirada4);
|
||||
}
|
||||
tiradas_envio.sort((a, b) => a - b);
|
||||
|
||||
setTimeout(() => {
|
||||
|
||||
tiradas_envio.forEach(tirada => {
|
||||
self.insertTirada(tirada);
|
||||
});
|
||||
}, 0);
|
||||
|
||||
setTimeout(function () {
|
||||
$(`#containerTiradasEnvios .tirada-envio input[tirada="${datosGenerales.tirada}"]`).trigger('click');
|
||||
}, 0);
|
||||
|
||||
|
||||
for (let i = 0; i < datos.length; i++) {
|
||||
|
||||
let id = datos[i].id;
|
||||
let unidades = datos[i].unidades;
|
||||
let entregaPalets = datos[i].palets;
|
||||
let divId = "dirEnvio-1";
|
||||
let direccionesActuales = this.divDirecciones.find('.direccion-cliente');
|
||||
if (direccionesActuales.length > 0) {
|
||||
// the the lass item
|
||||
let last = direccionesActuales[direccionesActuales.length - 1];
|
||||
divId = "dirEnvio-" + (parseInt(last.id.split('-')[1]) + 1);
|
||||
}
|
||||
|
||||
if (id == null || id <= 0 || id == undefined)
|
||||
return;
|
||||
if (unidades == null || unidades <= 0 || unidades == undefined)
|
||||
return;
|
||||
|
||||
let peticion = new Ajax('/misdirecciones/getDireccionPresupuesto/' + id, {}, {},
|
||||
(response) => {
|
||||
let tarjeta = new tarjetaDireccion(this.divDirecciones, divId, response.data[0]);
|
||||
tarjeta.setUnidades(unidades);
|
||||
tarjeta.setEntregaPalets(entregaPalets);
|
||||
tarjeta.card.find('.direccion-editar').on('click', this.#editUnits.bind(self));
|
||||
tarjeta.card.find('.direccion-eliminar').on('click', this.#deleteDireccion.bind(self));
|
||||
this.divDirecciones.append(tarjeta.card);
|
||||
this.direcciones.push(tarjeta);
|
||||
},
|
||||
() => {
|
||||
console.error('Error getting address');
|
||||
});
|
||||
|
||||
peticion.get();
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
$('#loader').modal('hide');
|
||||
}
|
||||
}
|
||||
|
||||
initValidation() {
|
||||
|
||||
const stepper = this.validatorStepper;
|
||||
|
||||
this.formValidation = FormValidation.formValidation(this.wizardStep, {
|
||||
fields: {
|
||||
div_error_envios: {
|
||||
validators: {
|
||||
callback: {
|
||||
callback: () => {
|
||||
/* const div = $('#divErrorEnvios'); // Selecciona el div
|
||||
|
||||
div.find('.fv-plugins-message-container').remove();
|
||||
|
||||
if ($('.check-tirada-envio:checked').length > 0) {
|
||||
let unidades = parseInt($($('.check-tirada-envio:checked')[0]).attr('tirada'));
|
||||
let total_envio = 0;
|
||||
// se recorre el array this.direcciones
|
||||
this.direcciones.forEach(direccion => {
|
||||
total_envio += parseInt(direccion.getUnidades());
|
||||
});
|
||||
if (total_envio == unidades) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
div.append(`
|
||||
<div class="fv-plugins-message-container invalid-feedback">
|
||||
<div data-field="div_tipo_cubierta" data-validator="callback">
|
||||
El total de unidades enviadas no se corresponde con las unidades del pedido
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
return false;
|
||||
*/
|
||||
return true;
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
// Use this for enabling/changing valid/invalid class
|
||||
// eleInvalidClass: '',
|
||||
eleValidClass: '',
|
||||
rowSelector: function (field, ele) {
|
||||
// field is the field name
|
||||
// ele is the field element
|
||||
switch (field) {
|
||||
case 'div_error_envios':
|
||||
return '.col-sm-10';
|
||||
default:
|
||||
return '.col-sm-3';
|
||||
}
|
||||
}
|
||||
}),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus(),
|
||||
submitButton: new FormValidation.plugins.SubmitButton()
|
||||
}
|
||||
}).on('core.form.valid', () => {
|
||||
if (this.allowNext)
|
||||
stepper.next();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
insertTirada(tirada) {
|
||||
|
||||
const self = this;
|
||||
|
||||
let tarjeta = new SelectorTiradaEnvio(this.divTiradas, 'tiradaEnvios-' + tirada, tirada);
|
||||
let customOption = tarjeta.card.find('.check-tirada-envio');
|
||||
|
||||
customOption.on('click', function () {
|
||||
self.#handleTiradaEnvio(customOption);
|
||||
});
|
||||
}
|
||||
|
||||
obtenerDireccionesCalculo() {
|
||||
let direcciones = [];
|
||||
this.direcciones.forEach(direccion => {
|
||||
let dir = {
|
||||
id: direccion.getId(),
|
||||
unidades: direccion.getUnidades(),
|
||||
entregaPalets: direccion.getEntregaPalets()
|
||||
};
|
||||
direcciones.push(dir);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
#nuevaDireccion() {
|
||||
|
||||
let dialog = new DireccionForm($("#addressModal"), function () {
|
||||
try {
|
||||
let data = dialog.getData();
|
||||
data.cliente_id = $("#clienteId").select2('data')[0].id;
|
||||
|
||||
new Ajax(
|
||||
'/misdirecciones/add',
|
||||
data,
|
||||
{},
|
||||
() => { dialog.modal.modal('hide') },
|
||||
() => { dialog.modal.modal('hide') }
|
||||
).post();
|
||||
}
|
||||
catch (e) {
|
||||
console.error(e);
|
||||
dialog.modal.modal('hide');
|
||||
}
|
||||
|
||||
});
|
||||
dialog.init();
|
||||
}
|
||||
|
||||
#handleTiradaEnvio(customOption) {
|
||||
|
||||
const el = customOption[0];
|
||||
|
||||
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')
|
||||
})
|
||||
}
|
||||
el.closest('.custom-option').classList.add('checked')
|
||||
} else {
|
||||
el.closest('.custom-option').classList.remove('checked')
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#insertDireccion() {
|
||||
|
||||
self = this;
|
||||
|
||||
try {
|
||||
|
||||
let id = this.direccionesCliente.getVal();
|
||||
let unidades = this.unidadesAdd.val();
|
||||
let entregaPalets = this.entregaPieCallero.is(':checked');
|
||||
let divId = "dirEnvio-1";
|
||||
let direccionesActuales = this.divDirecciones.find('.direccion-cliente');
|
||||
if (direccionesActuales.length > 0) {
|
||||
// the the lass item
|
||||
let last = direccionesActuales[direccionesActuales.length - 1];
|
||||
divId = "dirEnvio-" + (parseInt(last.id.split('-')[1]) + 1);
|
||||
}
|
||||
|
||||
if (id == null || id <= 0 || id == undefined)
|
||||
return;
|
||||
if (unidades == null || unidades <= 0 || unidades == undefined)
|
||||
return;
|
||||
|
||||
$('#loader').modal('show');
|
||||
let peticion = new Ajax('/misdirecciones/get/' + id, {}, {},
|
||||
(response) => {
|
||||
|
||||
if (this.direcciones.length == 0) {
|
||||
$('#loader').modal('hide');
|
||||
if (entregaPalets) {
|
||||
this.calcularPresupuesto = true;
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.calcularPresupuesto = true;
|
||||
}
|
||||
let tarjeta = new tarjetaDireccion(this.divDirecciones, divId, response.data[0]);
|
||||
tarjeta.setUnidades(unidades);
|
||||
tarjeta.setEntregaPalets(entregaPalets);
|
||||
tarjeta.card.find('.direccion-editar').on('click', this.#editUnits.bind(self));
|
||||
tarjeta.card.find('.direccion-eliminar').on('click', this.#deleteDireccion.bind(self));
|
||||
this.divDirecciones.append(tarjeta.card);
|
||||
this.direcciones.push(tarjeta);
|
||||
self.divDirecciones.trigger('change');
|
||||
|
||||
},
|
||||
() => {
|
||||
console.error('Error getting address');
|
||||
$('#loader').modal('hide');
|
||||
});
|
||||
|
||||
peticion.get();
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
$('#loader').modal('hide');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
handleChangeCliente() {
|
||||
|
||||
this.direccionesCliente.setParams({ 'cliente_id': $("#clienteId").select2('data')[0].id })
|
||||
this.direccionesCliente.empty();
|
||||
|
||||
this.domItem.find('.direccion-cliente').remove();
|
||||
this.direcciones = [];
|
||||
}
|
||||
|
||||
#editUnits(event) {
|
||||
|
||||
let id = $(event.currentTarget.closest('.direccion-cliente'))[0].id;
|
||||
let tarjeta = this.direcciones.filter(direccion => direccion.id == id)[0].card;
|
||||
let unidades = tarjeta.find('.unidades').text().split(' ')[0];
|
||||
|
||||
let modal = $('#modalInput');
|
||||
modal.find('.modal-title').text('Editar unidades');
|
||||
modal.find('.inputData').val(unidades);
|
||||
modal.modal('show');
|
||||
|
||||
modal.find('.btn-primary').off('click');
|
||||
modal.find('.btn-primary').on('click', () => {
|
||||
try {
|
||||
|
||||
let nuevo_valor = parseInt(modal.find('.modal-body input').val());
|
||||
if (nuevo_valor > 0) {
|
||||
tarjeta.find('.unidades').text(nuevo_valor + ' unidades');
|
||||
if (this.direcciones.length > 1) {
|
||||
this.calcularPresupuesto = true;
|
||||
}
|
||||
this.divDirecciones.trigger('change');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Units must be a number');
|
||||
}
|
||||
modal.modal('hide');
|
||||
});
|
||||
}
|
||||
|
||||
#deleteDireccion(event) {
|
||||
|
||||
let tarjeta = event.currentTarget.closest('.direccion-cliente');
|
||||
let id = tarjeta.id;
|
||||
|
||||
const numTarjetasAntes = this.direcciones.length;
|
||||
if (numTarjetasAntes == 2) {
|
||||
this.calcularPresupuesto = true;
|
||||
}
|
||||
|
||||
this.direcciones = this.direcciones.filter(direccion => direccion.getId() !== id);
|
||||
|
||||
tarjeta.remove();
|
||||
this.divDirecciones.trigger('change');
|
||||
}
|
||||
|
||||
getSelectedTirada() {
|
||||
if ($('.check-tirada-envio:checked').length > 0)
|
||||
return parseInt($($('.check-tirada-envio:checked')[0]).attr('tirada'));
|
||||
else
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default Direcciones;
|
||||
@ -0,0 +1,720 @@
|
||||
class DisenioCubierta {
|
||||
|
||||
constructor(domItem, wizardForm, validatorStepper) {
|
||||
|
||||
this.domItem = domItem;
|
||||
this.allowNext = true;
|
||||
|
||||
this.wizardStep = wizardForm.querySelector('#cubierta-libro');
|
||||
this.validatorStepper = validatorStepper;
|
||||
|
||||
this.disenioCubierta = this.domItem.find(".tipo-cubierta");
|
||||
this.solapasCubierta = this.domItem.find(".solapas-cubierta");
|
||||
this.papelCubierta = this.domItem.find(".papel-cubierta");
|
||||
|
||||
this.divSolapas = this.domItem.find("#divSolapasCubierta");
|
||||
this.divCarasImpresion = this.domItem.find("#divCarasImpresion");
|
||||
this.divConfigTapaDura = this.domItem.find("#divConfigTapaDura");
|
||||
|
||||
this.carasCubierta = this.domItem.find("#carasCubierta");
|
||||
|
||||
this.tapaBlanda = this.domItem.find("#tapaBlanda");
|
||||
this.tapaDuraLomoRecto = this.domItem.find("#tapaDura");
|
||||
this.tapaDuraLomoRedondo = this.domItem.find("#tapaDuraLomoRedondo");
|
||||
|
||||
this.sinSolapas = this.domItem.find("#solapasCubiertaNo");
|
||||
this.conSolapas = this.domItem.find("#solapasCubiertaSi");
|
||||
this.divTamanioSolapas = this.domItem.find("#divTamanioSolapas");
|
||||
this.tamanioSolapasCubierta = $(this.domItem.find("#solapasCubierta"));
|
||||
|
||||
this.papelGuardas = this.domItem.find("#papelGuardas");
|
||||
this.guardasImpresas = this.domItem.find("#guardasImpresas");
|
||||
this.cabezada = this.domItem.find("#cabezada");
|
||||
|
||||
this.cartulinaEstucada = this.domItem.find("#cartulinaEstucada");
|
||||
this.estucadoMate = this.domItem.find("#estucadoMate");
|
||||
|
||||
this.divPapelCubierta = this.domItem.find("#divPapelCubierta");
|
||||
|
||||
this.divGramajeCubierta = this.domItem.find("#divGramajeCubierta");
|
||||
this.gramaje = this.domItem.find(".check-gramaje-cubierta");
|
||||
this.gramaje170 = $(this.domItem.find("#divGramaje170Cubierta"));
|
||||
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.cubiertaPlastificado = this.domItem.find("#plastificado");
|
||||
this.cubiertaBarniz = this.domItem.find("#barniz");
|
||||
this.cubiertaEstampado = this.domItem.find("#estampado");
|
||||
this.cubiertaRetractilado = this.domItem.find("#retractilado");
|
||||
|
||||
this.configuracionSobrecubierta = this.domItem.find(".config-sobrecubierta");
|
||||
this.sobrecubierta = this.domItem.find("#addSobrecubierta");
|
||||
this.papelSobrecubierta = this.domItem.find("#papelSobrecubierta");
|
||||
this.plastificadoSobrecubierta = this.domItem.find("#plastificadoSobrecubierta");
|
||||
|
||||
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
|
||||
this.observer = new MutationObserver(mutations => {
|
||||
mutations.forEach(mutation => {
|
||||
if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
|
||||
const targetElement = mutation.target;
|
||||
// check if targetElement has class 'selected'
|
||||
if (targetElement.classList.contains('tipo-cubierta')) {
|
||||
this.#handleMenuTipoCubierta();
|
||||
}
|
||||
else if (targetElement.classList.contains('solapas-cubierta')) {
|
||||
this.#handleMenuSolapas();
|
||||
}
|
||||
else if (targetElement.classList.contains('papel-cubierta')) {
|
||||
this.#handleMenuPapel();
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
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.carasCubierta.on('change', this.#handleCarasCubierta.bind(this));
|
||||
|
||||
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);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
cargarDatos(datosCubierta, datosGuardas, datosSobrecubierta) {
|
||||
|
||||
if (datosCubierta.lomoRedondo) {
|
||||
this.tapaDuraLomoRedondo.trigger('click');
|
||||
}
|
||||
else {
|
||||
if (datosCubierta.tapa == "dura") {
|
||||
this.tapaDuraLomoRecto.trigger('click');
|
||||
}
|
||||
else {
|
||||
this.tapaBlanda.trigger('click');
|
||||
}
|
||||
}
|
||||
|
||||
if (datosCubierta.tapa == "dura") {
|
||||
this.papelGuardas.val(datosGuardas.papel.code + "_" + datosGuardas.gramaje).trigger('change');
|
||||
this.guardasImpresas.val(datosGuardas.paginas).trigger('change');
|
||||
this.cabezada.val(datosCubierta.cabezada).trigger('change');
|
||||
}
|
||||
else {
|
||||
this.carasCubierta.val(datosCubierta.paginas).trigger('change');
|
||||
if (datosCubierta.solapas) {
|
||||
this.conSolapas.trigger('click');
|
||||
this.tamanioSolapasCubierta.val(datosCubierta.solapas_ancho);
|
||||
|
||||
}
|
||||
else {
|
||||
this.sinSolapas.trigger('click');
|
||||
}
|
||||
}
|
||||
|
||||
this.divPapelCubierta.find(`[cod="${datosCubierta.papel.code}"]`).addClass('selected');
|
||||
|
||||
setTimeout(function () {
|
||||
$(`#divGramajeCubierta .gramaje-cubierta input[data-value="${datosCubierta.gramaje}"]`).trigger('click');
|
||||
}, 0);
|
||||
|
||||
this.cubiertaPlastificado.val(datosCubierta.plastificado).trigger('change');
|
||||
this.cubiertaBarniz.val(datosCubierta.barniz).trigger('change');
|
||||
this.cubiertaEstampado.val(datosCubierta.estampado).trigger('change');
|
||||
if (datosCubierta.retractilado) {
|
||||
setTimeout(() => {
|
||||
this.cubiertaRetractilado.trigger('click');
|
||||
}, 0);
|
||||
}
|
||||
|
||||
if (datosSobrecubierta && datosSobrecubierta.papel) {
|
||||
this.sobrecubierta.trigger('click');
|
||||
this.papelSobrecubierta.val(datosSobrecubierta.papel.code + "_" + datosSobrecubierta.gramaje).trigger('change');
|
||||
this.solapasSobrecubierta.val(datosSobrecubierta.solapas_ancho);
|
||||
this.plastificadoSobrecubierta.val(datosSobrecubierta.plastificado).trigger('change');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
initValidation() {
|
||||
|
||||
const stepper = this.validatorStepper;
|
||||
|
||||
this.formValidation = FormValidation.formValidation(this.wizardStep, {
|
||||
fields: {
|
||||
div_tipo_cubierta: {
|
||||
validators: {
|
||||
callback: {
|
||||
callback: function (input) {
|
||||
const div = $('#divTipoCubierta'); // Selecciona el div
|
||||
|
||||
div.find('.fv-plugins-message-container').remove();
|
||||
if ($('.tipo-cubierta.selected').length > 0) {
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
div.append(`
|
||||
<div class="fv-plugins-message-container invalid-feedback">
|
||||
<div data-field="div_tipo_cubierta" data-validator="callback" style="margin-top: 50px;">
|
||||
${window.translations["validation"].tipo_cubierta}
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
div_solapas_cubierta: {
|
||||
validators: {
|
||||
callback: {
|
||||
callback: function (input) {
|
||||
const div = $('#divSolapasCubierta');
|
||||
if (div.hasClass("d-none")) return true;
|
||||
|
||||
div.find('.fv-plugins-message-container').remove();
|
||||
if ($('.solapas-cubierta.selected').length > 0) {
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
div.append(`
|
||||
<div class="fv-plugins-message-container invalid-feedback">
|
||||
<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>
|
||||
`);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
div_gramaje_cubierta: {
|
||||
validators: {
|
||||
callback: {
|
||||
callback: function (input) {
|
||||
const div = $('#divGramajeCubierta'); // Selecciona el div
|
||||
|
||||
div.find('.fv-plugins-message-container').remove();
|
||||
if ($('.check-gramaje-cubierta:checked').length > 0) {
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
div.append(`
|
||||
<div class="fv-plugins-message-container invalid-feedback">
|
||||
<div data-field="div_gramaje_cubierta" data-validator="callback" style="margin-top: 50px;">
|
||||
${window.translations["validation"].gramaje_interior}
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
// Use this for enabling/changing valid/invalid class
|
||||
// eleInvalidClass: '',
|
||||
eleValidClass: '',
|
||||
rowSelector: function (field, ele) {
|
||||
// field is the field name
|
||||
// ele is the field element
|
||||
switch (field) {
|
||||
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';
|
||||
}
|
||||
}
|
||||
}),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus(),
|
||||
submitButton: new FormValidation.plugins.SubmitButton()
|
||||
}
|
||||
}).on('core.form.valid', () => {
|
||||
if (this.allowNext)
|
||||
stepper.next();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
getSolapasCubierta() {
|
||||
|
||||
try {
|
||||
|
||||
if (this.solapasCubierta.hasClass("selected").length == 0)
|
||||
return null;
|
||||
else {
|
||||
if (this.sinSolapas.hasClass("selected"))
|
||||
return false;
|
||||
else if (this.conSolapas.hasClass("selected"))
|
||||
return parseInt(this.tamanioSolapasCubierta.val());
|
||||
else
|
||||
return null;
|
||||
}
|
||||
}
|
||||
catch (error) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
getPapel() {
|
||||
|
||||
try {
|
||||
if (this.papelCubierta.filter('.selected').length > 0) {
|
||||
return this.papelCubierta.filter('.selected').attr('cod');
|
||||
}
|
||||
return null;
|
||||
}
|
||||
catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
getGramaje() {
|
||||
|
||||
try {
|
||||
|
||||
if (this.divGramajeCubierta.hasClass("d-none"))
|
||||
return null;
|
||||
|
||||
if (this.gramaje.filter(':checked').length > 0)
|
||||
return this.gramaje.filter(':checked').attr('data-value');
|
||||
|
||||
else
|
||||
return null;
|
||||
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
getAcabados(forResumen = false) {
|
||||
try {
|
||||
let acabados = {};
|
||||
if (forResumen) {
|
||||
acabados = 'Plastificado ' + this.domItem.find("#plastificado").children("option:selected").text();
|
||||
if (this.domItem.find("#barniz").children("option:selected").val() != 'NONE')
|
||||
acabados += ", Barniz UVI " + this.domItem.find("#barniz").children("option:selected").text();
|
||||
if (this.domItem.find("#estampado").children("option:selected").val() != 'NONE')
|
||||
acabados += ", Estampado " + this.domItem.find("#estampado").children("option:selected").text();
|
||||
if (this.domItem.find("#retractilado").hasClass('selected')) {
|
||||
acabados += ", Retractilado ";
|
||||
}
|
||||
return acabados;
|
||||
}
|
||||
else {
|
||||
acabados.plastificado = this.domItem.find("#plastificado ").children("option:selected").val();
|
||||
acabados.barniz = this.domItem.find("#barniz").children("option:selected").val();
|
||||
acabados.estampado = this.domItem.find("#estampado").children("option:selected").val();
|
||||
acabados.retractilado = this.domItem.find("#retractilado").hasClass('selected') ? 'RETR' : 'NONE';
|
||||
}
|
||||
return acabados;
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
getCabezada(forResumen = false) {
|
||||
|
||||
try {
|
||||
if (this.tapaBlanda.hasClass("selected"))
|
||||
return false;
|
||||
else
|
||||
if (forResumen)
|
||||
return this.domItem.find("#cabezada").children("option:selected").text();
|
||||
else
|
||||
return this.domItem.find("#cabezada").children("option:selected").val();
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
getGuardas(forResumen = false) {
|
||||
|
||||
try {
|
||||
if (this.tapaBlanda.hasClass("selected")) {
|
||||
return false;
|
||||
}
|
||||
else {
|
||||
let guardas = {};
|
||||
|
||||
if (forResumen) {
|
||||
let papelGuardas = this.domItem.find("#papelGuardas").children("option:selected").text();
|
||||
guardas.papel = papelGuardas.split(' ')[0] + ' ' + papelGuardas.split(' ')[1];
|
||||
guardas.gramaje = papelGuardas.split(' ')[2];
|
||||
guardas.caras = this.domItem.find("#guardasImpresas").children("option:selected").text();
|
||||
}
|
||||
else {
|
||||
let papelGuardas = this.domItem.find("#papelGuardas").children("option:selected").val();
|
||||
guardas.papel = papelGuardas.split('_')[0];
|
||||
guardas.gramaje = papelGuardas.split('_')[1];
|
||||
guardas.caras = this.domItem.find("#guardasImpresas").children("option:selected").val();
|
||||
}
|
||||
return guardas;
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
getSobrecubierta(forResumen = false) {
|
||||
|
||||
try {
|
||||
if (!this.sobrecubierta.is(":checked")) {
|
||||
return false;
|
||||
}
|
||||
else {
|
||||
if (forResumen) {
|
||||
let sobrecubierta = {};
|
||||
const papel = this.domItem.find("#papelSobrecubierta").children("option:selected").text();
|
||||
sobrecubierta.papel = papel.split(' ')[0] + ' ' + papel.split(' ')[1];
|
||||
sobrecubierta.gramaje = papel.split(' ')[2];
|
||||
sobrecubierta.solapas = this.domItem.find("#solapasSobrecubierta").val();
|
||||
sobrecubierta.plastificado = 'Plastificado ' + this.domItem.find("#plastificadoSobrecubierta").children("option:selected").text();
|
||||
return sobrecubierta;
|
||||
}
|
||||
else {
|
||||
let sobrecubierta = {};
|
||||
let papel = this.domItem.find("#papelSobrecubierta").children("option:selected").val();
|
||||
sobrecubierta.papel = papel.split('_')[0];
|
||||
sobrecubierta.gramaje = papel.split('_')[1];
|
||||
sobrecubierta.solapas = this.domItem.find("#solapasSobrecubierta").val();
|
||||
sobrecubierta.plastificado = this.domItem.find("#plastificadoSobrecubierta").children("option:selected").val();
|
||||
return sobrecubierta;
|
||||
}
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
getFaja() {
|
||||
|
||||
try {
|
||||
if (!this.faja.is(":checked")) {
|
||||
return false;
|
||||
}
|
||||
else {
|
||||
let faja = {};
|
||||
faja.alto = this.domItem.find("#altoFaja").val();
|
||||
let papel = this.domItem.find("#papelFaja").children("option:selected").val();
|
||||
faja.papel = papel.split('_')[0];
|
||||
faja.gramaje = papel.split('_')[1];
|
||||
faja.solapas = this.domItem.find("#solapasFaja").val();
|
||||
faja.plastificado = this.domItem.find("#plastificadoFaja").children("option:selected").val();
|
||||
return faja;
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
#handleCarasCubierta() {
|
||||
// Si es a dos caras
|
||||
if (this.carasCubierta.val() == 4) {
|
||||
this.cartulinaEstucada.addClass("d-none");
|
||||
}
|
||||
else {
|
||||
this.cartulinaEstucada.removeClass("d-none");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handleDisenioCubierta(event) {
|
||||
// Accede al ID del elemento que disparó el evento
|
||||
const element = $(event.target);
|
||||
|
||||
let class2Find = '.tipo-cubierta';
|
||||
|
||||
let containers = element.closest(class2Find).parent().find(class2Find);
|
||||
for (let container of containers) {
|
||||
if (container != element.closest(class2Find)[0]) {
|
||||
$(container).removeClass('selected');
|
||||
$(container).find('.image-presupuesto').removeClass('selected');
|
||||
}
|
||||
}
|
||||
|
||||
element.closest(class2Find).toggleClass('selected');
|
||||
element.closest('.image-presupuesto').toggleClass('selected');
|
||||
|
||||
$(".papel-cubierta").removeClass("selected");
|
||||
|
||||
if (this.tapaBlanda.hasClass("selected")) {
|
||||
if (this.carasCubierta.val() == 2) {
|
||||
this.cartulinaEstucada.removeClass("d-none");
|
||||
}
|
||||
this.divGramajeCubierta.addClass("d-none");
|
||||
}
|
||||
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.gramaje250.addClass("d-none");
|
||||
this.gramaje270.addClass("d-none");
|
||||
this.gramaje300.addClass("d-none");
|
||||
this.gramaje350.addClass("d-none");
|
||||
}
|
||||
|
||||
element.trigger('change');
|
||||
}
|
||||
|
||||
|
||||
#handleSolapasCubierta(event) {
|
||||
// Accede al ID del elemento que disparó el evento
|
||||
const element = $(event.target);
|
||||
|
||||
let class2Find = '.solapas-cubierta';
|
||||
|
||||
let containers = element.closest(class2Find).parent().find(class2Find);
|
||||
for (let container of containers) {
|
||||
if (container != element.closest(class2Find)[0]) {
|
||||
$(container).removeClass('selected');
|
||||
$(container).find('.image-presupuesto').removeClass('selected');
|
||||
}
|
||||
}
|
||||
|
||||
element.closest(class2Find).toggleClass('selected');
|
||||
element.closest('.image-presupuesto').toggleClass('selected');
|
||||
|
||||
element.trigger('change');
|
||||
}
|
||||
|
||||
|
||||
#handlePapelCubierta(event) {
|
||||
// Accede al ID del elemento que disparó el evento
|
||||
const element = $(event.target);
|
||||
|
||||
let class2Find = '.papel-cubierta';
|
||||
|
||||
let containers = element.closest(class2Find).parent().find(class2Find);
|
||||
for (let container of containers) {
|
||||
if (container != element.closest(class2Find)[0]) {
|
||||
$(container).removeClass('selected');
|
||||
$(container).find('.image-presupuesto').removeClass('selected');
|
||||
}
|
||||
}
|
||||
|
||||
element.closest(class2Find).toggleClass('selected');
|
||||
element.closest('.image-presupuesto').toggleClass('selected');
|
||||
|
||||
element.trigger('change');
|
||||
}
|
||||
|
||||
#handleMenuTipoCubierta() {
|
||||
|
||||
if (this.tapaBlanda.hasClass("selected")) {
|
||||
this.divSolapas.removeClass("d-none");
|
||||
this.divCarasImpresion.removeClass("d-none");
|
||||
this.divConfigTapaDura.addClass("d-none");
|
||||
}
|
||||
else if (this.tapaDuraLomoRecto.hasClass("selected") || this.tapaDuraLomoRedondo.hasClass("selected")) {
|
||||
this.solapasCubierta.removeClass("selected");
|
||||
this.divSolapas.addClass("d-none");
|
||||
this.divCarasImpresion.addClass("d-none");
|
||||
this.divConfigTapaDura.removeClass("d-none");
|
||||
this.#handleMenuPapel();
|
||||
|
||||
}
|
||||
else {
|
||||
this.divSolapas.addClass("d-none");
|
||||
this.divCarasImpresion.addClass("d-none");
|
||||
this.divConfigTapaDura.addClass("d-none");
|
||||
this.#handleMenuPapel();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handleMenuSolapas() {
|
||||
|
||||
if (this.conSolapas.hasClass("selected")) {
|
||||
this.divTamanioSolapas.removeClass("d-none");
|
||||
}
|
||||
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() {
|
||||
|
||||
const min = parseInt(this.tamanioSolapasCubierta[0].min);
|
||||
const max = parseInt(this.tamanioSolapasCubierta[0].max);
|
||||
|
||||
if (this.tamanioSolapasCubierta.val() < min || this.tamanioSolapasCubierta.val() == '' || isNaN(this.tamanioSolapasCubierta.val())) {
|
||||
this.tamanioSolapasCubierta.val(min);
|
||||
}
|
||||
|
||||
else if (this.tamanioSolapasCubierta.val() > max)
|
||||
this.tamanioSolapasCubierta.val(max);
|
||||
}
|
||||
|
||||
#handleClickGramaje(customOption) {
|
||||
|
||||
const el = customOption[0];
|
||||
|
||||
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')
|
||||
})
|
||||
}
|
||||
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);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default DisenioCubierta;
|
||||
@ -0,0 +1,775 @@
|
||||
class DisenioInterior {
|
||||
|
||||
constructor(domItem, wizardForm, validatorStepper) {
|
||||
this.domItem = domItem;
|
||||
|
||||
this.wizardStep = wizardForm.querySelector('#interior-libro');
|
||||
this.validatorStepper = validatorStepper;
|
||||
this.allowNext = true;
|
||||
|
||||
this.disenioInterior = this.domItem.find(".disenio-interior");
|
||||
this.divPapelInterior = this.domItem.find("#divPapelInterior");
|
||||
this.divPapelInteriorColor = this.domItem.find("#divPapelInteriorColor");
|
||||
this.divGramajeInterior = this.domItem.find("#divGramajeInterior");
|
||||
this.papelInterior = this.domItem.find(".papel-interior");
|
||||
|
||||
this.negroEstandar = this.domItem.find("#negroEstandar");
|
||||
this.negroPremium = this.domItem.find("#negroPremium");
|
||||
this.colorEstandar = this.domItem.find("#colorEstandar");
|
||||
this.colorPremium = this.domItem.find("#colorPremium");
|
||||
|
||||
this.offsetBlanco = this.domItem.find("#offsetBlanco");
|
||||
this.offsetAhuesado = this.domItem.find("#offsetAhuesado");
|
||||
this.offsetAhuesadoVolumen = this.domItem.find("#offsetAhuesadoVolumen");
|
||||
this.estucadoMate = this.domItem.find("#estucadoMate");
|
||||
|
||||
this.gramaje = this.domItem.find(".check-interior-gramaje");
|
||||
this.gramaje70 = this.domItem.find("#interiorGramaje70");
|
||||
this.gramaje80 = this.domItem.find("#interiorGramaje80");
|
||||
this.gramaje90 = this.domItem.find("#interiorGramaje90");
|
||||
this.gramaje100 = this.domItem.find("#interiorGramaje100");
|
||||
this.gramaje115 = this.domItem.find("#interiorGramaje115");
|
||||
this.gramaje120 = this.domItem.find("#interiorGramaje120");
|
||||
this.gramaje135 = this.domItem.find("#interiorGramaje135");
|
||||
this.gramaje150 = this.domItem.find("#interiorGramaje150");
|
||||
this.gramaje170 = this.domItem.find("#interiorGramaje170");
|
||||
|
||||
this.interiorColor = this.domItem.find(".interior-color");
|
||||
this.disenioInterior_color = this.domItem.find(".disenio-interior-color");
|
||||
this.papelInterior_color = this.domItem.find(".papel-interior-color");
|
||||
|
||||
this.colorEstandar_color = this.domItem.find("#colorEstandarColor");
|
||||
this.colorPremium_color = this.domItem.find("#colorPremiumColor");
|
||||
|
||||
this.offsetBlanco_color = this.domItem.find("#offsetBlancoColor");
|
||||
this.offsetAhuesado_color = this.domItem.find("#offsetAhuesadoColor");
|
||||
this.offsetAhuesadoVolumen_color = this.domItem.find("#offsetAhuesadoVolumenColor");
|
||||
this.estucadoMate_color = this.domItem.find("#estucadoMateColor");
|
||||
|
||||
this.gramaje_color = this.domItem.find(".check-interior-color-gramaje");
|
||||
this.gramaje70_color = this.domItem.find("#interiorGramaje70Color");
|
||||
this.gramaje80_color = this.domItem.find("#interiorGramaje80Color");
|
||||
this.gramaje90_color = this.domItem.find("#interiorGramaje90Color");
|
||||
this.gramaje100_color = this.domItem.find("#interiorGramaje100Color");
|
||||
this.gramaje115_color = this.domItem.find("#interiorGramaje115Color");
|
||||
this.gramaje120_color = this.domItem.find("#interiorGramaje120Color");
|
||||
this.gramaje135_color = this.domItem.find("#interiorGramaje135Color");
|
||||
this.gramaje150_color = this.domItem.find("#interiorGramaje150Color");
|
||||
this.gramaje170_color = this.domItem.find("#interiorGramaje170Color");
|
||||
|
||||
this.checksGramaje = $('.gramaje-interior');
|
||||
|
||||
this.initValidation();
|
||||
|
||||
// Creamos un nuevo observador que detecta cambios en los atributos
|
||||
this.observer = new MutationObserver(mutations => {
|
||||
mutations.forEach(mutation => {
|
||||
if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
|
||||
const targetElement = mutation.target;
|
||||
if (targetElement.id.includes("Color"))
|
||||
this.#handleUpdateGramajeColor();
|
||||
else
|
||||
this.#handleUpdateGramaje();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
init() {
|
||||
|
||||
const self = this;
|
||||
|
||||
// Eventos
|
||||
this.disenioInterior.on('click', this.#handleDisenioInterior.bind(this));
|
||||
this.papelInterior.on('click', this.#handlePapelInterior.bind(this));
|
||||
this.disenioInterior_color.on('click', this.#handleDisenioInterior.bind(this));
|
||||
this.papelInterior_color.on('click', this.#handlePapelInterior.bind(this));
|
||||
|
||||
// Observadores
|
||||
this.observer.observe(this.negroEstandar[0], { attributes: true });
|
||||
this.observer.observe(this.negroPremium[0], { attributes: true });
|
||||
this.observer.observe(this.colorEstandar[0], { attributes: true });
|
||||
this.observer.observe(this.colorPremium[0], { attributes: true });
|
||||
this.observer.observe(this.offsetBlanco[0], { attributes: true });
|
||||
this.observer.observe(this.offsetAhuesado[0], { attributes: true });
|
||||
this.observer.observe(this.offsetAhuesadoVolumen[0], { attributes: true });
|
||||
this.observer.observe(this.estucadoMate[0], { attributes: true });
|
||||
this.observer.observe(this.colorEstandar_color[0], { attributes: true });
|
||||
this.observer.observe(this.colorPremium_color[0], { attributes: true });
|
||||
this.observer.observe(this.offsetBlanco_color[0], { attributes: true });
|
||||
this.observer.observe(this.offsetAhuesado_color[0], { attributes: true });
|
||||
this.observer.observe(this.offsetAhuesadoVolumen_color[0], { attributes: true });
|
||||
this.observer.observe(this.estucadoMate_color[0], { attributes: true });
|
||||
|
||||
this.checksGramaje.each(function () {
|
||||
|
||||
const customOptionEL = $(this);
|
||||
customOptionEL.on('click', function () {
|
||||
self.#handleClickGramaje(customOptionEL);
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
cargarDatos(datos, papelInteriorDiferente) {
|
||||
|
||||
if (papelInteriorDiferente) {
|
||||
|
||||
if (datos.negro) {
|
||||
if (datos.negro.tipo.includes("Premium")) {
|
||||
this.negroPremium.addClass('selected');
|
||||
}
|
||||
else {
|
||||
this.negroEstandar.addClass('selected');
|
||||
}
|
||||
|
||||
this.divPapelInterior.find(`[cod="${datos.negro.papel.code}"]`).addClass('selected');
|
||||
|
||||
setTimeout(function () {
|
||||
$(`#divGramajeInterior .gramaje-interior input[data-value="${datos.negro.gramaje}"]`).trigger('click');
|
||||
}, 0);
|
||||
|
||||
}
|
||||
if (datos.color) {
|
||||
if (datos.color.tipo.includes("Premium")) {
|
||||
this.colorPremium_color.addClass('selected');
|
||||
}
|
||||
else {
|
||||
this.colorEstandar_color.addClass('selected');
|
||||
}
|
||||
|
||||
this.divPapelInteriorColor.find(`[cod="${datos.color.papel.code}"]`).addClass('selected');
|
||||
|
||||
setTimeout(function () {
|
||||
$(`#divGramajeInteriorColor .gramaje-interior-color input[data-value="${datos.color.gramaje}"]`).trigger('click');
|
||||
}, 0);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
else {
|
||||
if (datos.color) {
|
||||
if (datos.color.tipo.includes("Premium")) {
|
||||
this.colorPremium.addClass('selected');
|
||||
}
|
||||
else {
|
||||
this.colorEstandar.addClass('selected');
|
||||
}
|
||||
this.divPapelInterior.find(`[cod="${datos.color.papel.code}"]`).addClass('selected');
|
||||
|
||||
setTimeout(function () {
|
||||
$(`#divGramajeInterior .gramaje-interior input[data-value="${datos.color.gramaje}"]`).trigger('click');
|
||||
}, 0);
|
||||
}
|
||||
else {
|
||||
if (datos.negro.tipo.includes("Premium")) {
|
||||
this.negroPremium.addClass('selected');
|
||||
}
|
||||
else {
|
||||
this.negroEstandar.addClass('selected');
|
||||
}
|
||||
// mismo papel y gramaje
|
||||
this.divPapelInterior.find(`[cod="${datos.negro.papel.code}"]`).addClass('selected');
|
||||
|
||||
setTimeout(function () {
|
||||
$(`#divGramajeInterior .gramaje-interior input[data-value="${datos.negro.gramaje}"]`).trigger('click');
|
||||
}, 0);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
initValidation() {
|
||||
|
||||
const stepper = this.validatorStepper;
|
||||
|
||||
this.formValidation = FormValidation.formValidation(this.wizardStep, {
|
||||
fields: {
|
||||
div_impresion_interior: {
|
||||
validators: {
|
||||
callback: {
|
||||
callback: function (input) {
|
||||
const divImpresionInterior = $('#divImpresionInterior'); // Selecciona el div
|
||||
|
||||
divImpresionInterior.find('.fv-plugins-message-container').remove();
|
||||
if ($('.disenio-interior.selected').length > 0) {
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
divImpresionInterior.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>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
div_papel_interior: {
|
||||
validators: {
|
||||
callback: {
|
||||
callback: function (input) {
|
||||
const divPapelInterior = $('#divPapelInterior'); // Selecciona el div
|
||||
|
||||
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: {
|
||||
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) {
|
||||
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;">
|
||||
${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;">
|
||||
${window.translations["validation"].gramaje_interior}
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
// Use this for enabling/changing valid/invalid class
|
||||
// eleInvalidClass: '',
|
||||
eleValidClass: '',
|
||||
rowSelector: function (field, ele) {
|
||||
// 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':
|
||||
return '.col-sm-10';
|
||||
default:
|
||||
return '.col-sm-3';
|
||||
}
|
||||
}
|
||||
}),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus(),
|
||||
submitButton: new FormValidation.plugins.SubmitButton()
|
||||
}
|
||||
}).on('core.form.valid', () => {
|
||||
if (this.allowNext)
|
||||
stepper.next();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
getIsHq() {
|
||||
|
||||
try {
|
||||
if (this.interiorColor.filter('.d-none').length > 0) {
|
||||
return this.disenioInterior.filter('.selected').attr('id').includes('Premium');
|
||||
}
|
||||
|
||||
else if (this.disenioInterior_color.filter('.selected').length > 0) {
|
||||
return {
|
||||
negro: this.disenioInterior.filter('.selected').attr('id').includes('Premium'),
|
||||
color: this.disenioInterior_color.filter('.selected').attr('id').includes('Premium')
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
getPapel(forResumen = false) {
|
||||
|
||||
try {
|
||||
if (this.papelInterior.filter('.selected').length > 0) {
|
||||
|
||||
if (this.papelInterior_color.filter('.selected').length > 0) {
|
||||
if (forResumen) {
|
||||
return {
|
||||
negro: $(this.papelInterior.filter('.selected').find('.form-label')).text(),
|
||||
color: $(this.papelInterior_color.filter('.selected').find('.form-label')).text(),
|
||||
}
|
||||
}
|
||||
else {
|
||||
return {
|
||||
negro: this.papelInterior.filter('.selected').attr('cod'),
|
||||
color: this.papelInterior_color.filter('.selected').attr('cod')
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
if (this.interiorColor.filter('.d-none').length > 0) {
|
||||
if (forResumen) {
|
||||
return $(this.papelInterior.filter('.selected').find('.form-label')).text();
|
||||
}
|
||||
else {
|
||||
return this.papelInterior.filter('.selected').attr('cod')
|
||||
}
|
||||
}
|
||||
|
||||
else
|
||||
return null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
getGramaje() {
|
||||
|
||||
try {
|
||||
if (this.interiorColor.filter('.d-none').length == 0) {
|
||||
let values = {
|
||||
negro: this.gramaje.filter(':checked').attr('data-value'),
|
||||
color: this.gramaje_color.filter(':checked').attr('data-value')
|
||||
}
|
||||
if (values.negro && values.color) {
|
||||
return values;
|
||||
}
|
||||
else return null;
|
||||
}
|
||||
else {
|
||||
return this.gramaje.filter(':checked').attr('data-value');
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handleClickGramaje(customOption) {
|
||||
|
||||
const el = customOption[0];
|
||||
|
||||
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')
|
||||
})
|
||||
}
|
||||
el.closest('.custom-option').classList.add('checked')
|
||||
} else {
|
||||
el.closest('.custom-option').classList.remove('checked')
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handleDisenioInterior(event) {
|
||||
// Accede al ID del elemento que disparó el evento
|
||||
const element = $(event.target);
|
||||
|
||||
let class2Find = '.disenio-interior';
|
||||
if (element[0].closest('.image-container').id.includes('Color'))
|
||||
class2Find = '.disenio-interior-color';
|
||||
|
||||
let containers = element.closest(class2Find).parent().find(class2Find);
|
||||
for (let container of containers) {
|
||||
if (container != element.closest(class2Find)[0]) {
|
||||
$(container).removeClass('selected');
|
||||
$(container).find('.image-presupuesto').removeClass('selected');
|
||||
}
|
||||
}
|
||||
|
||||
element.closest(class2Find).toggleClass('selected');
|
||||
element.closest('.image-presupuesto').toggleClass('selected');
|
||||
|
||||
// Para recalcular el presupuesto
|
||||
element.trigger('change');
|
||||
}
|
||||
|
||||
|
||||
#handlePapelInterior(event) {
|
||||
// Accede al ID del elemento que disparó el evento
|
||||
const element = $(event.target);
|
||||
|
||||
let class2Find = '.papel-interior';
|
||||
if (element[0].closest('.image-container').id.includes('Color'))
|
||||
class2Find = '.papel-interior-color';
|
||||
|
||||
let containers = element.closest(class2Find).parent().find(class2Find);
|
||||
for (let container of containers) {
|
||||
if (container != element.closest(class2Find)[0]) {
|
||||
$(container).removeClass('selected');
|
||||
$(container).find('.image-presupuesto').removeClass('selected');
|
||||
}
|
||||
}
|
||||
|
||||
element.closest(class2Find).toggleClass('selected');
|
||||
element.closest('.image-presupuesto').toggleClass('selected');
|
||||
|
||||
if ($('#fresado').hasClass('selected')) {
|
||||
if (this.estucadoMate.hasClass('selected') || this.estucadoMate_color.hasClass('selected')) {
|
||||
$('#tapaDuraLomoRedondo').addClass('d-none');
|
||||
}
|
||||
else {
|
||||
$('#tapaDuraLomoRedondo').removeClass('d-none');
|
||||
}
|
||||
}
|
||||
|
||||
// Para recalcular el presupuesto
|
||||
element.trigger('change');
|
||||
}
|
||||
|
||||
#handleUpdateGramaje() {
|
||||
|
||||
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")) {
|
||||
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;
|
||||
}
|
||||
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");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handleUpdateGramajeColor() {
|
||||
|
||||
let showGramaje = false;
|
||||
|
||||
$(".check-interior-color-gramaje ").prop("checked", false);
|
||||
|
||||
if (this.colorEstandar_color.hasClass("selected")) {
|
||||
|
||||
if (this.offsetBlanco_color.hasClass("selected")) {
|
||||
this.gramaje70_color.addClass("d-none");
|
||||
this.gramaje80_color.removeClass("d-none");
|
||||
this.gramaje90_color.removeClass("d-none");
|
||||
this.gramaje100_color.addClass("d-none");
|
||||
this.gramaje115_color.addClass("d-none");
|
||||
this.gramaje120_color.removeClass("d-none");
|
||||
this.gramaje135_color.addClass("d-none");
|
||||
this.gramaje150_color.addClass("d-none");
|
||||
this.gramaje170_color.addClass("d-none");
|
||||
showGramaje = true;
|
||||
}
|
||||
else if (this.offsetAhuesado_color.hasClass("selected")) {
|
||||
this.gramaje70_color.addClass("d-none");
|
||||
this.gramaje80_color.removeClass("d-none");
|
||||
this.gramaje90_color.removeClass("d-none");
|
||||
this.gramaje100_color.addClass("d-none");
|
||||
this.gramaje115_color.addClass("d-none");
|
||||
this.gramaje120_color.addClass("d-none");
|
||||
this.gramaje135_color.addClass("d-none");
|
||||
this.gramaje150_color.addClass("d-none");
|
||||
this.gramaje170_color.addClass("d-none");
|
||||
showGramaje = true;
|
||||
}
|
||||
else if (this.offsetAhuesadoVolumen_color.hasClass("selected")) {
|
||||
this.gramaje70_color.removeClass("d-none");
|
||||
this.gramaje80_color.addClass("d-none");
|
||||
this.gramaje90_color.addClass("d-none");
|
||||
this.gramaje100_color.addClass("d-none");
|
||||
this.gramaje115_color.addClass("d-none");
|
||||
this.gramaje120_color.addClass("d-none");
|
||||
this.gramaje135_color.addClass("d-none");
|
||||
this.gramaje150_color.addClass("d-none");
|
||||
this.gramaje170_color.addClass("d-none");
|
||||
showGramaje = true;
|
||||
}
|
||||
else if (this.estucadoMate_color.hasClass("selected")) {
|
||||
this.gramaje70_color.addClass("d-none");
|
||||
this.gramaje80_color.addClass("d-none");
|
||||
this.gramaje90_color.removeClass("d-none");
|
||||
this.gramaje100_color.addClass("d-none");
|
||||
this.gramaje115_color.addClass("d-none");
|
||||
this.gramaje120_color.removeClass("d-none");
|
||||
this.gramaje135_color.addClass("d-none");
|
||||
this.gramaje150_color.addClass("d-none");
|
||||
this.gramaje170_color.addClass("d-none");
|
||||
showGramaje = true;
|
||||
}
|
||||
}
|
||||
|
||||
else if (this.colorPremium_color.hasClass("selected")) {
|
||||
|
||||
if (this.offsetBlanco_color.hasClass("selected")) {
|
||||
this.gramaje70_color.addClass("d-none");
|
||||
this.gramaje80_color.removeClass("d-none");
|
||||
this.gramaje90_color.removeClass("d-none");
|
||||
this.gramaje100_color.removeClass("d-none");
|
||||
this.gramaje115_color.addClass("d-none");
|
||||
this.gramaje120_color.addClass("d-none");
|
||||
this.gramaje135_color.addClass("d-none");
|
||||
this.gramaje150_color.removeClass("d-none");
|
||||
this.gramaje170_color.removeClass("d-none");
|
||||
showGramaje = true;
|
||||
}
|
||||
else if (this.offsetAhuesado_color.hasClass("selected")) {
|
||||
this.gramaje70_color.addClass("d-none");
|
||||
this.gramaje80_color.removeClass("d-none");
|
||||
this.gramaje90_color.removeClass("d-none");
|
||||
this.gramaje100_color.removeClass("d-none");
|
||||
this.gramaje115_color.addClass("d-none");
|
||||
this.gramaje120_color.addClass("d-none");
|
||||
this.gramaje135_color.addClass("d-none");
|
||||
this.gramaje150_color.addClass("d-none");
|
||||
this.gramaje170_color.addClass("d-none");
|
||||
showGramaje = true;
|
||||
}
|
||||
else if (this.offsetAhuesadoVolumen_color.hasClass("selected")) {
|
||||
this.gramaje70_color.addClass("d-none");
|
||||
this.gramaje80_color.addClass("d-none");
|
||||
this.gramaje90_color.addClass("d-none");
|
||||
this.gramaje100_color.addClass("d-none");
|
||||
this.gramaje115_color.addClass("d-none");
|
||||
this.gramaje120_color.addClass("d-none");
|
||||
this.gramaje135_color.addClass("d-none");
|
||||
this.gramaje150_color.addClass("d-none");
|
||||
this.gramaje170_color.addClass("d-none");
|
||||
showGramaje = true;
|
||||
}
|
||||
else if (this.estucadoMate_color.hasClass("selected")) {
|
||||
this.gramaje70_color.addClass("d-none");
|
||||
this.gramaje80_color.addClass("d-none");
|
||||
this.gramaje90_color.removeClass("d-none");
|
||||
this.gramaje100_color.addClass("d-none");
|
||||
this.gramaje115_color.removeClass("d-none");
|
||||
this.gramaje120_color.addClass("d-none");
|
||||
this.gramaje135_color.removeClass("d-none");
|
||||
this.gramaje150_color.removeClass("d-none");
|
||||
this.gramaje170_color.removeClass("d-none");
|
||||
showGramaje = true;
|
||||
}
|
||||
}
|
||||
|
||||
if ($("#divGramajeInteriorColor").hasClass("d-none") && showGramaje) {
|
||||
$("#divGramajeInteriorColor").removeClass("d-none");
|
||||
}
|
||||
else if (!showGramaje) {
|
||||
$("#divGramajeInteriorColor").addClass("d-none");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default DisenioInterior;
|
||||
@ -0,0 +1,715 @@
|
||||
import DatosGenerales from './datosGenerales.js';
|
||||
import DisenioInterior from './disenioInterior.js';
|
||||
import DisenioCubierta from './disenioCubierta.js';
|
||||
import Direcciones from './direcciones.js';
|
||||
import Resumen from './resumen.js';
|
||||
import Ajax from '../../components/ajax.js';
|
||||
|
||||
|
||||
import tarjetaTiradasPrecio from './tarjetaTiradasPrecio.js';
|
||||
|
||||
class PresupuestoCliente {
|
||||
|
||||
constructor() {
|
||||
this.clientePresupuestoWizard = document.querySelector('#wizard-presupuesto-cliente');
|
||||
|
||||
this.validationStepper = new Stepper(this.clientePresupuestoWizard, {
|
||||
linear: true
|
||||
});
|
||||
|
||||
this.btnNext = $('#btnNext');
|
||||
this.btnPrev = $('#btnPrev');
|
||||
this.btnPrint = $('#btnPrint');
|
||||
this.btnSave = $('#btnSave');
|
||||
this.btnConfirm = $('#btnConfirm');
|
||||
|
||||
this.c = $("#c");
|
||||
this.lc = $("#lc");
|
||||
this.lsc = $("#lsc");
|
||||
|
||||
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);
|
||||
this.direcciones = new Direcciones($("#direcciones-libro"), this.clientePresupuestoWizard, this.validationStepper);
|
||||
this.resumen = new Resumen($("#resumen-libro"), this.datosGenerales, this.disenioInterior, this.disenioCubierta, this.direcciones);
|
||||
|
||||
this.divTiradasPrecios = $("#divTiradasPrecio");
|
||||
|
||||
this.titulosMenu = $(".titulos-menu");
|
||||
|
||||
this.datos = {};
|
||||
this.ajax_calcular = new Ajax('/presupuestocliente/calcular',
|
||||
{}, this.datos,
|
||||
this.#procesarPresupuesto.bind(this),
|
||||
() => { $('#loader').modal('hide'); });
|
||||
|
||||
this.actualizarTiradasEnvio = false;
|
||||
this.calcularPresupuesto = false;
|
||||
}
|
||||
|
||||
|
||||
init() {
|
||||
|
||||
// Fuerza el foco en el campo de búsqueda de select2
|
||||
$(document).on('select2:open', () => {
|
||||
document.querySelector('.select2-search__field').focus();
|
||||
});
|
||||
|
||||
this.validationStepper._element.addEventListener('shown.bs-stepper', this.stepperHandler.bind(this));
|
||||
|
||||
this.datosGenerales.init();
|
||||
this.disenioInterior.init();
|
||||
this.disenioCubierta.init();
|
||||
this.direcciones.init();
|
||||
if (window.location.href.includes("edit")) {
|
||||
this.resumen.init(window.location.href.split("/").pop());
|
||||
}
|
||||
else {
|
||||
this.resumen.init();
|
||||
}
|
||||
|
||||
|
||||
if (this.datosGenerales.excluirRotativa.length == 0) {
|
||||
|
||||
this.direcciones.direccionesCliente.setParams({ 'cliente_id': $("#clienteId").val() })
|
||||
}
|
||||
|
||||
|
||||
this.btnNext.on('click', this.#nextStep.bind(this));
|
||||
this.btnPrev.on('click', this.#prevtStep.bind(this));
|
||||
this.btnSave.on('click', this.#savePresupuesto.bind(this));
|
||||
this.btnConfirm.on('click', this.#confirmPresupuesto.bind(this));
|
||||
|
||||
this.titulosMenu.on('click', this.#handleTitulosMenu.bind(this));
|
||||
|
||||
if (window.location.href.includes("edit")) {
|
||||
|
||||
this.#cargarPresupuesto();
|
||||
const successMessage = sessionStorage.getItem('message');
|
||||
if (successMessage) {
|
||||
popSuccessAlert(successMessage);
|
||||
sessionStorage.removeItem('message');
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.calcularPresupuesto = true;
|
||||
}
|
||||
|
||||
$(".calcular-presupuesto").on('change', this.checkForm.bind(this));
|
||||
}
|
||||
|
||||
|
||||
#checkTiradas() {
|
||||
|
||||
let tiradas = [parseInt(this.datosGenerales.tirada1.val())];
|
||||
|
||||
if (this.datosGenerales.tirada2.val().length > 0 &&
|
||||
Number.isInteger(parseInt(this.datosGenerales.tirada2.val())) &&
|
||||
parseInt(this.datosGenerales.tirada2.val()) > 0 &&
|
||||
this.datosGenerales.tirada2.val() != "") {
|
||||
|
||||
tiradas.push(parseInt(this.datosGenerales.tirada2.val()));
|
||||
}
|
||||
if (this.datosGenerales.tirada3.val().length > 0 &&
|
||||
Number.isInteger(parseInt(this.datosGenerales.tirada3.val())) &&
|
||||
parseInt(this.datosGenerales.tirada3.val()) > 0 &&
|
||||
this.datosGenerales.tirada3.val() != "") {
|
||||
|
||||
tiradas.push(parseInt(this.datosGenerales.tirada3.val()));
|
||||
}
|
||||
if (this.datosGenerales.tirada4.val().length > 0 &&
|
||||
Number.isInteger(parseInt(this.datosGenerales.tirada4.val())) &&
|
||||
parseInt(this.datosGenerales.tirada4.val()) > 0 &&
|
||||
this.datosGenerales.tirada4.val() != "") {
|
||||
|
||||
tiradas.push(parseInt(this.datosGenerales.tirada4.val()));
|
||||
}
|
||||
|
||||
const noPOD = (tiradas.some(tirada => parseInt(tirada) > 30));
|
||||
const siPOD = (tiradas.some(tirada => parseInt(tirada) <= 30));
|
||||
|
||||
this.datosGenerales.formValidation.validateField('tirada');
|
||||
return !(noPOD && siPOD);
|
||||
}
|
||||
|
||||
|
||||
checkForm(event) {
|
||||
|
||||
if (!this.#checkTiradas()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.calcularPresupuesto) {
|
||||
|
||||
if (event.target.id === 'divDirecciones') {
|
||||
if (!this.direcciones.calcularPresupuesto) {
|
||||
this.actualizarTiradasEnvio = false;
|
||||
$('#loader').modal('hide');
|
||||
return;
|
||||
}
|
||||
|
||||
}
|
||||
else {
|
||||
this.actualizarTiradasEnvio = true;
|
||||
this.direcciones.divTiradas.empty();
|
||||
}
|
||||
|
||||
this.#getDatos();
|
||||
|
||||
this.divTiradasPrecios.empty();
|
||||
|
||||
let datos_to_check = { ...this.datos };
|
||||
if (datos_to_check.direcciones) {
|
||||
delete datos_to_check.direcciones;
|
||||
}
|
||||
if (datos_to_check.posPaginasColor == "" || datos_to_check.posPaginasColor == null) {
|
||||
delete datos_to_check.posPaginasColor;
|
||||
}
|
||||
if (datos_to_check.cubierta.acabados.barniz == undefined) {
|
||||
delete datos_to_check.cubierta.acabados.barniz;
|
||||
}
|
||||
if (datos_to_check.cubierta.acabados.plastificado == undefined) {
|
||||
delete datos_to_check.cubierta.acabados.plastificado;
|
||||
}
|
||||
if (datos_to_check.cubierta.acabados.estampado == undefined) {
|
||||
delete datos_to_check.cubierta.acabados.estampado;
|
||||
}
|
||||
if (datos_to_check.sobrecubierta.plastificado == undefined) {
|
||||
delete datos_to_check.sobrecubierta.plastificado;
|
||||
}
|
||||
|
||||
if (Object.values(datos_to_check).every(this.#isValidDataForm)) {
|
||||
try {
|
||||
setTimeout(function () {
|
||||
$('#loader').modal('show');
|
||||
}, 0);
|
||||
|
||||
// Si se está ejecutando la petición, abortar la petición anterior
|
||||
this.ajax_calcular.abort();
|
||||
|
||||
this.ajax_calcular.setData(this.datos);
|
||||
this.ajax_calcular.post();
|
||||
this.direcciones.calcularPresupuesto = false;
|
||||
}
|
||||
catch (e) {
|
||||
console.log(e);
|
||||
$('#loader').modal('hide');
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#handleTitulosMenu(event) {
|
||||
|
||||
$('.titulos-menu').removeClass('crossed');
|
||||
|
||||
const nextElement = $(event.target).attr('data-target')
|
||||
const currentElement = $('.dstepper-block.active').attr('id');
|
||||
|
||||
if (currentElement === nextElement) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (currentElement !== 'resumen-libro') {
|
||||
this.#validateCurrentForm(currentElement, nextElement);
|
||||
}
|
||||
else {
|
||||
this.#goToForm(nextElement);
|
||||
}
|
||||
}
|
||||
|
||||
#goToForm(form) {
|
||||
|
||||
switch (form) {
|
||||
case '#datos-generales':
|
||||
this.validationStepper.to(1);
|
||||
break;
|
||||
|
||||
case '#interior-libro':
|
||||
this.validationStepper.to(2);
|
||||
break;
|
||||
|
||||
case '#cubierta-libro':
|
||||
this.validationStepper.to(3);
|
||||
break;
|
||||
|
||||
case '#direcciones-libro':
|
||||
this.validationStepper.to(4);
|
||||
break;
|
||||
|
||||
case '#resumen-libro':
|
||||
this.validationStepper.to(5);
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#validateCurrentForm(form, nextForm) {
|
||||
|
||||
switch (form) {
|
||||
case 'datos-generales':
|
||||
this.datosGenerales.allowNext = false;
|
||||
validateForm(this.datosGenerales.formValidation).then((status) => {
|
||||
if (status !== 'Valid') {
|
||||
this.datosGenerales.allowNext = true;
|
||||
return false;
|
||||
}
|
||||
this.#goToForm(nextForm);
|
||||
this.datosGenerales.allowNext = true;
|
||||
return true;
|
||||
}).catch(error => {
|
||||
this.datosGenerales.allowNext = true;
|
||||
console.error('Error al validar:', error);
|
||||
return false;
|
||||
});
|
||||
break;
|
||||
|
||||
case 'interior-libro':
|
||||
this.disenioInterior.allowNext = false;
|
||||
validateForm(this.disenioInterior.formValidation).then((status) => {
|
||||
if (status !== 'Valid') {
|
||||
this.disenioInterior.allowNext = true;
|
||||
return false;
|
||||
}
|
||||
this.#goToForm(nextForm);
|
||||
this.disenioInterior.allowNext = true;
|
||||
return true;
|
||||
}
|
||||
).catch(error => {
|
||||
this.disenioInterior.allowNext = true;
|
||||
console.error('Error al validar:', error);
|
||||
return false;
|
||||
});
|
||||
break;
|
||||
|
||||
case 'cubierta-libro':
|
||||
this.disenioCubierta.allowNext = false;
|
||||
validateForm(this.disenioCubierta.formValidation).then((status) => {
|
||||
if (status !== 'Valid') {
|
||||
this.disenioCubierta.allowNext = true;
|
||||
return false;
|
||||
}
|
||||
this.#goToForm(nextForm);
|
||||
this.disenioCubierta.allowNext = true;
|
||||
return true;
|
||||
}
|
||||
).catch(error => {
|
||||
this.disenioCubierta.allowNext = true;
|
||||
console.error('Error al validar:', error);
|
||||
return false;
|
||||
});
|
||||
break;
|
||||
|
||||
case 'direcciones-libro':
|
||||
this.direcciones.allowNext = false;
|
||||
validateForm(this.direcciones.formValidation).then((status) => {
|
||||
if (status !== 'Valid') {
|
||||
this.direcciones.allowNext = true;
|
||||
return false;
|
||||
}
|
||||
this.#goToForm(nextForm);
|
||||
this.direcciones.allowNext = true;
|
||||
return true;
|
||||
}
|
||||
).catch(error => {
|
||||
this.direcciones.allowNext = true;
|
||||
console.error('Error al validar:', error);
|
||||
return false;
|
||||
});
|
||||
break;
|
||||
|
||||
default:
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
stepperHandler() {
|
||||
|
||||
const element = $('.fv-plugins-bootstrap5.fv-plugins-framework.active');
|
||||
|
||||
switch (element.attr('id')) {
|
||||
case 'datos-generales':
|
||||
this.btnPrev.addClass('d-none');
|
||||
this.btnNext.removeClass('d-none');
|
||||
this.btnPrint.addClass('d-none');
|
||||
this.btnSave.addClass('d-none');
|
||||
this.btnConfirm.addClass('d-none');
|
||||
break;
|
||||
|
||||
case 'interior-libro':
|
||||
case 'cubierta-libro':
|
||||
case 'direcciones-libro':
|
||||
this.btnPrev.removeClass('d-none');
|
||||
this.btnNext.removeClass('d-none');
|
||||
this.btnPrint.addClass('d-none');
|
||||
this.btnSave.addClass('d-none');
|
||||
this.btnConfirm.addClass('d-none');
|
||||
break;
|
||||
|
||||
case 'resumen-libro':
|
||||
this.btnPrev.removeClass('d-none');
|
||||
this.btnNext.addClass('d-none');
|
||||
this.btnPrint.removeClass('d-none');
|
||||
this.btnSave.removeClass('d-none');
|
||||
this.btnConfirm.removeClass('d-none');
|
||||
this.resumen.generate();
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#confirmPresupuesto() {
|
||||
|
||||
this.#solicitudGuardarPresupuesto(true);
|
||||
}
|
||||
|
||||
|
||||
#savePresupuesto() {
|
||||
|
||||
this.#solicitudGuardarPresupuesto(false);
|
||||
}
|
||||
|
||||
|
||||
#solicitudGuardarPresupuesto(confirmar = false) {
|
||||
|
||||
this.#getDatos(true);
|
||||
|
||||
if (confirmar) {
|
||||
this.datos["confirmar"] = 1;
|
||||
}
|
||||
|
||||
|
||||
try {
|
||||
$('#loader').modal('show');
|
||||
|
||||
if (window.location.href.includes("edit")) {
|
||||
this.datos["id"] = window.location.href.split("/").pop();
|
||||
}
|
||||
new Ajax('/presupuestocliente/guardar',
|
||||
this.datos,
|
||||
{},
|
||||
(response) => {
|
||||
$('#loader').modal('hide');
|
||||
if (this.datos["confirmar"] || window.location.href.includes("add")) {
|
||||
if (response.status) {
|
||||
sessionStorage.setItem('message', response.message);
|
||||
window.location.href = response.url + '/' + response.status;
|
||||
}
|
||||
else {
|
||||
popErrorAlert("No se ha podido guardar el presupuesto. Por favor, póngase en contacto con el departamento comercial.");
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (response.error) {
|
||||
popErrorAlert("No se ha podido guardar el presupuesto. Por favor, póngase en contacto con el departamento comercial.");
|
||||
}
|
||||
else
|
||||
popSuccessAlert(response.message);
|
||||
}
|
||||
},
|
||||
() => { $('#loader').modal('hide'); }
|
||||
).post();
|
||||
|
||||
}
|
||||
catch (e) {
|
||||
console.log(e);
|
||||
$('#loader').modal('hide');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#procesarPresupuesto(response) {
|
||||
|
||||
$('#loader').modal('hide');
|
||||
|
||||
if (response === null || response === undefined || response === "") {
|
||||
popErrorAlert("No se ha podido calcular el presupuesto para los datos proporcionados. Por favor, póngase en contacto con el departamento comercial."
|
||||
, "sk-alert-2", false);
|
||||
return;
|
||||
}
|
||||
if (Object.values(response.errors).some((value) => value !== "")) {
|
||||
if (response.errors.status == 1) {
|
||||
popErrorAlert("No se ha podido calcular el presupuesto para los datos proporcionados. Por favor, póngase en contacto con el departamento comercial."
|
||||
, "sk-alert-2", false);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
popAlert2Hide();
|
||||
|
||||
|
||||
if (response.tiradas && response.tiradas.length) {
|
||||
|
||||
let tiradas = { ...response.tiradas };
|
||||
tiradas = Object.keys(tiradas).map((key) => tiradas[key]);
|
||||
tiradas.sort((a, b) => a - b);
|
||||
this.divTiradasPrecios.empty();
|
||||
|
||||
for (let i = 0; i < tiradas.length; i++) {
|
||||
new tarjetaTiradasPrecio(
|
||||
this.divTiradasPrecios,
|
||||
('precio-tiradas-' + response.tiradas[i]),
|
||||
tiradas[i],
|
||||
(parseFloat(response.precio_u[i]) * parseInt(tiradas[i])).toFixed(2),
|
||||
response.precio_u[i]
|
||||
);
|
||||
|
||||
if (this.actualizarTiradasEnvio)
|
||||
this.direcciones.insertTirada(tiradas[i]);
|
||||
|
||||
}
|
||||
this.lc.val(parseFloat(response.info.lomo_cubierta).toFixed(2));
|
||||
this.lsc.val(parseFloat(response.info.lomo_sobrecubierta).toFixed(2));
|
||||
setTimeout(() => {
|
||||
$(`#containerTiradasEnvios .tirada-envio input[tirada="${response.tiradas[0]}"]`).trigger('click');
|
||||
}, 0);
|
||||
}
|
||||
$('#loader').modal('hide');
|
||||
// DEBUG
|
||||
//console.log(response);
|
||||
}
|
||||
|
||||
|
||||
#nextStep() {
|
||||
|
||||
switch (this.validationStepper._currentIndex) {
|
||||
case 0:
|
||||
this.datosGenerales.formValidation.validate();
|
||||
break;
|
||||
|
||||
case 1:
|
||||
this.disenioInterior.formValidation.validate();
|
||||
break;
|
||||
|
||||
|
||||
case 2:
|
||||
this.disenioCubierta.formValidation.validate();
|
||||
break;
|
||||
|
||||
case 3:
|
||||
this.direcciones.formValidation.validate();
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#prevtStep() {
|
||||
if (this.validationStepper._currentIndex >= 1 && this.validationStepper._currentIndex <= 4) {
|
||||
this.validationStepper.previous();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#getDatos(save = false) {
|
||||
|
||||
this.datos = {
|
||||
|
||||
clienteId: this.datosGenerales.getCliente(),
|
||||
|
||||
tamanio: this.datosGenerales.getDimensionLibro(),
|
||||
tirada: this.datosGenerales.getTiradas(),
|
||||
paginas: this.datosGenerales.paginas.val(),
|
||||
paginasColor: this.datosGenerales.paginasColor.val(),
|
||||
posPaginasColor: this.datosGenerales.posPaginasColor.val(),
|
||||
pagColorConsecutivas: this.datosGenerales.pagColorConsecutivas.is(':checked') ? 1 : 0,
|
||||
papelInteriorDiferente: this.datosGenerales.papelDiferente.is(':checked') ? 1 : 0,
|
||||
paginasCuadernillo: this.datosGenerales.paginasCuadernillo.val(),
|
||||
|
||||
tipo: this.datosGenerales.tiposLibro.filter('.selected').attr('id'),
|
||||
prototipo: this.datosGenerales.prototipo.is(':checked') ? 1 : 0,
|
||||
|
||||
isColor: this.datosGenerales.getIsColor() ? 1 : 0,
|
||||
isHq: this.disenioInterior.getIsHq() ? 1 : 0,
|
||||
|
||||
interior: {
|
||||
papelInterior: this.disenioInterior.getPapel(),
|
||||
gramajeInterior: this.disenioInterior.getGramaje(),
|
||||
|
||||
},
|
||||
|
||||
cubierta: {
|
||||
tipoCubierta: this.disenioCubierta.disenioCubierta.filter('.selected').attr('id'),
|
||||
papelCubierta: this.disenioCubierta.getPapel(),
|
||||
gramajeCubierta: this.disenioCubierta.getGramaje(),
|
||||
cabezada: this.disenioCubierta.getCabezada(),
|
||||
acabados: this.disenioCubierta.getAcabados(),
|
||||
carasImpresion: this.disenioCubierta.carasCubierta.val(),
|
||||
},
|
||||
|
||||
guardas: this.disenioCubierta.getGuardas(),
|
||||
sobrecubierta: this.disenioCubierta.getSobrecubierta(),
|
||||
faja: this.disenioCubierta.getFaja(),
|
||||
|
||||
excluirRotativa: this.datosGenerales.excluirRotativa.is(':checked') ? 1 : 0,
|
||||
ivaReducido: this.datosGenerales.ivaReducido.find('option:selected').val(),
|
||||
servicios: {
|
||||
'prototipo': this.datosGenerales.prototipo.is(':checked') ? 1 : 0,
|
||||
},
|
||||
};
|
||||
let lomoRedondo = 0;
|
||||
if (this.disenioCubierta.disenioCubierta.filter('.selected').length > 0)
|
||||
lomoRedondo = this.disenioCubierta.disenioCubierta.filter('.selected').attr('id').includes('Redondo') ? 1 : 0;
|
||||
this.datos.cubierta.lomoRedondo = lomoRedondo;
|
||||
|
||||
if (this.datos.tipo == "cosido") {
|
||||
this.datos.paginasCuadernillo = this.datosGenerales.paginasCuadernillo.val();
|
||||
}
|
||||
let solapasCubierta = this.disenioCubierta.getSolapasCubierta();
|
||||
if (solapasCubierta !== null && solapasCubierta !== undefined) {
|
||||
|
||||
if (solapasCubierta === false)
|
||||
this.datos.cubierta.solapas = 0;
|
||||
else {
|
||||
this.datos.cubierta.solapas = 1;
|
||||
this.datos.cubierta.tamanioSolapas = solapasCubierta;
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.datos.cubierta.solapas = 0;
|
||||
}
|
||||
|
||||
if (this.direcciones.direcciones.length > 0) {
|
||||
this.datos.direcciones = [];
|
||||
for (let i = 0; i < this.direcciones.direcciones.length; i++) {
|
||||
this.datos.direcciones.push(this.direcciones.direcciones[i].getFormData());
|
||||
};
|
||||
}
|
||||
|
||||
if (save) {
|
||||
this.datos.datosCabecera = {
|
||||
titulo: this.datosGenerales.titulo.val(),
|
||||
autor: this.datosGenerales.autor.val(),
|
||||
isbn: this.datosGenerales.isbn.val(),
|
||||
coleccion: this.datosGenerales.coleccion.val(),
|
||||
referenciaCliente: this.datosGenerales.referenciaCliente.val(),
|
||||
}
|
||||
this.datos.selectedTirada = this.direcciones.getSelectedTirada();
|
||||
}
|
||||
|
||||
if (window.location.href.includes("edit")) {
|
||||
this.datos["id"] = window.location.href.split("/").pop();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#cargarPresupuesto() {
|
||||
|
||||
$('#loader').modal('show');
|
||||
let id = window.location.href.split("/").pop()
|
||||
new Ajax('/presupuestocliente/cargar/' + id,
|
||||
{},
|
||||
{},
|
||||
(response) => {
|
||||
|
||||
if (response.status === 1) {
|
||||
|
||||
this.lc.val(parseFloat(response.data.lc).toFixed(2));
|
||||
this.lsc.val(parseFloat(response.data.lsc).toFixed(2));
|
||||
|
||||
this.calcularPresupuesto = false;
|
||||
|
||||
this.datosGenerales.cargarDatos(response.data.datosGenerales);
|
||||
this.direcciones.handleChangeCliente();
|
||||
|
||||
this.disenioInterior.cargarDatos(response.data.interior, response.data.datosGenerales.papelInteriorDiferente);
|
||||
this.disenioCubierta.cargarDatos(response.data.cubierta, response.data.guardas, response.data.sobrecubierta);
|
||||
this.direcciones.cargarDatos(response.data.direcciones, response.data.datosGenerales);
|
||||
|
||||
setTimeout(() => {
|
||||
|
||||
$('#loader').modal('hide');
|
||||
|
||||
if (response.data.state != 2) {
|
||||
|
||||
this.calcularPresupuesto = true;
|
||||
this.checkForm({ target: { id: 'tirada' } });
|
||||
}
|
||||
else {
|
||||
$('#menu_resumen_button').trigger('click');
|
||||
setTimeout(() => {
|
||||
this.resumen.init_dropzone();
|
||||
this.resumen.generate_total(response.data.resumen.base, response.data.resumen.precio_unidad);
|
||||
}, 0);
|
||||
}
|
||||
}, 0);
|
||||
}
|
||||
},
|
||||
() => {
|
||||
$('#loader').modal('hide');
|
||||
this.calcularPresupuesto = true;
|
||||
}
|
||||
).get();
|
||||
}
|
||||
|
||||
|
||||
#isValidDataForm(value) {
|
||||
if (value === null || value === undefined || value === '') {
|
||||
return false;
|
||||
}
|
||||
if (typeof value === 'object' && value !== null) {
|
||||
const isValidData = Object.values(value).every(isValid);
|
||||
return isValidData;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
async function validateForm(formValidation) {
|
||||
try {
|
||||
const validationResult = await formValidation.validate();
|
||||
return validationResult;
|
||||
} catch (error) {
|
||||
console.error('Error durante la validación:', error);
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function isValid(value) {
|
||||
if (value === null || value === undefined || value === '') {
|
||||
return false;
|
||||
}
|
||||
if (typeof value === 'object' && value !== null) {
|
||||
return Object.values(value).every(isValid);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
|
||||
function initialize(translations) {
|
||||
|
||||
window.translations = JSON.parse(translations);
|
||||
|
||||
let presupuestoCliente = new PresupuestoCliente();
|
||||
presupuestoCliente.init();
|
||||
}
|
||||
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
|
||||
const locale = document.querySelector('meta[name="locale"]').getAttribute('content');
|
||||
|
||||
new Ajax('/translate/getTranslation', { locale: locale, translationFile: 'Presupuestos' }, {},
|
||||
initialize,
|
||||
function (error) {
|
||||
console.log("Error getting translations:", error);
|
||||
}
|
||||
).post();
|
||||
|
||||
});
|
||||
|
||||
363
httpdocs/assets/js/safekat/pages/presupuestoCliente/resumen.js
Normal file
363
httpdocs/assets/js/safekat/pages/presupuestoCliente/resumen.js
Normal file
@ -0,0 +1,363 @@
|
||||
import previewFormas from "../preview.js";
|
||||
|
||||
class Resumen {
|
||||
constructor(domItem, datosGenerales, disenioInterior, disenioCubierta) {
|
||||
|
||||
this.domItem = domItem;
|
||||
|
||||
this.datosGenerales = datosGenerales;
|
||||
this.disenioInterior = disenioInterior;
|
||||
this.disenioCubierta = disenioCubierta;
|
||||
|
||||
this.titulo = $(this.domItem.find("#resumenTitulo"));
|
||||
this.tipoLibro = $(this.domItem.find("#resumenTipoLibro"));
|
||||
this.formato = $(this.domItem.find("#resumenFormato"));
|
||||
this.paginas = $(this.domItem.find("#resumenPaginas"));
|
||||
this.paginasColor = $(this.domItem.find("#resumenPaginasColor"));
|
||||
this.paginasNegro = $(this.domItem.find("#resumenPaginasNegro"));
|
||||
this.tirada = $(this.domItem.find("#resumenTirada"));
|
||||
this.prototipo = $(this.domItem.find("#resumenPrototipo"));
|
||||
|
||||
this.impresionInterior = $(this.domItem.find("#resumenImpresion"));
|
||||
this.papelInterior = $(this.domItem.find("#resumenPapelInterior"));
|
||||
this.gramajeInterior = $(this.domItem.find("#resumenGramajeInterior"));
|
||||
this.papelInteriorColor = $(this.domItem.find("#resumenPapelInteriorColor"));
|
||||
this.gramajeInteriorColor = $(this.domItem.find("#resumenGramajeInteriorColor"));
|
||||
this.papelInteriorNegro = $(this.domItem.find("#resumenPapelInteriorNegro"));
|
||||
this.gramajeInteriorNegro = $(this.domItem.find("#resumenGramajeInteriorNegro"));
|
||||
|
||||
this.cubiertaTipo = $(this.domItem.find("#resumenCubiertaTipo"));
|
||||
this.itemsCubiertaTapaBlanda = $(this.domItem.find(".cubierta-tapa-blanda"));
|
||||
this.itemsCubiertaTapaDura = $(this.domItem.find(".cubierta-tapa-dura"));
|
||||
this.carasCubierta = $(this.domItem.find("#resumenCarasCubierta"));
|
||||
this.papelCubierta = $(this.domItem.find("#resumenPapelCubierta"));
|
||||
this.gramajeCubierta = $(this.domItem.find("#resumenGramajeCubierta"));
|
||||
this.solapasCubierta = $(this.domItem.find("#resumenSolapasCubierta"));
|
||||
this.papelGuardas = $(this.domItem.find("#resumenPapelGuardas"));
|
||||
this.guardasImpresas = $(this.domItem.find("#resumenGuardasImpresas"));
|
||||
this.cabezada = $(this.domItem.find("#resumenCabezada"));
|
||||
this.cubiertaAcabados = $(this.domItem.find("#resumenCubiertaAcabados"));
|
||||
|
||||
this.divSobrecubierta = $(this.domItem.find("#divResumenSobrecubierta"));
|
||||
this.papelSobrecubierta = $(this.domItem.find("#resumenPapelSobrecubierta"));
|
||||
this.gramajeSobrecubierta = $(this.domItem.find("#resumenGramajeSobrecubierta"));
|
||||
this.solapasSobrecubierta = $(this.domItem.find("#resumenSolapaSobrecubierta"));
|
||||
this.plastificadoSobrecubierta = $(this.domItem.find("#resumenPlastificadoSobreCubierta"));
|
||||
|
||||
this.precio_unidad = $(this.domItem.find("#resumenPrecioU"));
|
||||
this.total_base = $(this.domItem.find("#resumenTotalBase"));
|
||||
this.iva_porcentaje = $(this.domItem.find("#resumenIvaPorcentaje"));
|
||||
this.iva = $(this.domItem.find("#resumenIva"));
|
||||
this.total = $(this.domItem.find("#resumenTotal"));
|
||||
|
||||
this.divPreview = $(this.domItem.find("#pv_ec_shape"));
|
||||
this.btnPreviewCubierta = $(this.domItem.find("#btnPreviewCubierta"));
|
||||
|
||||
this.submitFiles = $(this.domItem.find("#submit-all-files"));
|
||||
|
||||
this.dropzone = null;
|
||||
this.presupuesto_id = -1;
|
||||
}
|
||||
|
||||
|
||||
init(presupuesto_id = -1) {
|
||||
|
||||
this.btnPreviewCubierta.on('click', this.#btnPreview.bind(this));
|
||||
|
||||
this.submitFiles.on('click', this.#btnUploadFiles.bind(this));
|
||||
|
||||
if (presupuesto_id != -1) {
|
||||
this.presupuesto_id = presupuesto_id;
|
||||
}
|
||||
}
|
||||
|
||||
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/presupuestos/" + 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/presupuestos/" + 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: "/presupuestos/presupuestocliente/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.generate();
|
||||
}
|
||||
else {
|
||||
this.btnPreviewCubierta.text('Mostrar desarrollo cubierta');
|
||||
this.divPreview.addClass('d-none');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
generate() {
|
||||
|
||||
this.titulo.text(this.datosGenerales.titulo.val());
|
||||
this.tipoLibro.text(this.#capitalizeFirstLetter(this.datosGenerales.tiposLibro.filter('.selected').attr('id')));
|
||||
|
||||
let ancho = 0, alto = 0;
|
||||
if (this.datosGenerales.checkFormatoPersonalizado.is(':checked')) {
|
||||
ancho = parseFloat(this.datosGenerales.anchoPersonalizado.val());
|
||||
alto = parseFloat(this.datosGenerales.altoPersonalizado.val());
|
||||
this.formato.text(ancho + ' x ' + alto);
|
||||
}
|
||||
|
||||
else {
|
||||
ancho = parseFloat(this.datosGenerales.papelFormatoId.find('option:selected').text().split(" x ")[0]);
|
||||
alto = parseFloat(this.datosGenerales.papelFormatoId.find('option:selected').text().split(" x ")[1]);
|
||||
this.formato.text(this.datosGenerales.papelFormatoId.find('option:selected').text());
|
||||
}
|
||||
|
||||
|
||||
this.divPreview.empty();
|
||||
|
||||
new previewFormas(
|
||||
this.divPreview,
|
||||
this.datosGenerales.tiposLibro.filter('.selected').attr('id'),
|
||||
this.disenioCubierta.disenioCubierta.filter('.selected').attr('id'),
|
||||
"resumen",
|
||||
{
|
||||
ancho: ancho,
|
||||
alto: alto,
|
||||
lomo: $('#lc').val() === '' ? parseFloat('0.0') : parseFloat($('#lc').val()),
|
||||
solapas: this.disenioCubierta.getSolapasCubierta(),
|
||||
lomoRedondo: this.disenioCubierta.tapaDuraLomoRedondo.hasClass('selected'),
|
||||
}
|
||||
).previewEsquemaCubierta();
|
||||
|
||||
this.paginas.text(this.datosGenerales.paginas.val());
|
||||
this.paginasColor.text(this.datosGenerales.paginasColor.val());
|
||||
this.paginasNegro.text(this.datosGenerales.paginasNegro.val());
|
||||
this.tirada.text(parseInt($($('.check-tirada-envio:checked')[0]).attr('tirada')));
|
||||
this.prototipo.text(this.datosGenerales.prototipo.is(':checked') ? 'Sí' : 'No');
|
||||
|
||||
const HQ = this.disenioInterior.getIsHq();
|
||||
const color = this.datosGenerales.getIsColor();
|
||||
const papelInterior = this.disenioInterior.getPapel(true);
|
||||
const gramajeInterior = this.disenioInterior.getGramaje();
|
||||
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");
|
||||
this.impresionInterior.text(impInterior);
|
||||
this.papelInterior.text(papelInterior);
|
||||
this.gramajeInterior.text(gramajeInterior);
|
||||
}
|
||||
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"));
|
||||
this.impresionInterior.text(impInterior);
|
||||
this.papelInteriorNegro.text(papelInterior.negro);
|
||||
this.papelInteriorColor.text(papelInterior.color);
|
||||
this.gramajeInteriorNegro.text(gramajeInterior.negro);
|
||||
this.gramajeInteriorColor.text(gramajeInterior.color);
|
||||
}
|
||||
|
||||
this.cubiertaTipo.text($($('.tipo-cubierta.selected').find('.form-label')).text());
|
||||
this.carasCubierta.text(this.disenioCubierta.carasCubierta.find('option:selected').text());
|
||||
if (this.cubiertaTipo.text().toLowerCase().includes('blanda')) {
|
||||
this.itemsCubiertaTapaBlanda.removeClass('d-none');
|
||||
this.itemsCubiertaTapaDura.addClass('d-none');
|
||||
const solapasCubierta = this.disenioCubierta.getSolapasCubierta();
|
||||
this.solapasCubierta.text(solapasCubierta == false ? 'No' : solapasCubierta);
|
||||
}
|
||||
else {
|
||||
this.itemsCubiertaTapaDura.removeClass('d-none');
|
||||
this.itemsCubiertaTapaBlanda.addClass('d-none');
|
||||
const guardas = this.disenioCubierta.getGuardas(true);
|
||||
this.papelGuardas.text(guardas.papel + ' ' + guardas.gramaje);
|
||||
this.guardasImpresas.text(guardas.caras);
|
||||
this.cabezada.text(this.disenioCubierta.getCabezada(true));
|
||||
|
||||
}
|
||||
this.papelCubierta.text($($('.papel-cubierta.selected').find('.form-label')).text())
|
||||
this.gramajeCubierta.text(this.disenioCubierta.getGramaje());
|
||||
this.cubiertaAcabados.text(this.disenioCubierta.getAcabados(true));
|
||||
|
||||
if (this.disenioCubierta.getSobrecubierta()) {
|
||||
this.divSobrecubierta.removeClass('d-none');
|
||||
const sobrecubierta = this.disenioCubierta.getSobrecubierta(true);
|
||||
this.papelSobrecubierta.text(sobrecubierta.papel);
|
||||
this.gramajeSobrecubierta.text(sobrecubierta.gramaje);
|
||||
this.solapasSobrecubierta.text(sobrecubierta.solapas);
|
||||
this.plastificadoSobrecubierta.text(sobrecubierta.plastificado);
|
||||
}
|
||||
else {
|
||||
this.divSobrecubierta.addClass('d-none');
|
||||
}
|
||||
|
||||
const unidades = parseInt($($('.check-tirada-envio:checked')[0]).attr('tirada'));
|
||||
const tarjetaPrecio = $('.tarjeta-tiradas-precios').filter(function () {
|
||||
return parseInt($(this).find('.tarjeta-tiradas-precios-tirada').attr('data')) == unidades;
|
||||
});
|
||||
|
||||
|
||||
let precio_u_text = tarjetaPrecio.find('.tarjeta-tiradas-precios-precio-unidad').text();
|
||||
precio_u_text = precio_u_text.replace('€/u', '');
|
||||
precio_u_text = this.#changeDecimalFormat(precio_u_text);
|
||||
|
||||
const base = tarjetaPrecio.find('.tarjeta-tiradas-precios-precio').attr('data');
|
||||
let base_text = this.#changeDecimalFormat(base);
|
||||
|
||||
const iva_porcentaje = this.datosGenerales.ivaReducido.find('option:selected').val() == 1 ? 0.21 : 0.04;
|
||||
const iva = (parseFloat(base) * iva_porcentaje).toFixed(2);
|
||||
let iva_text = this.#changeDecimalFormat(iva);
|
||||
|
||||
const total = (parseFloat(base) + parseFloat(iva)).toFixed(2);
|
||||
let total_text = this.#changeDecimalFormat(total);
|
||||
|
||||
this.precio_unidad.text(precio_u_text);
|
||||
this.total_base.text(base_text);
|
||||
this.iva_porcentaje.text(this.datosGenerales.ivaReducido.find('option:selected').val() == 1 ? '21' : '4');
|
||||
this.iva.text(iva_text);
|
||||
this.total.text(total_text);
|
||||
|
||||
}
|
||||
|
||||
generate_total(base, precio_u) {
|
||||
|
||||
let precio_u_text = String(precio_u);
|
||||
precio_u_text = precio_u_text.replace('€/u', '');
|
||||
precio_u_text = this.#changeDecimalFormat(precio_u_text);
|
||||
|
||||
let base_text = this.#changeDecimalFormat(String(base));
|
||||
|
||||
const iva_porcentaje = this.datosGenerales.ivaReducido.find('option:selected').val() == 1 ? 0.21 : 0.04;
|
||||
const iva = (parseFloat(base) * iva_porcentaje).toFixed(2);
|
||||
let iva_text = this.#changeDecimalFormat(iva);
|
||||
|
||||
const total = (parseFloat(base) + parseFloat(iva)).toFixed(2);
|
||||
let total_text = this.#changeDecimalFormat(total);
|
||||
|
||||
this.precio_unidad.text(precio_u_text);
|
||||
this.total_base.text(base_text);
|
||||
this.iva_porcentaje.text(this.datosGenerales.ivaReducido.find('option:selected').val() == 1 ? '21' : '4');
|
||||
this.iva.text(iva_text);
|
||||
this.total.text(total_text);
|
||||
}
|
||||
|
||||
|
||||
#capitalizeFirstLetter(string) {
|
||||
return string.charAt(0).toUpperCase() + string.slice(1);
|
||||
}
|
||||
|
||||
|
||||
#changeDecimalFormat(number) {
|
||||
|
||||
let cleanedNumber = String(number).replace(/[^\d.]/g, '');
|
||||
let partes = cleanedNumber.split('.');
|
||||
partes[0] = partes[0].replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1.');
|
||||
return partes.join(',');
|
||||
}
|
||||
}
|
||||
|
||||
export default Resumen;
|
||||
@ -0,0 +1,59 @@
|
||||
class SelectorTiradaEnvio {
|
||||
|
||||
constructor(container, id, tirada) {
|
||||
|
||||
this.container = container;
|
||||
this.tirada = tirada;
|
||||
this.card = this.#generateHTML(id, tirada);
|
||||
this.container.append(this.card);
|
||||
}
|
||||
|
||||
#generateHTML(id, tirada) {
|
||||
|
||||
|
||||
var $checkboxContainer = $('<div>', {
|
||||
class: 'checkbox-presupuesto-tiradas-envio mb-md-0 mb-3'
|
||||
});
|
||||
|
||||
// Crear el segundo div con clase form-check
|
||||
var $formCheckDiv = $('<div>', {
|
||||
class: 'form-check custom-option custom-option-icon tirada-envio'
|
||||
});
|
||||
|
||||
// Crear el label
|
||||
var $label = $('<label>', {
|
||||
class: 'form-check-label custom-option-content',
|
||||
for: id
|
||||
});
|
||||
|
||||
// Crear los spans para el título
|
||||
var $spanBody = $('<span>', { class: 'custom-option-body' });
|
||||
var $spanTitle = $('<span>', { class: 'custom-option-title', text: tirada + ' ud.' });
|
||||
|
||||
// Crear el input radio
|
||||
var $inputRadio = $('<input>', {
|
||||
id: id,
|
||||
name: 'customRadioTiradaEnvio',
|
||||
class: 'check-tirada-envio form-check-input',
|
||||
type: 'radio',
|
||||
tirada: tirada,
|
||||
value: ''
|
||||
});
|
||||
|
||||
// Añadir el span del título al span del cuerpo
|
||||
$spanBody.append($spanTitle);
|
||||
|
||||
// Añadir los elementos al label
|
||||
$label.append($spanBody).append($inputRadio);
|
||||
|
||||
// Añadir el label al div form-check
|
||||
$formCheckDiv.append($label);
|
||||
|
||||
// Añadir el form-check div al contenedor principal
|
||||
$checkboxContainer.append($formCheckDiv);
|
||||
|
||||
return $checkboxContainer;
|
||||
}
|
||||
}
|
||||
|
||||
export default SelectorTiradaEnvio;
|
||||
@ -0,0 +1,60 @@
|
||||
class tarjetaTiradasPrecio {
|
||||
|
||||
constructor(domItem, id, tirada, precio, precio_unidad) {
|
||||
this.domItem = domItem;
|
||||
this.id = id;
|
||||
this.tirada = tirada;
|
||||
this.precio = precio;
|
||||
this.precio_unidad = precio_unidad;
|
||||
|
||||
this.card = this.#generateHTML(id, tirada, precio, precio_unidad);
|
||||
this.domItem.append(this.card);
|
||||
}
|
||||
|
||||
#generateHTML(id, tirada, precio, precio_unidad) {
|
||||
|
||||
let $html = $('<div>', {
|
||||
id: id,
|
||||
class: 'list-group mb-2 tarjeta-tiradas-precios'
|
||||
});
|
||||
|
||||
let $link = $('<a>', {
|
||||
href: 'javascript:void(0);',
|
||||
class: 'list-group-item'
|
||||
});
|
||||
|
||||
let $liWrapper = $('<div>', {
|
||||
class: 'li-wrapper d-flex justify-content-start align-items-center'
|
||||
});
|
||||
|
||||
let $listContent = $('<div>', {
|
||||
class: 'list-content'
|
||||
});
|
||||
|
||||
$listContent.append($('<h7>', {
|
||||
id: 'ud_' + id,
|
||||
class: 'mb-1 tarjeta-tiradas-precios-tirada',
|
||||
text: tirada + ' ud.'
|
||||
}).attr('data', tirada));
|
||||
|
||||
$listContent.append($('<h6>', {
|
||||
id: 'tot_' + id,
|
||||
class: 'mb-1 tarjeta-tiradas-precios-precio',
|
||||
text: 'Total: ' + precio + '€'
|
||||
}).attr('data', precio));
|
||||
|
||||
$listContent.append($('<h7>', {
|
||||
id: 'pu_' + id,
|
||||
class: 'mb-1 tarjeta-tiradas-precios-precio-unidad',
|
||||
text: precio_unidad + '€/ud'
|
||||
}).attr('data', precio_unidad));
|
||||
|
||||
$liWrapper.append($listContent);
|
||||
$link.append($liWrapper);
|
||||
$html.append($link);
|
||||
|
||||
return $html;
|
||||
}
|
||||
}
|
||||
|
||||
export default tarjetaTiradasPrecio;
|
||||
759
httpdocs/assets/js/safekat/pages/preview.js
Normal file
759
httpdocs/assets/js/safekat/pages/preview.js
Normal file
@ -0,0 +1,759 @@
|
||||
|
||||
class previewFormas {
|
||||
constructor(container, tipoLibro, tipoTapa, size, datos) {
|
||||
|
||||
this.container = container;
|
||||
this.tipoLibro = tipoLibro;
|
||||
this.tipoTapa = tipoTapa;
|
||||
this.size = size;
|
||||
|
||||
this.ancho = datos.ancho;
|
||||
this.alto = datos.alto;
|
||||
this.lomo = datos.lomo;
|
||||
|
||||
if (datos.solapas == undefined || datos.solapas == null || datos.solapas == false) {
|
||||
this.solapa = 0;
|
||||
this.offsetSolapa = 0.0;
|
||||
}
|
||||
else {
|
||||
this.solapa = datos.solapas;
|
||||
this.offsetSolapa = 3.0;
|
||||
}
|
||||
this.lomoRedondo = datos.lomoRedondo;
|
||||
|
||||
}
|
||||
|
||||
previewEsquemaCubierta() {
|
||||
|
||||
if (this.tipoLibro.includes("cosido") || this.tipoLibro.includes("fresado")) {
|
||||
if (this.tipoTapa.toLowerCase().includes("dura"))
|
||||
this.#portadaTapaDura();
|
||||
else {
|
||||
this.#portadaTapaBlanda();
|
||||
}
|
||||
}
|
||||
else if (this.tipoLibro.includes("espiral") || this.tipoLibro.includes("wire-o")) {
|
||||
if (this.tipoTapa.toLowerCase().includes("dura"))
|
||||
this.#portadaEspiral(true);
|
||||
else
|
||||
this.#portadaEspiral(false);
|
||||
}
|
||||
else if (this.tipoLibro.includes("grapado")) {
|
||||
this.#portadaGrapado();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
#portadaTapaBlanda() {
|
||||
|
||||
// Variables locales
|
||||
let altoLibro, anchoLibro, lomoLibro, anchoCubierta, altoSangrado, anchoSangrado, anchoSolapa;
|
||||
let styleCotas = { size: 12, family: 'Public Sans' };
|
||||
let sangradoTexto = "Sangrado 5 mm";
|
||||
let sangradoValor = parseFloat(5); // mm
|
||||
let offsetSolapaValor = parseFloat(0); // mm
|
||||
|
||||
// Definicion de los parametros del Esquema de Cubierta (EC)
|
||||
if (this.solapa == 0) {
|
||||
if (this.size == "thumbnail") {
|
||||
anchoSangrado = 350; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
|
||||
} else {
|
||||
anchoSangrado = 800; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
|
||||
}
|
||||
|
||||
altoLibro = altoSangrado * 0.97;
|
||||
anchoLibro = anchoSangrado * 0.419;
|
||||
anchoSolapa = 0;
|
||||
lomoLibro = anchoSangrado * 0.133;
|
||||
anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + lomoLibro;
|
||||
|
||||
} else {
|
||||
if (this.size == "thumbnail") {
|
||||
anchoSangrado = 350; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
|
||||
} else {
|
||||
anchoSangrado = 750; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
|
||||
}
|
||||
altoLibro = altoSangrado * 0.95;
|
||||
anchoLibro = anchoSangrado * 0.28;
|
||||
anchoSolapa = anchoSangrado * 0.163;
|
||||
lomoLibro = anchoSangrado * 0.09;
|
||||
anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + lomoLibro;
|
||||
}
|
||||
|
||||
// Clear the canvas element
|
||||
this.container.empty();
|
||||
// Get the element for placing the graphical elements
|
||||
var previewEC = new Two({ fitted: true }).appendTo(this.container[0]);
|
||||
// Calculate the center of the canvas element
|
||||
var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2);
|
||||
|
||||
var sangrado = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
anchoSangrado,
|
||||
altoSangrado
|
||||
);
|
||||
sangrado.stroke = 'black';
|
||||
sangrado.dashes = [5, 5];
|
||||
sangrado.fill = '#FCEAF1';
|
||||
sangrado.linewidth = 1;
|
||||
|
||||
if (this.solapa != 0) {
|
||||
var solapas = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
anchoCubierta,
|
||||
altoLibro);
|
||||
solapas.stroke = 'black';
|
||||
solapas.linewidth = 1;
|
||||
|
||||
// Cotas Solapas
|
||||
if (this.size != "thumbnail") {
|
||||
var cotaSolapa2 = previewEC.makeDobleArrow(
|
||||
origenEC.x - anchoCubierta / 2,
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x - anchoLibro - lomoLibro / 2,
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaSolapa2.linewidth = 2;
|
||||
var cotaSolapa1 = previewEC.makeDobleArrow(
|
||||
origenEC.x + anchoCubierta / 2,
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x + anchoLibro + lomoLibro / 2,
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaSolapa1.linewidth = 2;
|
||||
|
||||
// Textos Solapas
|
||||
let stylesSolapa = { size: 18, family: 'Public Sans' };
|
||||
previewEC.makeText("Solapa 1", origenEC.x + anchoLibro + (lomoLibro + anchoSolapa) / 2, origenEC.y, stylesSolapa);
|
||||
previewEC.makeText("Solapa 2", origenEC.x - anchoLibro - (lomoLibro + anchoSolapa) / 2, origenEC.y, stylesSolapa);
|
||||
// Textos Cotas Solapas
|
||||
previewEC.makeText(anchoSolapa.toFixed(1) + " mm", origenEC.x - anchoLibro - (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText(anchoSolapa.toFixed(1) + " mm", origenEC.x + anchoLibro + (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
var libro = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
((2 * anchoLibro) + lomoLibro),
|
||||
altoLibro);
|
||||
libro.stroke = 'black';
|
||||
libro.linewidth = 1;
|
||||
|
||||
var lomo = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
lomoLibro,
|
||||
altoLibro);
|
||||
lomo.stroke = 'black';
|
||||
lomo.fill = '#F4F8F2';
|
||||
lomo.linewidth = 1;
|
||||
|
||||
// Cotas y textos
|
||||
if (this.size != "thumbnail") {
|
||||
// Cotas:
|
||||
var cotaAnchoCubierta = previewEC.makeDobleArrow(
|
||||
origenEC.x - (anchoSangrado / 2),
|
||||
origenEC.y + (altoLibro / 2) + 35,
|
||||
origenEC.x + (anchoSangrado / 2),
|
||||
origenEC.y + (altoLibro / 2) + 35,
|
||||
10);
|
||||
cotaAnchoCubierta.linewidth = 2;
|
||||
var cotaAltoCubierta = previewEC.makeDobleArrow(
|
||||
origenEC.x + (anchoCubierta / 2) + 35,
|
||||
origenEC.y + (altoSangrado / 2),
|
||||
origenEC.x + (anchoCubierta / 2) + 35,
|
||||
origenEC.y - (altoSangrado / 2),
|
||||
10);
|
||||
cotaAltoCubierta.linewidth = 2;
|
||||
var cotaAltoLibro = previewEC.makeDobleArrow(
|
||||
origenEC.x + (lomoLibro / 2) + 35,
|
||||
origenEC.y + (altoLibro / 2),
|
||||
origenEC.x + (lomoLibro / 2) + 35,
|
||||
origenEC.y - (altoLibro / 2),
|
||||
10);
|
||||
cotaAltoLibro.linewidth = 2;
|
||||
var cotaLomo = previewEC.makeDobleArrow(
|
||||
origenEC.x - (lomoLibro / 2),
|
||||
origenEC.y + (altoLibro / 3),
|
||||
origenEC.x + (lomoLibro / 2),
|
||||
origenEC.y + (altoLibro / 3),
|
||||
10);
|
||||
cotaLomo.linewidth = 2;
|
||||
var cotaContraportada = previewEC.makeDobleArrow(
|
||||
origenEC.x - (lomoLibro / 2 + anchoLibro),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x - (lomoLibro / 2),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaContraportada.linewidth = 2;
|
||||
var cotaPortada = previewEC.makeDobleArrow(
|
||||
origenEC.x + (lomoLibro / 2),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x + (lomoLibro / 2 + anchoLibro),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaPortada.linewidth = 2;
|
||||
|
||||
|
||||
// Textos:
|
||||
// Titulos generales
|
||||
let stylesEC = { size: 22, weight: 'bold', family: 'Public Sans' };
|
||||
previewEC.makeText("Portada", origenEC.x + (lomoLibro + anchoLibro) / 2, origenEC.y, stylesEC);
|
||||
previewEC.makeText("Contraportada", origenEC.x - (lomoLibro + anchoLibro) / 2, origenEC.y, stylesEC);
|
||||
let a = previewEC.makeText("Lomo", origenEC.x, origenEC.y, stylesEC).rotation = -Math.PI / 2;
|
||||
// Sangrados
|
||||
let styleSangrado = { size: 10, family: 'Public Sans', style: 'italic', fill: 'red' };
|
||||
previewEC.makeText(sangradoTexto, origenEC.x, origenEC.y + (altoLibro / 2 + 20), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x, origenEC.y - (altoLibro / 2 + 20), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x + (lomoLibro / 2 + anchoLibro + anchoSolapa + 20), origenEC.y, styleSangrado).rotation = -Math.PI / 2;
|
||||
previewEC.makeText(sangradoTexto, origenEC.x - (lomoLibro / 2 + anchoLibro + anchoSolapa + 20), origenEC.y, styleSangrado).rotation = -Math.PI / 2;
|
||||
// Cotas
|
||||
previewEC.makeText(lomoLibro.toFixed(1) + " mm", origenEC.x, origenEC.y + (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText((anchoLibro + offsetSolapaValor).toFixed(1) + " mm", origenEC.x - (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText((anchoLibro + offsetSolapaValor).toFixed(1) + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText(altoLibro.toFixed(1) + " mm", origenEC.x + (lomoLibro / 2) + 25, origenEC.y, styleCotas).rotation = -Math.PI / 2;
|
||||
previewEC.makeText((altoLibro + (2 * sangradoValor)).toFixed(1) + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro + anchoSolapa) + 50, origenEC.y, styleCotas).rotation = -Math.PI / 2;
|
||||
previewEC.makeText(((2 * anchoLibro) + (2 * (anchoSolapa + offsetSolapaValor)) + lomoLibro + (2 * sangradoValor)).toFixed(1) + " mm",
|
||||
origenEC.x,
|
||||
origenEC.y + (altoLibro / 2) + 50,
|
||||
styleCotas);
|
||||
|
||||
}
|
||||
|
||||
previewEC.update();
|
||||
|
||||
}
|
||||
|
||||
|
||||
#portadaTapaDura() {
|
||||
|
||||
// Variables locales
|
||||
let altoLibro, anchoLibro, lomoLibro, anchoCubierta, altoSangrado, anchoSangrado;
|
||||
let styleCotas = { size: 12, family: 'Public Sans' };
|
||||
let sangradoTexto = "Sangrado 20 mm";
|
||||
let sangradoValor = parseFloat(20); // mm
|
||||
if (this.ancho >= 210 || this.alto >= 297) {
|
||||
sangradoValor = parseFloat(15); // mm
|
||||
sangradoTexto = "Sangrado 15 mm";
|
||||
}
|
||||
let anchoPliegue = parseFloat(7); // mm cajo
|
||||
let altoPliegue = parseFloat(7); // mm
|
||||
let anchoCarton = parseFloat(6); // mm
|
||||
if (this.lomoRedondo)
|
||||
anchoCarton += parseFloat(6); // mm
|
||||
// Definicion de los parametros del Esquema de Cubierta (EC)
|
||||
if (this.size == "thumbnail") {
|
||||
anchoSangrado = 350; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
|
||||
} else {
|
||||
anchoSangrado = 800; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
|
||||
}
|
||||
altoLibro = altoSangrado * 0.88;
|
||||
anchoLibro = anchoSangrado * 0.39;
|
||||
lomoLibro = anchoSangrado * 0.133;
|
||||
anchoCubierta = (2 * anchoLibro) + lomoLibro;
|
||||
|
||||
// Clear the canvas element
|
||||
this.container.empty();
|
||||
// Get the element for placing the graphical elements
|
||||
var previewEC = new Two({ fitted: true }).appendTo($(this.container)[0]);
|
||||
|
||||
// Calculate the center of the canvas element
|
||||
var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2);
|
||||
|
||||
var sangrado = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
anchoSangrado,
|
||||
altoSangrado
|
||||
);
|
||||
sangrado.stroke = 'black';
|
||||
sangrado.dashes = [5, 5];
|
||||
sangrado.fill = '#FCEAF1';
|
||||
sangrado.linewidth = 1;
|
||||
|
||||
var libro = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
((2 * anchoLibro) + lomoLibro),
|
||||
altoLibro);
|
||||
libro.stroke = 'black';
|
||||
libro.linewidth = 1;
|
||||
|
||||
var lomo = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
lomoLibro,
|
||||
altoLibro);
|
||||
lomo.stroke = 'black';
|
||||
lomo.fill = '#F4F8F2';
|
||||
lomo.linewidth = 1;
|
||||
|
||||
// Cotas y textos
|
||||
if (this.size != "thumbnail") {
|
||||
// Cotas:
|
||||
var cotaAnchoCubierta = previewEC.makeDobleArrow(
|
||||
origenEC.x - (anchoSangrado / 2),
|
||||
origenEC.y + (altoLibro / 2) + 35,
|
||||
origenEC.x + (anchoSangrado / 2),
|
||||
origenEC.y + (altoLibro / 2) + 35,
|
||||
10);
|
||||
cotaAnchoCubierta.linewidth = 2;
|
||||
var cotaAltoCubierta = previewEC.makeDobleArrow(
|
||||
origenEC.x + (anchoCubierta / 2) + 40,
|
||||
origenEC.y + (altoSangrado / 2),
|
||||
origenEC.x + (anchoCubierta / 2) + 40,
|
||||
origenEC.y - (altoSangrado / 2),
|
||||
10);
|
||||
cotaAltoCubierta.linewidth = 2;
|
||||
var cotaAltoLibro = previewEC.makeDobleArrow(
|
||||
origenEC.x + (lomoLibro / 2) + 35,
|
||||
origenEC.y + (altoLibro / 2),
|
||||
origenEC.x + (lomoLibro / 2) + 35,
|
||||
origenEC.y - (altoLibro / 2),
|
||||
10);
|
||||
cotaAltoLibro.linewidth = 2;
|
||||
var cotaLomo = previewEC.makeDobleArrow(
|
||||
origenEC.x - (lomoLibro / 2),
|
||||
origenEC.y + (altoLibro / 3),
|
||||
origenEC.x + (lomoLibro / 2),
|
||||
origenEC.y + (altoLibro / 3),
|
||||
10);
|
||||
cotaLomo.linewidth = 2;
|
||||
var cotaContraportada = previewEC.makeDobleArrow(
|
||||
origenEC.x - (lomoLibro / 2 + anchoLibro),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x - (lomoLibro / 2),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaContraportada.linewidth = 2;
|
||||
var cotaPortada = previewEC.makeDobleArrow(
|
||||
origenEC.x + (lomoLibro / 2),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x + (lomoLibro / 2 + anchoLibro),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaPortada.linewidth = 2;
|
||||
|
||||
|
||||
// Textos:
|
||||
// Titulos generales
|
||||
let stylesEC = { size: 22, weight: 'bold', family: 'Public Sans' };
|
||||
previewEC.makeText("Portada", origenEC.x + (lomoLibro + anchoLibro) / 2, origenEC.y, stylesEC);
|
||||
previewEC.makeText("Contraportada", origenEC.x - (lomoLibro + anchoLibro) / 2, origenEC.y, stylesEC);
|
||||
previewEC.makeText("Lomo", origenEC.x, origenEC.y, stylesEC).rotation = -Math.PI / 2;
|
||||
// Sangrados
|
||||
let styleSangrado = { size: 10, family: 'Public Sans', style: 'italic', fill: 'red' };
|
||||
previewEC.makeText(sangradoTexto, origenEC.x, origenEC.y + (altoLibro / 2 + 13), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x, origenEC.y - (altoLibro / 2 + 13), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x + (lomoLibro / 2 + anchoLibro + 13), origenEC.y, styleSangrado).rotation = -Math.PI / 2;
|
||||
previewEC.makeText(sangradoTexto, origenEC.x - (lomoLibro / 2 + anchoLibro + 13), origenEC.y, styleSangrado).rotation = -Math.PI / 2;
|
||||
// Cotas
|
||||
previewEC.makeText((this.lomo + anchoCarton).toFixed(1) + " mm", origenEC.x, origenEC.y + (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText((this.ancho + anchoPliegue).toFixed(1) + " mm", origenEC.x - (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText((this.ancho + anchoPliegue).toFixed(1) + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText((this.alto + altoPliegue).toFixed(1) + " mm", origenEC.x + (lomoLibro / 2) + 50, origenEC.y, styleCotas).rotation = -Math.PI / 2;
|
||||
previewEC.makeText((this.alto + (2 * sangradoValor) + altoPliegue).toFixed(1) + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro) + 55, origenEC.y, styleCotas).rotation = -Math.PI / 2;
|
||||
previewEC.makeText((2 * this.ancho) + this.lomo + (2 * sangradoValor) + +(2 * anchoPliegue) + anchoCarton + " mm",
|
||||
origenEC.x,
|
||||
origenEC.y + (altoLibro / 2) + 50,
|
||||
styleCotas);
|
||||
|
||||
}
|
||||
|
||||
previewEC.update();
|
||||
}
|
||||
|
||||
#portadaEspiral(isTapaDura = false) {
|
||||
|
||||
// Variables locales
|
||||
let altoLibro, anchoLibro, anchoSolapa, anchoCalle, altoSangrado, anchoSangrado, offsetCubierta, anchoCubierta;
|
||||
let styleCotas = { size: 12, family: 'Public Sans' };
|
||||
let sangradoTexto = (isTapaDura) ? "Sangrado 20 mm" : "Sangrado 5 mm";
|
||||
let sangradoValor = (isTapaDura) ? parseFloat(20) : parseFloat(5); // mm
|
||||
|
||||
|
||||
// Definicion de los parametros del Esquema de Cubierta (EC)
|
||||
if ((this.solapa !== 0) && (!isTapaDura)) {
|
||||
if (this.size == "thumbnail") {
|
||||
anchoSangrado = 350; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
|
||||
} else {
|
||||
anchoSangrado = 750; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
|
||||
}
|
||||
altoLibro = altoSangrado * 0.95;
|
||||
anchoLibro = anchoSangrado * 0.28;
|
||||
anchoCalle = anchoSangrado * 0.02;
|
||||
anchoSolapa = anchoSangrado * 0.163;
|
||||
sangrado = anchoSangrado * 0.03;
|
||||
anchoCubierta = 2 * (anchoLibro + anchoSolapa + sangrado) + anchoCalle;
|
||||
offsetCubierta = anchoLibro / 2 + anchoCalle / 2 + anchoSolapa / 2 + sangrado;
|
||||
} else {
|
||||
if (this.size == "thumbnail") {
|
||||
anchoSangrado = 350; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
|
||||
} else {
|
||||
anchoSangrado = 750; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
|
||||
}
|
||||
altoLibro = (isTapaDura) ? altoSangrado * 0.88 : altoSangrado * 0.9;
|
||||
anchoLibro = (isTapaDura) ? anchoSangrado * 0.39 : anchoSangrado * 0.44;
|
||||
anchoCalle = anchoSangrado * 0.02;
|
||||
anchoSolapa = 0;
|
||||
anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + anchoCalle;
|
||||
offsetCubierta = anchoLibro / 2 + anchoCalle / 2 + anchoSolapa + sangradoValor;
|
||||
}
|
||||
|
||||
var previewEC = new Two({ fitted: true }).appendTo(this.container[0]);
|
||||
// Calculate the center of the canvas element
|
||||
var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2);
|
||||
|
||||
var sangrado = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
anchoSangrado,
|
||||
altoSangrado
|
||||
);
|
||||
sangrado.stroke = 'black';
|
||||
sangrado.dashes = [5, 5];
|
||||
sangrado.fill = '#FCEAF1';
|
||||
sangrado.linewidth = 1;
|
||||
|
||||
if ((this.solapa != 0) && (!isTapaDura)) {
|
||||
var solapa1 = previewEC.makeRectangle(
|
||||
origenEC.x + (anchoLibro + anchoCalle / 2 + anchoSolapa / 2 + sangradoValor),
|
||||
origenEC.y,
|
||||
anchoSolapa,
|
||||
altoLibro);
|
||||
solapa1.stroke = 'black';
|
||||
solapa1.linewidth = 1;
|
||||
|
||||
var solapa2 = previewEC.makeRectangle(
|
||||
origenEC.x - (anchoLibro + anchoCalle / 2 + anchoSolapa / 2 + sangradoValor),
|
||||
origenEC.y,
|
||||
anchoSolapa,
|
||||
altoLibro);
|
||||
solapa2.stroke = 'black';
|
||||
solapa2.linewidth = 1;
|
||||
|
||||
// Cotas y textos
|
||||
if (this.size != "thumbnail") {
|
||||
// Cotas
|
||||
var cotaSolapa2 = previewEC.makeDobleArrow(
|
||||
origenEC.x - (anchoCalle / 2 + sangradoValor + anchoLibro + anchoSolapa),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x - (anchoLibro + sangradoValor + anchoCalle / 2),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaSolapa2.linewidth = 2;
|
||||
var cotaSolapa1 = previewEC.makeDobleArrow(
|
||||
origenEC.x + (anchoCalle / 2 + sangradoValor + anchoLibro + anchoSolapa),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x + (anchoLibro + sangradoValor + anchoCalle / 2),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaSolapa1.linewidth = 2;
|
||||
|
||||
// Textos Solapas
|
||||
let stylesSolapa = { size: 18, family: 'Public Sans' };
|
||||
previewEC.makeText("Solapa 1", origenEC.x + anchoLibro + (anchoCalle + anchoSolapa) / 2, origenEC.y, stylesSolapa);
|
||||
previewEC.makeText("Solapa 2", origenEC.x - anchoLibro - (anchoCalle + anchoSolapa) / 2, origenEC.y, stylesSolapa);
|
||||
// Textos Cotas Solapas
|
||||
previewEC.makeText((this.solapa).toFixed(1) + " mm", origenEC.x - anchoLibro - (anchoCalle + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText(this.solapa.toFixed(1) + " mm", origenEC.x + anchoLibro + (anchoCalle + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
var portada = previewEC.makeRectangle(
|
||||
origenEC.x + (anchoLibro / 2 + anchoCalle / 2 + sangradoValor),
|
||||
origenEC.y,
|
||||
anchoLibro,
|
||||
altoLibro);
|
||||
portada.stroke = 'black';
|
||||
portada.linewidth = 1;
|
||||
|
||||
var contraportada = previewEC.makeRectangle(
|
||||
origenEC.x - (anchoLibro / 2 + anchoCalle / 2 + sangradoValor),
|
||||
origenEC.y,
|
||||
anchoLibro,
|
||||
altoLibro);
|
||||
contraportada.stroke = 'black';
|
||||
contraportada.linewidth = 1;
|
||||
|
||||
var calle = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
anchoCalle,
|
||||
altoSangrado);
|
||||
calle.stroke = 'black';
|
||||
calle.dashes = [2, 5];
|
||||
calle.fill = '#F4F8F2';
|
||||
calle.linewidth = 1;
|
||||
|
||||
// Cotas y textos
|
||||
if (this.size != "thumbnail") {
|
||||
// Cotas:
|
||||
var cotaAnchoCubierta = previewEC.makeDobleArrow(
|
||||
origenEC.x - (anchoSangrado / 2),
|
||||
origenEC.y + (altoLibro / 2) + 35,
|
||||
origenEC.x + (anchoSangrado / 2),
|
||||
origenEC.y + (altoLibro / 2) + 35,
|
||||
10);
|
||||
cotaAnchoCubierta.linewidth = 2;
|
||||
var cotaAltoCubierta = previewEC.makeDobleArrow(
|
||||
origenEC.x + (anchoSangrado / 2) + 15,
|
||||
origenEC.y + (altoSangrado / 2),
|
||||
origenEC.x + (anchoSangrado / 2) + 15,
|
||||
origenEC.y - (altoSangrado / 2),
|
||||
10);
|
||||
cotaAltoCubierta.linewidth = 2;
|
||||
var cotaAltoLibro = previewEC.makeDobleArrow(
|
||||
origenEC.x + (anchoCalle / 2) + 35,
|
||||
origenEC.y + (altoLibro / 2),
|
||||
origenEC.x + (anchoCalle / 2) + 35,
|
||||
origenEC.y - (altoLibro / 2),
|
||||
10);
|
||||
cotaAltoLibro.linewidth = 2;
|
||||
var cotaContraportada = previewEC.makeDobleArrow(
|
||||
origenEC.x - (anchoCalle / 2 + anchoLibro + sangradoValor),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x - ((anchoCalle / 2) + sangradoValor),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaContraportada.linewidth = 2;
|
||||
var cotaPortada = previewEC.makeDobleArrow(
|
||||
origenEC.x + ((anchoCalle / 2) + sangradoValor),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x + (anchoCalle / 2 + anchoLibro + sangradoValor),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaPortada.linewidth = 2;
|
||||
|
||||
|
||||
// Textos:
|
||||
// Titulos generales
|
||||
let stylesEC = { size: 22, weight: 'bold', family: 'Public Sans' };
|
||||
previewEC.makeText("Portada",
|
||||
origenEC.x + anchoLibro / 2 + anchoCalle / 2 + sangradoValor + 15,
|
||||
origenEC.y,
|
||||
stylesEC
|
||||
);
|
||||
previewEC.makeText("Contraportada",
|
||||
origenEC.x - (anchoLibro / 2 + anchoCalle / 2 + sangradoValor),
|
||||
origenEC.y,
|
||||
stylesEC
|
||||
);
|
||||
// Sangrados
|
||||
let styleSangrado = { size: 10, family: 'Public Sans', style: 'italic', fill: 'red' };
|
||||
previewEC.makeText(sangradoTexto, origenEC.x + offsetCubierta, origenEC.y + (altoLibro / 2 + 13), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x + offsetCubierta, origenEC.y - (altoLibro / 2 + 13), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x - offsetCubierta, origenEC.y + (altoLibro / 2 + 13), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x - offsetCubierta, origenEC.y - (altoLibro / 2 + 13), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x + (anchoSangrado / 2) - 20, origenEC.y, styleSangrado).rotation = -Math.PI / 2;
|
||||
previewEC.makeText(sangradoTexto, origenEC.x - (anchoSangrado / 2) + 20, origenEC.y, styleSangrado).rotation = -Math.PI / 2;
|
||||
// Cotas
|
||||
previewEC.makeText(this.ancho.toFixed(1) + " mm", origenEC.x - (offsetCubierta - anchoSolapa / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText(this.ancho.toFixed(1) + " mm", origenEC.x + (offsetCubierta - anchoSolapa / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText(this.alto.toFixed(1) + " mm", origenEC.x + (anchoCalle / 2) + 50, origenEC.y, styleCotas).rotation = -Math.PI / 2;
|
||||
previewEC.makeText((this.alto + (2 * sangradoValor)).toFixed(1) + " mm",
|
||||
origenEC.x + (anchoSangrado / 2) + 30,
|
||||
origenEC.y,
|
||||
styleCotas
|
||||
).rotation = -Math.PI / 2;
|
||||
previewEC.makeText(((2 * this.ancho) + this.lomo + (2 * sangradoValor)).toFixed(1) + " mm",
|
||||
origenEC.x,
|
||||
origenEC.y + (altoLibro / 2) + 50,
|
||||
styleCotas);
|
||||
}
|
||||
|
||||
previewEC.update();
|
||||
|
||||
}
|
||||
|
||||
|
||||
#portadaGrapado() {
|
||||
|
||||
// Variables locales
|
||||
let altoLibro, anchoLibro, lomoLibro, anchoSolapa, anchoCubierta, altoSangrado, anchoSangrado;
|
||||
let styleCotas = { size: 12, family: 'Public Sans' };
|
||||
let sangradoTexto = "Sangrado 5 mm";
|
||||
let sangradoValor = parseFloat(5); // mm
|
||||
|
||||
// Definicion de los parametros del Esquema de Cubierta (EC)
|
||||
if (this.solapa == 0) {
|
||||
if (this.size == "thumbnail") {
|
||||
anchoSangrado = 350; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
|
||||
} else {
|
||||
anchoSangrado = 750; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
|
||||
}
|
||||
altoLibro = altoSangrado * 0.97;
|
||||
anchoLibro = anchoSangrado * 0.48;
|
||||
anchoSolapa = 0;
|
||||
lomoLibro = 0; // ESTA ES LA DIFERENCIA PARA GRAPADO
|
||||
anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + lomoLibro;
|
||||
|
||||
} else {
|
||||
if (this.size == "thumbnail") {
|
||||
anchoSangrado = 350; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
|
||||
} else {
|
||||
anchoSangrado = 750; // px
|
||||
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
|
||||
}
|
||||
altoLibro = altoSangrado * 0.95;
|
||||
anchoLibro = anchoSangrado * 0.3;
|
||||
anchoSolapa = anchoSangrado * 0.18;
|
||||
lomoLibro = 0; // ESTA ES LA DIFERENCIA PARA GRAPADO
|
||||
anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + lomoLibro;
|
||||
}
|
||||
|
||||
var previewEC = new Two({ fitted: true }).appendTo(this.container[0]);
|
||||
// Calculate the center of the canvas element
|
||||
var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2);
|
||||
|
||||
var sangrado = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
anchoSangrado,
|
||||
altoSangrado
|
||||
);
|
||||
sangrado.stroke = 'black';
|
||||
sangrado.dashes = [5, 5];
|
||||
sangrado.fill = '#FCEAF1';
|
||||
sangrado.linewidth = 1;
|
||||
|
||||
if (this.solapa != 0) {
|
||||
var solapas = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
anchoCubierta,
|
||||
altoLibro);
|
||||
solapas.stroke = 'black';
|
||||
solapas.linewidth = 1;
|
||||
|
||||
// Cotas y textos
|
||||
if (this.size != "thumbnail") {
|
||||
// Cotas
|
||||
var cotaSolapa2 = previewEC.makeDobleArrow(
|
||||
origenEC.x - anchoCubierta / 2,
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x - anchoLibro - lomoLibro / 2,
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaSolapa2.linewidth = 2;
|
||||
var cotaSolapa1 = previewEC.makeDobleArrow(
|
||||
origenEC.x + anchoCubierta / 2,
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x + anchoLibro + lomoLibro / 2,
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaSolapa1.linewidth = 2;
|
||||
|
||||
// Textos Solapas
|
||||
let stylesSolapa = { size: 18, family: 'Public Sans' };
|
||||
previewEC.makeText("Solapa 1", origenEC.x + anchoLibro + (lomoLibro + anchoSolapa) / 2, origenEC.y, stylesSolapa);
|
||||
previewEC.makeText("Solapa 2", origenEC.x - anchoLibro - (lomoLibro + anchoSolapa) / 2, origenEC.y, stylesSolapa);
|
||||
// Textos Cotas Solapas
|
||||
previewEC.makeText(this.solapa + " mm", origenEC.x - anchoLibro - (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText(this.solapa + " mm", origenEC.x + anchoLibro + (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
var libro = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
((2 * anchoLibro) + lomoLibro),
|
||||
altoLibro);
|
||||
libro.stroke = 'black';
|
||||
libro.linewidth = 1;
|
||||
|
||||
var lomo = previewEC.makeRectangle(
|
||||
origenEC.x,
|
||||
origenEC.y,
|
||||
lomoLibro,
|
||||
altoLibro);
|
||||
lomo.stroke = 'black';
|
||||
lomo.fill = '#F4F8F2';
|
||||
lomo.linewidth = 1;
|
||||
|
||||
// Cotas y textos
|
||||
if (this.size != "thumbnail") {
|
||||
// Cotas:
|
||||
var cotaAnchoCubierta = previewEC.makeDobleArrow(
|
||||
origenEC.x - (anchoSangrado / 2),
|
||||
origenEC.y + (altoLibro / 2) + 35,
|
||||
origenEC.x + (anchoSangrado / 2),
|
||||
origenEC.y + (altoLibro / 2) + 35,
|
||||
10);
|
||||
cotaAnchoCubierta.linewidth = 2;
|
||||
var cotaAltoCubierta = previewEC.makeDobleArrow(
|
||||
origenEC.x + (anchoCubierta / 2) + 35,
|
||||
origenEC.y + (altoSangrado / 2),
|
||||
origenEC.x + (anchoCubierta / 2) + 35,
|
||||
origenEC.y - (altoSangrado / 2),
|
||||
10);
|
||||
cotaAltoCubierta.linewidth = 2;
|
||||
var cotaAltoLibro = previewEC.makeDobleArrow(
|
||||
origenEC.x + (lomoLibro / 2) + 35,
|
||||
origenEC.y + (altoLibro / 2),
|
||||
origenEC.x + (lomoLibro / 2) + 35,
|
||||
origenEC.y - (altoLibro / 2),
|
||||
10);
|
||||
cotaAltoLibro.linewidth = 2;
|
||||
var cotaContraportada = previewEC.makeDobleArrow(
|
||||
origenEC.x - (lomoLibro / 2 + anchoLibro),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x - (lomoLibro / 2),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaContraportada.linewidth = 2;
|
||||
var cotaPortada = previewEC.makeDobleArrow(
|
||||
origenEC.x + (lomoLibro / 2),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
origenEC.x + (lomoLibro / 2 + anchoLibro),
|
||||
origenEC.y - (altoLibro / 3),
|
||||
10);
|
||||
cotaPortada.linewidth = 2;
|
||||
|
||||
// Textos:
|
||||
// Titulos generales
|
||||
let stylesEC = { size: 22, weight: 'bold', family: 'Public Sans' };
|
||||
previewEC.makeText("Portada", origenEC.x + (lomoLibro + anchoLibro) / 2, origenEC.y, stylesEC);
|
||||
previewEC.makeText("Contraportada", origenEC.x - (lomoLibro + anchoLibro) / 2, origenEC.y, stylesEC);
|
||||
// Sangrados
|
||||
let styleSangrado = { size: 10, family: 'Public Sans', style: 'italic', fill: 'red' };
|
||||
previewEC.makeText(sangradoTexto, origenEC.x, origenEC.y + (altoLibro / 2 + 20), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x, origenEC.y - (altoLibro / 2 + 20), styleSangrado);
|
||||
previewEC.makeText(sangradoTexto, origenEC.x + (lomoLibro / 2 + anchoLibro + anchoSolapa + 20), origenEC.y, styleSangrado).rotation = -Math.PI / 2;
|
||||
previewEC.makeText(sangradoTexto, origenEC.x - (lomoLibro / 2 + anchoLibro + anchoSolapa + 20), origenEC.y, styleSangrado).rotation = -Math.PI / 2;
|
||||
// Cotas
|
||||
previewEC.makeText((this.ancho + this.offsetSolapa).toFixed(1) + " mm", origenEC.x - (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText((this.ancho + this.offsetSolapa).toFixed(1) + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
|
||||
previewEC.makeText(this.alto.toFixed(1) + " mm", origenEC.x + (lomoLibro / 2) + 25, origenEC.y, styleCotas).rotation = -Math.PI / 2;
|
||||
previewEC.makeText(this.alto.toFixed(1) + (2 * sangradoValor) + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro + anchoSolapa) + 50, origenEC.y, styleCotas).rotation = -Math.PI / 2;
|
||||
previewEC.makeText(((2 * anchoLibro) + (2 * (this.solapa + this.offsetSolapa)) + this.lomo + (2 * sangradoValor)).toFixed(1) + " mm",
|
||||
origenEC.x,
|
||||
origenEC.y + (altoLibro / 2) + 50,
|
||||
styleCotas);
|
||||
}
|
||||
|
||||
previewEC.update();
|
||||
}
|
||||
}
|
||||
|
||||
export default previewFormas;
|
||||
Reference in New Issue
Block a user