refactor: Remove ValidationQuestionnaire and DimensionConnections from Law10Tab
- Removed ValidationQuestionnaire section (manual input form) - Removed DimensionConnections section (links to other tabs) - Removed unused imports (FileText, TrendingUp) - Removed onTabChange prop from Law10Tab component - Updated DashboardTabs.tsx to not pass onTabChange to Law10Tab Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
sujucu70
@@ -36,7 +36,7 @@ export function DashboardTabs({
|
|||||||
case 'roadmap':
|
case 'roadmap':
|
||||||
return <RoadmapTab data={data} />;
|
return <RoadmapTab data={data} />;
|
||||||
case 'law10':
|
case 'law10':
|
||||||
return <Law10Tab data={data} onTabChange={setActiveTab} />;
|
return <Law10Tab data={data} />;
|
||||||
default:
|
default:
|
||||||
return <ExecutiveSummaryTab data={data} />;
|
return <ExecutiveSummaryTab data={data} />;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -8,8 +8,6 @@ import {
|
|||||||
CheckCircle,
|
CheckCircle,
|
||||||
XCircle,
|
XCircle,
|
||||||
HelpCircle,
|
HelpCircle,
|
||||||
TrendingUp,
|
|
||||||
FileText,
|
|
||||||
Lightbulb,
|
Lightbulb,
|
||||||
} from 'lucide-react';
|
} from 'lucide-react';
|
||||||
import type { AnalysisData, HeatmapDataPoint, DrilldownDataPoint } from '../../types';
|
import type { AnalysisData, HeatmapDataPoint, DrilldownDataPoint } from '../../types';
|
||||||
@@ -1491,273 +1489,11 @@ function DataMaturitySummary({ data }: { data: AnalysisData }) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Seccion: Cuestionario de Validacion
|
|
||||||
function ValidationQuestionnaire() {
|
|
||||||
return (
|
|
||||||
<Card>
|
|
||||||
<div className="flex items-center gap-3 mb-4">
|
|
||||||
<div className="p-2 bg-slate-100 rounded-lg">
|
|
||||||
<FileText className="w-5 h-5 text-slate-600" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h3 className="font-semibold text-gray-900 text-lg">Cuestionario de Validacion</h3>
|
|
||||||
<p className="text-sm text-gray-500">Completar manualmente para diagnostico completo</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="p-3 bg-amber-50 border border-amber-200 rounded-lg mb-4">
|
|
||||||
<p className="text-sm text-gray-700">
|
|
||||||
Los siguientes datos <strong>NO pueden extraerse</strong> de tu CDR actual.
|
|
||||||
Por favor completa para el diagnostico completo:
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="space-y-6">
|
|
||||||
{/* Pregunta 1 - Horario */}
|
|
||||||
<div className="p-4 bg-gray-50 rounded-lg">
|
|
||||||
<p className="font-medium text-gray-800 mb-3">1. Horario operativo actual:</p>
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
|
||||||
<div>
|
|
||||||
<label className="text-xs text-gray-500 block mb-1">Lunes-Viernes:</label>
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
defaultValue="08:00"
|
|
||||||
className="w-20 px-2 py-1 text-sm border border-gray-300 rounded"
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
<span className="text-gray-500">a</span>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
defaultValue="22:00"
|
|
||||||
className="w-20 px-2 py-1 text-sm border border-gray-300 rounded"
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label className="text-xs text-gray-500 block mb-1">Sabados:</label>
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
defaultValue="10:00"
|
|
||||||
className="w-20 px-2 py-1 text-sm border border-gray-300 rounded"
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
<span className="text-gray-500">a</span>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
defaultValue="20:00"
|
|
||||||
className="w-20 px-2 py-1 text-sm border border-gray-300 rounded"
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label className="text-xs text-gray-500 block mb-1">Domingos:</label>
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
defaultValue="10:00"
|
|
||||||
className="w-20 px-2 py-1 text-sm border border-gray-300 rounded"
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
<span className="text-gray-500">a</span>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
defaultValue="20:00"
|
|
||||||
className="w-20 px-2 py-1 text-sm border border-gray-300 rounded"
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Pregunta 2 - Lenguas */}
|
|
||||||
<div className="p-4 bg-gray-50 rounded-lg">
|
|
||||||
<p className="font-medium text-gray-800 mb-3">2. ¿Ofreceis atencion en lenguas cooficiales?</p>
|
|
||||||
<div className="flex flex-wrap gap-4">
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="checkbox" className="rounded" disabled />
|
|
||||||
<span>Catalan</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="checkbox" className="rounded" disabled />
|
|
||||||
<span>Euskera</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="checkbox" className="rounded" disabled />
|
|
||||||
<span>Gallego</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="checkbox" className="rounded" disabled />
|
|
||||||
<span>Aranes</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="checkbox" className="rounded" disabled />
|
|
||||||
<span>Ninguna (solo castellano)</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Pregunta 3 - IVR */}
|
|
||||||
<div className="p-4 bg-gray-50 rounded-lg">
|
|
||||||
<p className="font-medium text-gray-800 mb-3">3. ¿El IVR ofrece siempre opcion de agente humano?</p>
|
|
||||||
<div className="space-y-2">
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="radio" name="ivr" disabled />
|
|
||||||
<span>Si, desde menu principal</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="radio" name="ivr" disabled />
|
|
||||||
<span>Si, pero tras varios niveles</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="radio" name="ivr" disabled />
|
|
||||||
<span>No en todos los flujos</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Pregunta 4 - Reclamaciones */}
|
|
||||||
<div className="p-4 bg-gray-50 rounded-lg">
|
|
||||||
<p className="font-medium text-gray-800 mb-3">4. ¿Gestionais reclamaciones en sistema separado del CDR?</p>
|
|
||||||
<div className="space-y-2">
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="radio" name="reclamaciones" disabled />
|
|
||||||
<span>Si (indicar sistema: <input type="text" className="ml-2 px-2 py-1 text-sm border border-gray-300 rounded w-40" placeholder="Nombre sistema" disabled />)</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="radio" name="reclamaciones" disabled />
|
|
||||||
<span>No, solo registradas en CDR</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Pregunta 5 - ENAC */}
|
|
||||||
<div className="p-4 bg-gray-50 rounded-lg">
|
|
||||||
<p className="font-medium text-gray-800 mb-3">5. ¿Teneis contratado auditor ENAC?</p>
|
|
||||||
<div className="space-y-2">
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="radio" name="enac" disabled />
|
|
||||||
<span>Si (nombre: <input type="text" className="ml-2 px-2 py-1 text-sm border border-gray-300 rounded w-40" placeholder="Nombre auditor" disabled />)</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="radio" name="enac" disabled />
|
|
||||||
<span>En proceso de contratacion</span>
|
|
||||||
</label>
|
|
||||||
<label className="flex items-center gap-2 text-sm">
|
|
||||||
<input type="radio" name="enac" disabled />
|
|
||||||
<span>No</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Nota */}
|
|
||||||
<div className="mt-4 p-3 bg-blue-50 border border-blue-200 rounded-lg">
|
|
||||||
<p className="text-xs text-blue-800">
|
|
||||||
<strong>Nota:</strong> Este cuestionario es informativo. Para habilitar la edicion y guardado,
|
|
||||||
contacta con tu administrador de Beyond CX Analytics.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</Card>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Seccion: Conexiones con otras dimensiones
|
|
||||||
interface DimensionConnectionsProps {
|
|
||||||
onTabChange?: (tab: string) => void;
|
|
||||||
}
|
|
||||||
|
|
||||||
function DimensionConnections({ onTabChange }: DimensionConnectionsProps) {
|
|
||||||
const connections = [
|
|
||||||
{
|
|
||||||
dimension: 'Dimension 2 (Eficiencia)',
|
|
||||||
impact: 'AHT elevado impacta ASA',
|
|
||||||
description: 'Reducir AHT mejora capacidad y reduce colas',
|
|
||||||
tab: 'dimensions',
|
|
||||||
color: 'purple',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
dimension: 'Dimension 3 (Efectividad)',
|
|
||||||
impact: 'FCR bajo sugiere >15 dias',
|
|
||||||
description: 'Mejorar FCR reduce tiempo total de resolucion',
|
|
||||||
tab: 'dimensions',
|
|
||||||
color: 'emerald',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
dimension: 'Agentic Readiness',
|
|
||||||
impact: 'Automatizacion cubre gaps 24/7',
|
|
||||||
description: 'Chatbots e IA pueden cubrir cobertura nocturna',
|
|
||||||
tab: 'readiness',
|
|
||||||
color: 'blue',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Card>
|
|
||||||
<div className="flex items-center gap-3 mb-4">
|
|
||||||
<div className="p-2 bg-blue-100 rounded-lg">
|
|
||||||
<TrendingUp className="w-5 h-5 text-blue-600" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h3 className="font-semibold text-gray-900 text-lg">Conexiones con Otras Dimensiones</h3>
|
|
||||||
<p className="text-sm text-gray-500">Este analisis se integra con tu diagnostico operacional</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="space-y-3">
|
|
||||||
{connections.map((conn, idx) => (
|
|
||||||
<div
|
|
||||||
key={idx}
|
|
||||||
className={cn(
|
|
||||||
'p-4 rounded-lg border transition-colors cursor-pointer hover:border-blue-300',
|
|
||||||
conn.color === 'purple' && 'bg-purple-50/50 border-purple-200',
|
|
||||||
conn.color === 'emerald' && 'bg-emerald-50/50 border-emerald-200',
|
|
||||||
conn.color === 'blue' && 'bg-blue-50/50 border-blue-200',
|
|
||||||
)}
|
|
||||||
onClick={() => onTabChange?.(conn.tab)}
|
|
||||||
>
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<div>
|
|
||||||
<p className="font-medium text-gray-800">{conn.dimension}</p>
|
|
||||||
<p className={cn(
|
|
||||||
'text-sm font-semibold',
|
|
||||||
conn.color === 'purple' && 'text-purple-700',
|
|
||||||
conn.color === 'emerald' && 'text-emerald-700',
|
|
||||||
conn.color === 'blue' && 'text-blue-700',
|
|
||||||
)}>{conn.impact}</p>
|
|
||||||
<p className="text-xs text-gray-500 mt-1">{conn.description}</p>
|
|
||||||
</div>
|
|
||||||
<button
|
|
||||||
className={cn(
|
|
||||||
'px-3 py-1.5 text-xs font-medium rounded transition-colors',
|
|
||||||
conn.color === 'purple' && 'bg-purple-100 text-purple-700 hover:bg-purple-200',
|
|
||||||
conn.color === 'emerald' && 'bg-emerald-100 text-emerald-700 hover:bg-emerald-200',
|
|
||||||
conn.color === 'blue' && 'bg-blue-100 text-blue-700 hover:bg-blue-200',
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
IR A ANALISIS →
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</Card>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
// ============================================
|
// ============================================
|
||||||
// COMPONENTE PRINCIPAL
|
// COMPONENTE PRINCIPAL
|
||||||
// ============================================
|
// ============================================
|
||||||
|
|
||||||
interface Law10TabPropsExtended extends Law10TabProps {
|
export function Law10Tab({ data }: Law10TabProps) {
|
||||||
onTabChange?: (tab: string) => void;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function Law10Tab({ data, onTabChange }: Law10TabPropsExtended) {
|
|
||||||
// Evaluar compliance para cada requisito
|
// Evaluar compliance para cada requisito
|
||||||
const complianceResults = {
|
const complianceResults = {
|
||||||
law07: evaluateLaw07Compliance(data),
|
law07: evaluateLaw07Compliance(data),
|
||||||
@@ -1788,12 +1524,6 @@ export function Law10Tab({ data, onTabChange }: Law10TabPropsExtended) {
|
|||||||
|
|
||||||
{/* Madurez de Datos para Compliance */}
|
{/* Madurez de Datos para Compliance */}
|
||||||
<DataMaturitySummary data={data} />
|
<DataMaturitySummary data={data} />
|
||||||
|
|
||||||
{/* Cuestionario de Validacion */}
|
|
||||||
<ValidationQuestionnaire />
|
|
||||||
|
|
||||||
{/* Conexiones con Otras Dimensiones */}
|
|
||||||
<DimensionConnections onTabChange={onTabChange} />
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user