293 lines
12 KiB
JavaScript
293 lines
12 KiB
JavaScript
import React from 'react';
|
|
import { Database, Brain, Heart, Zap, Shield, Users, ArrowRight, CheckCircle } from 'lucide-react';
|
|
import { Button } from './ui/button';
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from './ui/card';
|
|
import { Badge } from './ui/badge';
|
|
import interoperabilidadeImg from '../assets/interoperabilidade_saude_1.jpg';
|
|
import digitalTwinImg from '../assets/digital_twin_saude_1.png';
|
|
import jornadadaPacienteImg from '../assets/jornada_paciente_1.png';
|
|
|
|
const Platform = () => {
|
|
const products = [
|
|
{
|
|
title: 'WEB3 ENGINE',
|
|
subtitle: 'Infraestrutura de Integração',
|
|
description: 'O coração técnico da IAsis que resolve a fragmentação dos sistemas legados, transformando dados desconexos em uma infraestrutura viva, interoperável e inteligente.',
|
|
image: interoperabilidadeImg,
|
|
icon: Database,
|
|
color: 'bg-blue-500',
|
|
features: [
|
|
'Conectores REST/SOAP/HL7/FHIR',
|
|
'Golder Record do paciente',
|
|
'Leitura automatizada de dados',
|
|
'Orquestração de processos (RPA + AI)',
|
|
'Ontologia própria',
|
|
'Data lake federado por território',
|
|
],
|
|
users: ['Times de TI', 'Engenharia', 'Gestão de Sistemas', 'Auditores'],
|
|
technologies: ['Apache Camel', 'Spark', 'Databricks', 'NiFi', 'S3'],
|
|
},
|
|
{
|
|
title: 'SMART DIGITAL TWIN',
|
|
subtitle: 'Inteligência Estratégica',
|
|
description: 'Transforma o território em um gêmeo digital da saúde, permitindo decisões em tempo real baseadas em dados organizados e cruzados.',
|
|
image: digitalTwinImg,
|
|
icon: Brain,
|
|
color: 'bg-purple-500',
|
|
features: [
|
|
'Painéis táticos e estratégicos',
|
|
'Insights preditivos e prescritivos',
|
|
'Cruza dados clínicos e epidemiológicos',
|
|
'Ações orientadas por dados',
|
|
'IA explicável e personalizável',
|
|
'APIs públicas para integração',
|
|
],
|
|
users: ['Secretários de saúde', 'Diretoria de Operações', 'Núcleos de Informação'],
|
|
technologies: ['Power BI', 'Metabase', 'Spark/Databricks', 'APIs REST'],
|
|
},
|
|
{
|
|
title: 'MED JOURNEY',
|
|
subtitle: 'Continuidade do Cuidado',
|
|
description: 'Promove continuidade de cuidado, integrando dados clínicos e notificando pacientes e equipes de saúde sobre ações necessárias.',
|
|
image: jornadadaPacienteImg,
|
|
icon: Heart,
|
|
color: 'bg-green-500',
|
|
features: [
|
|
'Navegador de jornada clínica',
|
|
'Monitoramento de linhas prioritárias',
|
|
'Notificações inteligentes',
|
|
'Conexão com teleatendimento',
|
|
'Motor de jornada personalizável',
|
|
'Apps mobile e web',
|
|
],
|
|
users: ['Equipes de saúde da família', 'Cuidadores', 'Regulação', 'Atenção primária'],
|
|
technologies: ['React Native', 'APIs abertas', 'Push notifications', 'WebRTC'],
|
|
},
|
|
];
|
|
|
|
const architecture = [
|
|
{
|
|
layer: 'Camada de Integração',
|
|
description: 'Conectores universais para qualquer sistema de saúde',
|
|
technologies: ['HL7 FHIR', 'REST/SOAP APIs', 'CSV/XML', 'Bancos de dados'],
|
|
},
|
|
{
|
|
layer: 'Camada de Processamento',
|
|
description: 'Pipeline de dados em tempo real com normalização semântica',
|
|
technologies: ['Apache Spark', 'Databricks', 'Apache NiFi', 'Data Lake'],
|
|
},
|
|
{
|
|
layer: 'Camada de Inteligência',
|
|
description: 'IA aplicada para classificação, predição e automação',
|
|
technologies: ['Machine Learning', 'NLP', 'Computer Vision', 'RPA'],
|
|
},
|
|
{
|
|
layer: 'Camada de Produtos',
|
|
description: 'Dashboards, APIs e aplicações para usuários finais',
|
|
technologies: ['React', 'Power BI', 'APIs REST', 'Mobile Apps'],
|
|
},
|
|
];
|
|
|
|
const benefits = [
|
|
{
|
|
icon: Zap,
|
|
title: 'Implementação Rápida',
|
|
description: 'Valor entregue em 30-60 dias com metodologia ágil',
|
|
},
|
|
{
|
|
icon: Shield,
|
|
title: 'Segurança Total',
|
|
description: 'Conformidade com LGPD e padrões internacionais',
|
|
},
|
|
{
|
|
icon: Users,
|
|
title: 'Squads Especializados',
|
|
description: 'Time multidisciplinar dedicado ao seu sucesso',
|
|
},
|
|
{
|
|
icon: Database,
|
|
title: 'Interoperabilidade Real',
|
|
description: 'Conecta qualquer sistema sem troca de infraestrutura',
|
|
},
|
|
];
|
|
|
|
return (
|
|
<div className="min-h-screen">
|
|
{/* Hero Section */}
|
|
<section className="section-padding bg-gradient-to-br from-blue-50 to-indigo-100">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="text-center mb-16">
|
|
<h1 className="text-4xl md:text-5xl font-bold text-gray-900 mb-6">
|
|
Plataforma <span className="gradient-text">IAsis</span>
|
|
</h1>
|
|
<p className="text-xl text-gray-600 max-w-4xl mx-auto leading-relaxed">
|
|
Uma arquitetura modular e escalável que transforma dados de saúde fragmentados
|
|
em inteligência acionável, conectando sistemas, pessoas e processos em uma
|
|
rede integrada de cuidado.
|
|
</p>
|
|
</div>
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
|
{benefits.map((benefit, index) => (
|
|
<Card key={index} className="text-center border-0 shadow-lg card-hover">
|
|
<CardHeader>
|
|
<div className="w-12 h-12 bg-primary/10 rounded-lg flex items-center justify-center mx-auto mb-4">
|
|
<benefit.icon className="h-6 w-6 text-primary" />
|
|
</div>
|
|
<CardTitle className="text-lg">{benefit.title}</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<CardDescription>{benefit.description}</CardDescription>
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Products Section */}
|
|
<section className="section-padding bg-white">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-gray-900 mb-4">
|
|
Nossos Produtos Digitais
|
|
</h2>
|
|
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
|
|
Três produtos principais que se integram para formar uma plataforma
|
|
completa de interoperabilidade em saúde.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="space-y-24">
|
|
{products.map((product, index) => (
|
|
<div key={index} className={`grid grid-cols-1 lg:grid-cols-2 gap-12 items-center ${index % 2 === 1 ? 'lg:grid-flow-col-dense' : ''}`}>
|
|
<div className={index % 2 === 1 ? 'lg:col-start-2' : ''}>
|
|
<div className="flex items-center mb-6">
|
|
<div className={`w-12 h-12 ${product.color} rounded-lg flex items-center justify-center mr-4`}>
|
|
<product.icon className="h-6 w-6 text-white" />
|
|
</div>
|
|
<div>
|
|
<h3 className="text-2xl font-bold gradient-text">{product.title}</h3>
|
|
<p className="text-gray-600">{product.subtitle}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<p className="text-lg text-gray-600 mb-8 leading-relaxed">
|
|
{product.description}
|
|
</p>
|
|
|
|
<div className="mb-8">
|
|
<h4 className="text-lg font-semibold text-gray-900 mb-4">Principais Funcionalidades:</h4>
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
|
{product.features.map((feature, featureIndex) => (
|
|
<div key={featureIndex} className="flex items-center">
|
|
<CheckCircle className="h-4 w-4 text-green-500 mr-2 flex-shrink-0" />
|
|
<span className="text-gray-600 text-sm">{feature}</span>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
<div className="mb-8">
|
|
<h4 className="text-lg font-semibold text-gray-900 mb-4">Usuários Principais:</h4>
|
|
<div className="flex flex-wrap gap-2">
|
|
{product.users.map((user, userIndex) => (
|
|
<Badge key={userIndex} variant="secondary">{user}</Badge>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<h4 className="text-lg font-semibold text-gray-900 mb-4">Tecnologias:</h4>
|
|
<div className="flex flex-wrap gap-2">
|
|
{product.technologies.map((tech, techIndex) => (
|
|
<Badge key={techIndex} variant="outline">{tech}</Badge>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className={index % 2 === 1 ? 'lg:col-start-1' : ''}>
|
|
<div className="relative">
|
|
<img
|
|
src={product.image}
|
|
alt={product.title}
|
|
className="rounded-2xl shadow-xl w-full"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Architecture Section */}
|
|
<section className="section-padding bg-gray-50">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-gray-900 mb-4">
|
|
Arquitetura da Plataforma
|
|
</h2>
|
|
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
|
|
Uma arquitetura em camadas que garante escalabilidade, segurança e
|
|
interoperabilidade em todos os níveis.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="space-y-6">
|
|
{architecture.map((layer, index) => (
|
|
<Card key={index} className="border-0 shadow-lg">
|
|
<CardHeader>
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<CardTitle className="text-xl">{layer.layer}</CardTitle>
|
|
<CardDescription className="text-base mt-2">{layer.description}</CardDescription>
|
|
</div>
|
|
<div className="text-3xl font-bold text-primary/20">
|
|
{String(index + 1).padStart(2, '0')}
|
|
</div>
|
|
</div>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div className="flex flex-wrap gap-2">
|
|
{layer.technologies.map((tech, techIndex) => (
|
|
<Badge key={techIndex} variant="secondary">{tech}</Badge>
|
|
))}
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* CTA Section */}
|
|
<section className="section-padding gradient-bg">
|
|
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
|
<h2 className="text-3xl md:text-4xl font-bold text-white mb-6">
|
|
Pronto para conhecer nossa plataforma na prática?
|
|
</h2>
|
|
<p className="text-xl text-white/90 mb-8">
|
|
Agende uma demonstração personalizada e veja como a IAsis pode
|
|
transformar a gestão de dados em sua organização de saúde.
|
|
</p>
|
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<Button size="lg" asChild className="bg-white text-primary hover:bg-white/90">
|
|
<a href="/contato">
|
|
Agendar Demonstração
|
|
<ArrowRight className="ml-2 h-5 w-5" />
|
|
</a>
|
|
</Button>
|
|
<Button size="lg" variant="outline" asChild className="border-white text-white hover:bg-white hover:text-primary">
|
|
<a href="/modulos">Explorar Módulos</a>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Platform;
|
|
|