Laravel 11, Vuexy Admin 10.3, by admin@koneko.mx
This commit is contained in:
@ -0,0 +1,10 @@
|
||||
import LivewireNotification from '../_class/LivewireNotification';
|
||||
import WebsiteLegalSettingsForm from '../_class/WebsiteLegalSettingsForm';
|
||||
|
||||
new LivewireNotification();
|
||||
|
||||
window.WebsiteLegalSettingsForm = new WebsiteLegalSettingsForm();
|
||||
|
||||
Livewire.hook('morphed', () => {
|
||||
window.WebsiteLegalSettingsForm.reload();
|
||||
});
|
||||
@ -0,0 +1,590 @@
|
||||
import LivewireNotification from '../_class/LivewireNotification';
|
||||
import FormCustomListener from '../_class/FormCustomListener';
|
||||
|
||||
new LivewireNotification();
|
||||
|
||||
// Inicializar formularios de ajustes de sitio web
|
||||
window.WebsiteSettingsForm = new FormCustomListener({
|
||||
formSelector: '#website-settings-card',
|
||||
buttonSelectors: ['.btn-save', '.btn-cancel'],
|
||||
callbacks: [
|
||||
() => {} // Deshabilitar callback para #save_website_button
|
||||
],
|
||||
dispatchOnSubmit: 'saveWebsiteSettings',
|
||||
validationConfig: {
|
||||
fields: {
|
||||
website_title: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
min: 2,
|
||||
max: 50,
|
||||
message: 'El título debe tener entre 2 y 50 caracteres.'
|
||||
}
|
||||
}
|
||||
},
|
||||
website_description: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
max: 160,
|
||||
message: 'La descripción no puede exceder los 160 caracteres.'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
eleValidClass: '',
|
||||
rowSelector: '.fv-row'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de favicon
|
||||
new FormCustomListener({
|
||||
formSelector: '#website-favicon-settings-card',
|
||||
buttonSelectors: ['.btn']
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de logo de imagen
|
||||
new FormCustomListener({
|
||||
formSelector: '#website-image-logo-settings-card',
|
||||
buttonSelectors: ['.btn']
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de social media
|
||||
window.SocialSettingsForm = new FormCustomListener({
|
||||
formSelector: '#website-social-settings-card',
|
||||
buttonSelectors: ['.btn-save', '.btn-cancel'],
|
||||
callbacks: [() => {}],
|
||||
dispatchOnSubmit: 'saveSocialSettings',
|
||||
validationConfig: {
|
||||
fields: {
|
||||
social_whatsapp: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: 'Por favor, introduce un número de teléfono válido para México.',
|
||||
callback: function (input) {
|
||||
// Si el campo está vacío, no hacemos validación
|
||||
if (input.value.trim() === '') {
|
||||
return true; // Permitir vacío
|
||||
}
|
||||
|
||||
// Si no está vacío, validamos el formato del número
|
||||
const cleanValue = input.value.replace(/\D/g, '');
|
||||
const regex = /^[1-9]\d{9}$/; // Exactamente 10 dígitos
|
||||
|
||||
return regex.test(cleanValue); // Valida solo si hay un número
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
social_whatsapp_message: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
max: 500,
|
||||
message: 'El mensaje no puede exceder los 500 caracteres.'
|
||||
},
|
||||
callback: {
|
||||
message: 'El mensaje es obligatorio.',
|
||||
callback: function (input) {
|
||||
// Obtener el valor de 'social_whatsapp'
|
||||
const whatsappNumber = document.querySelector('#social_whatsapp').value.trim();
|
||||
|
||||
// Si 'social_whatsapp' tiene un valor, entonces el mensaje es obligatorio
|
||||
if (whatsappNumber !== '') {
|
||||
return input.value.trim() !== ''; // El mensaje no puede estar vacío
|
||||
}
|
||||
|
||||
return true; // Si 'social_whatsapp' está vacío, no validamos 'social_whatsapp_message'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
social_facebook: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
},
|
||||
social_instagram: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
},
|
||||
social_linkedin: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
},
|
||||
social_tiktok: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
},
|
||||
social_x_twitter: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
},
|
||||
social_google: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
},
|
||||
social_pinterest: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
},
|
||||
social_youtube: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
},
|
||||
social_vimeo: {
|
||||
validators: {
|
||||
uri: {
|
||||
message: 'Por favor, introduce una URL válida.'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
eleValidClass: '',
|
||||
rowSelector: '.fv-row'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de Formularios de contacto
|
||||
window.ContactFormSettingsForm = new FormCustomListener({
|
||||
formSelector: '#website-contact-form-settings-card',
|
||||
buttonSelectors: ['.btn-save', '.btn-cancel'],
|
||||
callbacks: [() => {}],
|
||||
dispatchOnSubmit: 'saveContactFormSettings',
|
||||
validationConfig: {
|
||||
fields: {
|
||||
// Validación para correo electrónico de recepción
|
||||
contact_form_email: {
|
||||
validators: {
|
||||
emailAddress: {
|
||||
message: 'Por favor, introduce un correo electrónico válido.'
|
||||
},
|
||||
notEmpty: {
|
||||
message: 'El correo electrónico es obligatorio.'
|
||||
}
|
||||
}
|
||||
},
|
||||
// Validación para correo electrónico con copia
|
||||
contact_form_email_cc: {
|
||||
validators: {
|
||||
emailAddress: {
|
||||
message: 'Por favor, introduce un correo electrónico válido.'
|
||||
},
|
||||
// Validación personalizada para comparar ambos correos electrónicos
|
||||
callback: {
|
||||
message: 'Los correos electrónicos deben ser diferentes.',
|
||||
callback: function (input) {
|
||||
const email = document.querySelector('#contact_form_email').value.trim();
|
||||
const emailCC = input.value.trim();
|
||||
|
||||
// Si ambos correos son iguales, la validación falla
|
||||
if (email === emailCC) {
|
||||
return false; // Los correos son iguales, por lo que la validación falla
|
||||
}
|
||||
|
||||
return true; // Si son diferentes, la validación pasa
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// Validación para el asunto del formulario de contacto
|
||||
contact_form_subject: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
max: 60,
|
||||
message: 'El título del correo no puede exceder los 60 caracteres.'
|
||||
},
|
||||
notEmpty: {
|
||||
message: 'El título del correo es obligatorio.'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
eleValidClass: '',
|
||||
rowSelector: '.fv-row'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de información de contacto
|
||||
window.ContactInfoSettingsForm = new FormCustomListener({
|
||||
formSelector: '#website-contact-info-settings-card',
|
||||
buttonSelectors: ['.btn-save', '.btn-cancel'],
|
||||
callbacks: [() => {}],
|
||||
dispatchOnSubmit: 'saveContactInfoSettings',
|
||||
validationConfig: {
|
||||
fields: {
|
||||
// Validación para número telefónico
|
||||
contact_phone_number: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: 'Por favor, introduce un número de teléfono válido para México.',
|
||||
callback: function (input) {
|
||||
// Si el campo está vacío, no hacemos validación
|
||||
if (input.value.trim() === '') {
|
||||
return true; // Permitir vacío
|
||||
}
|
||||
|
||||
// Si no está vacío, validamos el formato del número
|
||||
const cleanValue = input.value.replace(/\D/g, '');
|
||||
const regex = /^[1-9]\d{9}$/; // Exactamente 10 dígitos
|
||||
|
||||
return regex.test(cleanValue); // Valida solo si hay un número
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// Validación para extensión telefónica (opcional, pero solo si contact_phone_number tiene valor)
|
||||
contact_phone_number_ext: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
max: 10,
|
||||
message: 'La extensión no debe exceder los 10 caracteres.'
|
||||
},
|
||||
callback: {
|
||||
message: 'La extensión requiere de ingresar un número telefónico.',
|
||||
callback: function (input) {
|
||||
// Obtener el valor de 'contact_phone_number'
|
||||
const phoneNumber = document.querySelector('#contact_phone_number')?.value.trim();
|
||||
|
||||
// Si el número telefónico tiene valor, entonces la extensión es obligatoria
|
||||
if (phoneNumber !== '') {
|
||||
// Si la extensión está vacía, la validación falla
|
||||
return true; // Permitir vacío
|
||||
}
|
||||
|
||||
// Si no se ha ingresado un número telefónico, la extensión no debe tener valor
|
||||
return input.value.trim() === '';
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// Validación para correo electrónico de contacto (opcional)
|
||||
contact_email: {
|
||||
validators: {
|
||||
emailAddress: {
|
||||
message: 'Por favor, introduce un correo electrónico válido.'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
eleValidClass: '',
|
||||
rowSelector: '.fv-row'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de ubicación
|
||||
window.LocationSettingsForm = new FormCustomListener({
|
||||
formSelector: '#website-location-settings-card',
|
||||
buttonSelectors: ['.btn-save', '.btn-cancel'],
|
||||
callbacks: [() => {}],
|
||||
dispatchOnSubmit: 'saveLocationSettings',
|
||||
validationConfig: {
|
||||
fields: {
|
||||
// Validación para dirección (No obligatorio, máximo 160 caracteres)
|
||||
contact_direccion: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
max: 160,
|
||||
message: 'La dirección no puede exceder los 160 caracteres.'
|
||||
}
|
||||
}
|
||||
},
|
||||
// Validación para horario (No obligatorio, máximo 160 caracteres)
|
||||
contact_horario: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
max: 160,
|
||||
message: 'El horario no puede exceder los 160 caracteres.'
|
||||
}
|
||||
}
|
||||
},
|
||||
// Validación para latitud (No obligatorio, pero debe ser un número si se ingresa)
|
||||
contact_location_lat: {
|
||||
validators: {
|
||||
numeric: {
|
||||
message: 'La latitud debe ser un número.'
|
||||
},
|
||||
callback: {
|
||||
message: 'La latitud es obligatoria si se ingresa longitud.',
|
||||
callback: function (input) {
|
||||
// Obtener el valor de longitud
|
||||
const longitude = document.querySelector('#contact_location_lng')?.value.trim();
|
||||
|
||||
// Si longitud tiene un valor, entonces latitud es obligatorio
|
||||
if (longitude !== '') {
|
||||
return input.value.trim() !== ''; // La latitud no puede estar vacía
|
||||
}
|
||||
|
||||
return true; // Si longitud está vacío, no se valida latitud
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// Validación para longitud (No obligatorio, pero debe ser un número si se ingresa)
|
||||
contact_location_lng: {
|
||||
validators: {
|
||||
numeric: {
|
||||
message: 'La longitud debe ser un número.'
|
||||
},
|
||||
callback: {
|
||||
message: 'La longitud es obligatoria si se ingresa latitud.',
|
||||
callback: function (input) {
|
||||
// Obtener el valor de latitud
|
||||
const latitude = document.querySelector('#contact_location_lat')?.value.trim();
|
||||
|
||||
// Si latitud tiene un valor, entonces longitud es obligatorio
|
||||
if (latitude !== '') {
|
||||
return input.value.trim() !== ''; // La longitud no puede estar vacía
|
||||
}
|
||||
|
||||
return true; // Si latitud está vacío, no se valida longitud
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
eleValidClass: '',
|
||||
rowSelector: '.fv-row'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de chat
|
||||
window.ChatSettingsForm = new FormCustomListener({
|
||||
formSelector: '#website-chat-settings-card',
|
||||
buttonSelectors: ['.btn-save', '.btn-cancel'],
|
||||
callbacks: [() => {}],
|
||||
dispatchOnSubmit: 'saveChatSettings',
|
||||
validationConfig: {
|
||||
fields: {
|
||||
chat_whatsapp_number: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: 'Por favor, introduce un número de teléfono válido para México.',
|
||||
callback: function (input) {
|
||||
// Obtener el proveedor directamente dentro de la validación
|
||||
const provider = document.querySelector('#chat_provider')?.value;
|
||||
|
||||
// Validar solo si el proveedor es WhatsApp
|
||||
if (provider !== 'whatsapp') return true;
|
||||
|
||||
const cleanValue = input.value.replace(/\D/g, '');
|
||||
const regex = /^[1-9]\d{9}$/; // Exactamente 10 dígitos
|
||||
|
||||
return regex.test(cleanValue);
|
||||
}
|
||||
},
|
||||
notEmpty: {
|
||||
message: 'El número de teléfono es obligatorio.',
|
||||
enabled: () => {
|
||||
// Obtener el proveedor directamente dentro de la validación
|
||||
const provider = document.querySelector('#chat_provider')?.value;
|
||||
|
||||
return provider === 'whatsapp'; // Habilita solo si es WhatsApp
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
chat_whatsapp_message: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
max: 500,
|
||||
message: 'El mensaje no puede exceder los 500 caracteres.'
|
||||
},
|
||||
notEmpty: {
|
||||
message: 'El mensaje es obligatorio.',
|
||||
enabled: () => {
|
||||
// Obtener el proveedor directamente dentro de la validación
|
||||
const provider = document.querySelector('#chat_provider')?.value;
|
||||
|
||||
return provider === 'whatsapp'; // Habilita solo si es WhatsApp
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
eleValidClass: '',
|
||||
rowSelector: '.fv-row'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de análisis de datos
|
||||
window.AnalyticsSettingsForm = new FormCustomListener({
|
||||
formSelector: '#website-analytics-settings-card',
|
||||
buttonSelectors: ['.btn-save', '.btn-cancel'],
|
||||
callbacks: [() => {}],
|
||||
dispatchOnSubmit: 'saveAnalyticsSettings',
|
||||
validationConfig: {
|
||||
fields: {
|
||||
google_analytics_id: {
|
||||
validators: {
|
||||
callback: {
|
||||
message: 'ID de medición de Google Analytics no tienen un formato válido.',
|
||||
callback: function (input) {
|
||||
if (document.getElementById('google_analytics_enabled').checked) {
|
||||
return input.value.trim() !== '';
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
eleValidClass: '',
|
||||
rowSelector: '.fv-row'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Inicializar formularios de ajustes de plantilla de sitio web
|
||||
window.TemplateSettingsForm = new FormCustomListener({
|
||||
formSelector: '#website-template-settings-card',
|
||||
buttonSelectors: ['.btn-save', '.btn-cancel'],
|
||||
callbacks: [() => {}],
|
||||
dispatchOnSubmit: 'saveTemplateSettings',
|
||||
validationConfig: {
|
||||
fields: {
|
||||
website_tpl_footer_text: {
|
||||
validators: {
|
||||
stringLength: {
|
||||
max: 50,
|
||||
message: 'El mensaje no puede exceder los 50 caracteres.'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: {
|
||||
trigger: new FormValidation.plugins.Trigger(),
|
||||
bootstrap5: new FormValidation.plugins.Bootstrap5({
|
||||
eleValidClass: '',
|
||||
rowSelector: '.fv-row'
|
||||
}),
|
||||
submitButton: new FormValidation.plugins.SubmitButton(),
|
||||
autoFocus: new FormValidation.plugins.AutoFocus()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Recargar validación de formularios al morphear componentes
|
||||
Livewire.hook('morphed', ({ component }) => {
|
||||
switch (component.name) {
|
||||
case 'website-settings':
|
||||
if (window.WebsiteSettingsForm) {
|
||||
window.WebsiteSettingsForm.reloadValidation();
|
||||
}
|
||||
break;
|
||||
|
||||
case 'website-social-settings':
|
||||
if (window.SocialSettingsForm) {
|
||||
window.SocialSettingsForm.reloadValidation();
|
||||
}
|
||||
break;
|
||||
|
||||
case 'website-contact-info-settings':
|
||||
if (window.ContactInfoSettingsForm) {
|
||||
window.ContactInfoSettingsForm.reloadValidation();
|
||||
}
|
||||
break;
|
||||
|
||||
case 'website-contact-form-settings':
|
||||
if (window.ContactFormSettingsForm) {
|
||||
window.ContactFormSettingsForm.reloadValidation();
|
||||
}
|
||||
break;
|
||||
|
||||
case 'website-location-settings':
|
||||
if (window.LocationSettingsForm) {
|
||||
window.LocationSettingsForm.reloadValidation();
|
||||
}
|
||||
break;
|
||||
|
||||
case 'website-chat-settings':
|
||||
if (window.ChatSettingsForm) {
|
||||
window.ChatSettingsForm.reloadValidation();
|
||||
}
|
||||
break;
|
||||
|
||||
case 'website-analytics-settings':
|
||||
if (window.AnalyticsSettingsForm) {
|
||||
window.AnalyticsSettingsForm.reloadValidation();
|
||||
}
|
||||
break;
|
||||
|
||||
case 'website-template-settings':
|
||||
if (window.TemplateSettingsForm) {
|
||||
window.TemplateSettingsForm.reloadValidation();
|
||||
}
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user