Descubra en detalle cómo «Mi Apartamento Jodoigne» se distingue por sus servicios completos e innovadores, frente a las alternativas tradicionales para la gestión de su alquiler a corto plazo.
* Nota importante: La informaciĂłn sobre las «Otras ConserjerĂas Locales» y la «GestiĂłn por el Propietario» se basa en observaciones generales del mercado en Jodoigne y puede variar. «Mi Apartamento Jodoigne» se compromete a ofrecer un servicio transparente y de alta calidad, adaptado especĂficamente a sus necesidades.
// Este script genera una tabla comparativa interactiva para los servicios de conserjerĂa de apartamentos.
// Estå diseñado para integrarse directamente en una pågina HTML existente, sin dependencias pesadas.
// — ConfiguraciĂłn de datos —
// Los datos estĂĄn estructurados para facilitar la adiciĂłn de categorĂas y funcionalidades.
// Cada funcionalidad incluye su nombre, una descripciĂłn detallada, y un valor para cada servicio comparado.
// La propiedad ‘class’ permite aplicar un estilo especĂfico a travĂ©s de Tailwind CSS al valor mostrado.
const comparisonData = [
{
category: «Visibilidad & Optimización»,
features: [
{
name: «Optimización de anuncios»,
description: «Redacción de anuncios atractivos, fotos profesionales (HDR) y optimización SEO para maximizar la visibilidad en Airbnb y otras plataformas de alquiler a corto plazo.»,
«Mi Apartamento Jodoigne»: { value: «✅ Incluido & Profesional», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ Parcial o en opciĂłn», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «❌ A hacer por uno mismo», class: «text-red-600» }
},
{
name: «Tarificación dinåmica»,
description: «Uso de herramientas y algoritmos avanzados para ajustar los precios en tiempo real segĂșn la demanda, eventos locales, temporadas y competencia, maximizando asĂ sus ingresos.»,
«Mi Apartamento Jodoigne»: { value: «✅ EspecializaciĂłn dedicada», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ A menudo bĂĄsica», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «❌ DifĂcil de controlar», class: «text-red-600» }
},
{
name: «Sincronización de calendarios»,
description: «GestiĂłn unificada y automatizada de reservas en diferentes plataformas (Airbnb, Booking, Abritel…) para evitar doble reserva y optimizar la ocupaciĂłn.»,
«Mi Apartamento Jodoigne»: { value: «✅ Multi plataformas», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ A veces limitada», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «❌ GestiĂłn manual», class: «text-red-600» }
}
]
},
{
category: «Operaciones y mantenimiento»,
features: [
{
name: «Gestión de reservas»,
description: «Seguimiento de solicitudes, validación de estancias, ajustes en el calendario y gestión continua de cancelaciones y modificaciones, con reactividad.»,
«Mi Apartamento Jodoigne»: { value: «✅ Servicio completo», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «✅ Generalmente incluido», class: «text-green-600» },
«GestiĂłn por el Propietario»: { value: «❌ Que requiere mucho tiempo», class: «text-red-600» }
},
{
name: «Comunicación con los viajeros (24/7)»,
description: «Respuestas råpidas y personalizadas a las preguntas de los clientes antes, durante y después de su estancia, gestión proactiva de imprevistos y comentarios para una satisfacción måxima.»,
«Mi Apartamento Jodoigne»: { value: «✅ Asistencia 24/7», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ Horarios limitados», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «❌ Muy exigente», class: «text-red-600» }
},
{
name: «Check-in/out automatizado»,
description: «Implementación de soluciones inteligentes (caja de llaves segura, cerradura conectada, instrucciones detalladas) para acceso autónomo y fluido de los viajeros, sin restricciones horarias.»,
«Mi Apartamento Jodoigne»: { value: «✅ Proceso optimizado», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ A veces manual», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «❌ Organizar la entrega de llaves», class: «text-red-600» }
},
{
name: «Limpieza profesional»,
description: «Servicio de limpieza de alta calidad entre cada estancia, incluyendo desinfección, reabastecimiento de consumibles y control del estado del inmueble por equipos locales experimentados.»,
«Mi Apartamento Jodoigne»: { value: «✅ Socio local», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «✅ Generalmente incluido», class: «text-green-600» },
«GestiĂłn por el Propietario»: { value: «❌ Por organizar», class: «text-red-600» }
},
{
name: «Ropa de hotel»,
description: «Suministro, lavado y planchado de ropa de cama y baño de calidad hotelera para una experiencia premium de los viajeros, incluido en el servicio para mayor confort.»,
«Mi Apartamento Jodoigne»: { value: «✅ Incluido & Calidad», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ En opciĂłn / Costo adicional», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «❌ Costos y logĂstica», class: «text-red-600» }
},
{
name: «Mantenimiento y reparaciones menores»,
description: «Gestión proactiva de pequeñas reparaciones periódicas, asistencia råpida y coordinación de intervenciones técnicas urgentes si es necesario, con artesanos confiables locales.»,
«Mi Apartamento Jodoigne»: { value: «✅ Respuesta local», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ DĂas/Costos adicionales», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «❌ Responsabilidad directa», class: «text-red-600» }
}
]
},
{
category: «Gestión y transparencia»,
features: [
{
name: «Informes de rendimiento detallados»,
description: «Acceso a paneles de control claros e informes periódicos sobre ingresos, tasas de ocupación, comentarios de viajeros y otros indicadores clave. Para un seguimiento transparente.»,
«Mi Apartamento Jodoigne»: { value: «✅ Total transparencia», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ BĂĄsicos o a pedido», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «❌ Por compilar», class: «text-red-600» }
},
{
name: «Gestión de depósitos»,
description: «Proceso seguro para gestionar depĂłsitos de garantĂa de viajeros y resoluciĂłn de posibles retenciones por daños, en acuerdo con plataformas y legislaciĂłn vigente.»,
«Mi Apartamento Jodoigne»: { value: «✅ Encargado», class: «text-green-600» },
«Otra ConserjerĂa Local»: { value: «✅ Generalmente incluido», class: «text-green-600» },
«GestiĂłn por el Propietario»: { value: «❌ Complejo», class: «text-red-600» }
}
]
},
{
category: «Condiciones y costos»,
features: [
{
name: «Comisión sobre ingresos»,
description: «Porcentaje deducido de los ingresos generados por las reservas. Nuestra tasa es competitiva, transparente y sin costos ocultos para maximizar su rentabilidad.»,
«Mi Apartamento Jodoigne»: { value: «💰 Tasa competitiva», class: «text-blue-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «💰 VarĂa mucho (15-25%)», class: «text-blue-600» },
«GestiĂłn por el Propietario»: { value: «✅ Sin comisiĂłn», class: «text-green-600» }
},
{
name: «Flexibilidad del contrato»,
description: «DuraciĂłn mĂnima de compromiso y condiciones de cancelaciĂłn del servicio. Priorizamos la confianza sin compromisos a largo plazo, para total libertad.»,
«Mi Apartamento Jodoigne»: { value: «✅ Sin compromiso», class: «text-green-600 font-semibold» },
«Otra ConserjerĂa Local»: { value: «⚠️ Compromiso largo (6-12 meses)», class: «text-yellow-600» },
«GestiĂłn por el Propietario»: { value: «✅ Libertad total», class: «text-green-600» }
}
]
}
];
// DefiniciĂłn del orden de las columnas de servicios a comparar
const serviceColumns = [
«Mi Apartamento Jodoigne»,
«Otra ConserjerĂa Local»,
«Gestión por el Propietario»
];
// — LĂłgica de renderizado de la tabla —
/**
* FunciĂłn principal para generar y mostrar la tabla comparativa en el DOM.
*/
function renderComparisonTable() {
const tbody = document.getElementById(‘comparison-table-body’);
const theadRow = document.querySelector(‘.concierge-comparator-container thead tr’);
if (!tbody || !theadRow) {
console.error(‘Error: Elementos de la tabla (tbody o thead) no encontrados. Verifique que los IDs sean correctos.’);
return;
}
// Añadir encabezados de columnas de servicios dinåmicamente
serviceColumns.forEach((headerText, index) => {
const th = document.createElement(‘th’);
th.scope = «col»;
// Aplica clases Tailwind para estilo y posiciĂłn sticky
th.className = `px-4 py-3 sm:px-6 text-center sticky-header ${index === serviceColumns.length – 1 ? ‘rounded-tr-lg’ : »}`;
th.textContent = headerText;
theadRow.appendChild(th);
});
// Iterar sobre las categorĂas y funcionalidades para construir el cuerpo de la tabla
comparisonData.forEach(categoryGroup => {
// Crear fila de encabezado de categorĂa para agrupar funcionalidades
const categoryRow = document.createElement(‘tr’);
categoryRow.className = «bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 transition-colors duration-200 border-b border-gray-200 dark:border-gray-700»;
categoryRow.innerHTML = `
`;
tbody.appendChild(categoryRow);
// Iterar sobre las funcionalidades de cada categorĂa
categoryGroup.features.forEach(feature => {
const row = document.createElement(‘tr’);
// Estilo para las filas de datos, incluyendo un efecto hover para mejor interacciĂłn visual
row.className = «bg-white dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700 hover:bg-indigo-50 dark:hover:bg-gray-700 transition-colors duration-200 group»;
// Celda «Funcionalidad»
const featureCell = document.createElement(‘td’);
featureCell.scope = «row»;
featureCell.className = «px-4 py-3 sm:px-6 font-medium text-gray-900 whitespace-nowrap dark:text-white relative»;
featureCell.innerHTML = `
${feature.name}
`;
row.appendChild(featureCell);
// Celda «Descripción» (visible en pantallas grandes, oculta en pequeñas)
const descriptionCell = document.createElement(‘td’);
descriptionCell.className = «px-4 py-3 sm:px-6 text-gray-500 dark:text-gray-400 hidden md:table-cell»;
descriptionCell.textContent = feature.description;
row.appendChild(descriptionCell);
// Celdas para los valores de cada servicio, con estilos especĂficos
serviceColumns.forEach(colName => {
const data = feature[colName];
const td = document.createElement(‘td’);
td.className = `px-4 py-3 sm:px-6 text-center ${data.class}`; // Usa la clase definida en los datos para el color
td.textContent = data.value;
row.appendChild(td);
});
tbody.appendChild(row);
});
});
}
// — LĂłgica del Tooltip personalizado —
// Este script maneja la visualizaciĂłn de un tooltip al pasar el ratĂłn sobre los nombres de funcionalidades,
// mostrando su descripciĂłn detallada de forma interactiva.
let tooltipTimeout; // Para gestionar el retraso en la apariciĂłn y desapariciĂłn
const customTooltip = document.createElement(‘div’);
customTooltip.id = ‘custom-tooltip’;
// Clases Tailwind para el estilo del tooltip (fondo, texto, bordes, sombra, etc.)
customTooltip.className = ‘absolute z-50 px-3 py-2 text-sm font-medium text-white bg-gray-900 dark:bg-gray-700 rounded-lg shadow-xl opacity-0 invisible pointer-events-none transition-opacity duration-300 ease-in-out transform -translate-y-2’;
document.body.appendChild(customTooltip); // Añade el tooltip directamente al cuerpo del documento
// Retraso para mostrar el tooltip para evitar apariciones accidentales por pequeños movimientos del ratón
const TOOLTIP_DELAY_MS = 300; // en milisegundos
/**
* Gestiona el evento mouseover para mostrar el tooltip después de un retraso.
* Posiciona el tooltip en relaciĂłn con el elemento sobre el que se pasa el ratĂłn.
*/
document.addEventListener(‘mouseover’, function(e) {
const target = e.target.closest(‘[data-tooltip-text]’); // Coge el elemento con data-tooltip-text
if (target) {
clearTimeout(tooltipTimeout); // Cancela cualquier retraso previo para evitar conflictos
tooltipTimeout = setTimeout(() => {
const description = target.getAttribute(‘data-tooltip-text’);
customTooltip.innerHTML = description;
// Hace visible el tooltip para calcular su tamaño
customTooltip.classList.remove(‘invisible’, ‘opacity-0’);
customTooltip.classList.add(‘visible’, ‘opacity-100’);
customTooltip.style.left = ‘0px’; // Restablece para un cĂĄlculo preciso
customTooltip.style.top = ‘0px’;
// Posicionamiento del tooltip
const rect = target.getBoundingClientRect(); // Dimensiones y posiciĂłn del elemento
const containerRect = document.querySelector(‘.concierge-comparator-container’).getBoundingClientRect(); // Dimensiones del contenedor principal para limitar el tooltip
// CĂĄlculo de la posiciĂłn horizontal
let left = rect.left + window.scrollX + (rect.width / 2) – (customTooltip.offsetWidth / 2);
// Asegura que el tooltip quede dentro de los lĂmites del contenedor (o de la ventana si no hay)
if (left containerRect.right + window.scrollX) {
left = containerRect.right + window.scrollX – customTooltip.offsetWidth – 5; // Margen de 5px a la derecha
}
// CĂĄlculo de la posiciĂłn vertical (por defecto arriba del elemento)
let top = rect.top + window.scrollY – customTooltip.offsetHeight – 10; // 10px arriba
// Si no hay suficiente espacio arriba, coloca el tooltip debajo del elemento
if (top < window.scrollY + 10) { // Si estĂĄ demasiado cerca de la parte superior
top = rect.bottom + window.scrollY + 10; // 10px debajo
}
customTooltip.style.left = `${left}px`;
customTooltip.style.top = `${top}px`;
// Aplica las clases para la animaciĂłn de apariciĂłn
customTooltip.classList.remove('-translate-y-2');
customTooltip.classList.add('translate-y-0');
}, TOOLTIP_DELAY_MS);
}
});
/**
* Gestiona el evento mouseout para ocultar el tooltip.
*/
document.addEventListener('mouseout', function(e) {
const target = e.target.closest('[data-tooltip-text]');
if (target) {
clearTimeout(tooltipTimeout); // Cancela el retraso en la apariciĂłn si se estaba mostrando
// Aplica las clases para la animaciĂłn de desapariciĂłn y el ocultamiento
customTooltip.classList.remove('visible', 'opacity-100', 'translate-y-0');
customTooltip.classList.add('invisible', 'opacity-0', '-translate-y-2');
}
});
// Inicialización de la tabla después de que el DOM esté completamente cargado
document.addEventListener('DOMContentLoaded', renderComparisonTable);
// — Nota sobre las APIs externas —
// Para este tipo de tabla comparativa donde los datos son relativamente estĂĄticos y especĂficos de un servicio (aquĂ, "Mi Apartamento Jodoigne"),
// no es necesario ni se ha implementado el uso de una API externa. Los datos estĂĄn incluidos directamente en JavaScript.
// Este enfoque asegura un rendimiento Ăłptimo, independencia total y evita dependencias a servicios de terceros de pago o que requieran clave API.
// Si se necesitara integrar datos dinĂĄmicos (por ejemplo, cotizaciones inmobiliarias en tiempo real en Jodoigne, pronĂłstico del tiempo para los viajeros)
// mediante APIs pĂșblicas y gratuitas, se podrĂan considerar. Por ejemplo:
// – OpenWeatherMap (API meteorolĂłgica gratuita con registro): https://openweathermap.org/api
// Respuesta JSON ejemplo (tras registrarse y obtener clave gratuita):
// «`json
// {
// "coord": { "lon": 4.6833, "lat": 50.7167 },
// "weather": [{ "id": 801, "main": "Clouds", "description": "pocas nubes", "icon": "02d" }],
// "main": { "temp": 285.8, "feels_like": 285.04, "temp_min": 284.26, "temp_max": 286.9, "pressure": 1018, "humidity": 80 },
// "visibility": 10000, "wind": { "speed": 4.12, "deg": 250 }, "clouds": { "all": 20 },
// "dt": 1678886400, "sys": { "type": 2, "id": 2011984, "country": "BE", "sunrise": 1678862939, "sunset": 1678904576 },
// "timezone": 3600, "id": 2795325, "name": "Jodoigne", "cod": 200
// }
// «`
// – API de tasas de cambio (podrĂa ser Ăștil para gastos o pagos internacionales, pero atenciĂłn a los lĂmites de versiones gratuitas):
// Ejemplo: https://api.exchangerate-api.com/v4/latest/EUR
// «`json
// {
// "base": "EUR",
// "date": "2026-03-15",
// "time_last_updated": 1678913349,
// "rates": { "USD": 1.0592, "GBP": 0.8804, "JPY": 140.73, … }
// }
// «`
// La integraciĂłn de dichas APIs requerirĂa solicitudes `fetch` en JavaScript y gestiĂłn de estados de carga/error,
// lo cual añadirĂa complejidad al objetivo de "bloque de cĂłdigo listo para copiar y pegar" y "sin dependencias pesadas".
Este enfoque integral de asistencia al cliente es lo que hace de Concierge Angels un socio imprescindible para toda gestiĂłn de alquiler en Jodoigne. La atenciĂłn meticulosa a los detalles y la disponibilidad constante son ventajas clave que contribuyen al Ă©xito y la durabilidad de su inversiĂłn en alquiler de temporada.
