Spaces:
Running
Running
| <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Automação Jurídica - RPA Protocolos</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| primary: { | |
| 50: '#f0f9ff', | |
| 100: '#e0f2fe', | |
| 200: '#bae6fd', | |
| 300: '#7dd3fc', | |
| 400: '#38bdf8', | |
| 500: '#0ea5e9', | |
| 600: '#0284c7', | |
| 700: '#0369a1', | |
| 800: '#075985', | |
| 900: '#0c4a6e', | |
| }, | |
| juri: { | |
| blue: '#1a365d', | |
| light: '#f8fafc', | |
| green: '#065f46', | |
| red: '#b91c1c' | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| .sidebar-item.active { | |
| background-color: rgba(255, 255, 255, 0.1); | |
| border-left: 4px solid #38bdf8; | |
| } | |
| .sidebar-item:hover:not(.active) { | |
| background-color: rgba(255, 255, 255, 0.05); | |
| } | |
| .status-indicator { | |
| width: 10px; | |
| height: 10px; | |
| border-radius: 50%; | |
| display: inline-block; | |
| margin-right: 6px; | |
| } | |
| .status-online { | |
| background-color: #10b981; | |
| box-shadow: 0 0 6px #10b981; | |
| } | |
| .status-offline { | |
| background-color: #ef4444; | |
| box-shadow: 0 0 6px #ef4444; | |
| } | |
| .file-upload { | |
| border: 2px dashed #cbd5e1; | |
| transition: all 0.3s ease; | |
| } | |
| .file-upload:hover { | |
| border-color: #7dd3fc; | |
| background-color: #f0f9ff; | |
| } | |
| .log-entry:hover { | |
| background-color: #f8fafc; | |
| } | |
| .nav-tabs .active { | |
| border-bottom: 2px solid #0284c7; | |
| color: #0284c7; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50 font-sans text-gray-800"> | |
| <div class="flex h-screen overflow-hidden"> | |
| <!-- Sidebar --> | |
| <div class="hidden md:flex md:flex-shrink-0"> | |
| <div class="flex flex-col w-64 bg-juri-blue text-white"> | |
| <div class="flex items-center justify-center h-16 px-4 border-b border-blue-800"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-robot text-2xl text-blue-300 mr-3"></i> | |
| <span class="text-xl font-semibold">JurisRPA</span> | |
| </div> | |
| </div> | |
| <div class="flex flex-col flex-grow px-4 py-4 overflow-y-auto"> | |
| <div class="space-y-1"> | |
| <a href="#" class="sidebar-item active flex items-center px-2 py-3 text-sm font-medium rounded-md text-white group"> | |
| <i class="fas fa-tachometer-alt mr-3 text-blue-300"></i> | |
| Dashboard | |
| </a> | |
| <a href="#" class="sidebar-item flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:text-white group"> | |
| <i class="fas fa-calendar-plus mr-3"></i> | |
| Agendar Protocolo | |
| </a> | |
| <a href="#" class="sidebar-item flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:text-white group"> | |
| <i class="fas fa-cog mr-3"></i> | |
| Configurações | |
| </a> | |
| <a href="#" class="sidebar-item flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:text-white group"> | |
| <i class="fas fa-history mr-3"></i> | |
| Histórico | |
| </a> | |
| <a href="#" class="sidebar-item flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:text-white group"> | |
| <i class="fas fa-chart-bar mr-3"></i> | |
| Relatórios | |
| </a> | |
| <a href="#" class="sidebar-item flex items-center px-2 py-3 text-sm font-medium rounded-md text-gray-300 hover:text-white group"> | |
| <i class="fas fa-plug mr-3"></i> | |
| Integrações | |
| </a> | |
| </div> | |
| <div class="mt-auto pt-10"> | |
| <div class="p-4 bg-blue-900 bg-opacity-30 rounded-lg"> | |
| <div class="flex items-center"> | |
| <div class="status-indicator status-online"></div> | |
| <span class="text-sm font-medium">Sistema Online</span> | |
| </div> | |
| <div class="mt-2 text-xs text-gray-300"> | |
| <p>Versão 2.1.4</p> | |
| <p>Última atualização: 15/06/2023</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Main content --> | |
| <div class="flex flex-col flex-1 overflow-hidden"> | |
| <!-- Top navigation --> | |
| <div class="flex items-center justify-between h-16 px-6 bg-white border-b border-gray-200"> | |
| <div class="flex items-center md:hidden"> | |
| <button class="text-gray-500 focus:outline-none"> | |
| <i class="fas fa-bars"></i> | |
| </button> | |
| </div> | |
| <div class="flex items-center"> | |
| <h1 class="text-lg font-semibold text-juri-blue">Dashboard</h1> | |
| </div> | |
| <div class="flex items-center"> | |
| <div class="relative"> | |
| <button class="flex items-center focus:outline-none"> | |
| <img class="w-8 h-8 rounded-full" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="User photo"> | |
| <span class="ml-2 text-sm font-medium hidden md:block">Dr. Silva</span> | |
| <i class="fas fa-chevron-down ml-1 text-xs hidden md:block"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Page content --> | |
| <div class="flex-1 overflow-auto p-6"> | |
| <!-- Dashboard Page --> | |
| <div id="dashboard-page"> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-6"> | |
| <!-- Status Card --> | |
| <div class="bg-white rounded-lg shadow p-6"> | |
| <div class="flex items-center justify-between"> | |
| <h3 class="text-lg font-medium text-gray-700">Status do Sistema</h3> | |
| <span class="px-2 py-1 text-xs font-semibold rounded-full bg-green-100 text-green-800"> | |
| Online | |
| </span> | |
| </div> | |
| <div class="mt-4"> | |
| <div class="flex items-center justify-between text-sm text-gray-500 mb-2"> | |
| <span>Última execução</span> | |
| <span>15/06/2023 14:32</span> | |
| </div> | |
| <div class="flex items-center justify-between text-sm text-gray-500 mb-2"> | |
| <span>Protocolos hoje</span> | |
| <span class="font-medium">12</span> | |
| </div> | |
| <div class="flex items-center justify-between text-sm text-gray-500"> | |
| <span>Tempo médio</span> | |
| <span class="font-medium">2m 15s</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Queue Cards --> | |
| <div class="bg-white rounded-lg shadow p-6"> | |
| <h3 class="text-lg font-medium text-gray-700 mb-4">Filas de Protocolo</h3> | |
| <div class="space-y-3"> | |
| <div> | |
| <div class="flex items-center justify-between text-sm mb-1"> | |
| <span class="text-gray-600">Agendados</span> | |
| <span class="font-medium">5</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2"> | |
| <div class="bg-blue-500 h-2 rounded-full" style="width: 25%"></div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="flex items-center justify-between text-sm mb-1"> | |
| <span class="text-gray-600">Em execução</span> | |
| <span class="font-medium">2</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2"> | |
| <div class="bg-yellow-500 h-2 rounded-full" style="width: 10%"></div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="flex items-center justify-between text-sm mb-1"> | |
| <span class="text-gray-600">Concluídos</span> | |
| <span class="font-medium">12</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2"> | |
| <div class="bg-green-500 h-2 rounded-full" style="width: 60%"></div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="flex items-center justify-between text-sm mb-1"> | |
| <span class="text-gray-600">Falhos</span> | |
| <span class="font-medium">1</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2"> | |
| <div class="bg-red-500 h-2 rounded-full" style="width: 5%"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Quick Actions --> | |
| <div class="bg-white rounded-lg shadow p-6"> | |
| <h3 class="text-lg font-medium text-gray-700 mb-4">Ações Rápidas</h3> | |
| <div class="space-y-3"> | |
| <button class="w-full flex items-center justify-between px-4 py-3 bg-blue-50 text-blue-700 rounded-lg hover:bg-blue-100 transition"> | |
| <span>Agendar novo protocolo</span> | |
| <i class="fas fa-plus"></i> | |
| </button> | |
| <button class="w-full flex items-center justify-between px-4 py-3 bg-gray-50 text-gray-700 rounded-lg hover:bg-gray-100 transition"> | |
| <span>Ver histórico completo</span> | |
| <i class="fas fa-history"></i> | |
| </button> | |
| <button class="w-full flex items-center justify-between px-4 py-3 bg-gray-50 text-gray-700 rounded-lg hover:bg-gray-100 transition"> | |
| <span>Configurar rotinas</span> | |
| <i class="fas fa-clock"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <!-- System Health --> | |
| <div class="bg-white rounded-lg shadow p-6"> | |
| <h3 class="text-lg font-medium text-gray-700 mb-4">Saúde do Sistema</h3> | |
| <div class="space-y-4"> | |
| <div> | |
| <div class="flex items-center justify-between text-sm mb-1"> | |
| <span class="text-gray-600">Uso de CPU</span> | |
| <span class="font-medium">32%</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2"> | |
| <div class="bg-blue-500 h-2 rounded-full" style="width: 32%"></div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="flex items-center justify-between text-sm mb-1"> | |
| <span class="text-gray-600">Uso de memória</span> | |
| <span class="font-medium">45%</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2"> | |
| <div class="bg-blue-500 h-2 rounded-full" style="width: 45%"></div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="flex items-center justify-between text-sm mb-1"> | |
| <span class="text-gray-600">Armazenamento</span> | |
| <span class="font-medium">28%</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2"> | |
| <div class="bg-blue-500 h-2 rounded-full" style="width: 28%"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Recent Activity --> | |
| <div class="bg-white rounded-lg shadow overflow-hidden mb-6"> | |
| <div class="px-6 py-4 border-b border-gray-200"> | |
| <h3 class="text-lg font-medium text-gray-700">Atividade Recente</h3> | |
| </div> | |
| <div class="divide-y divide-gray-200"> | |
| <!-- Log Entry --> | |
| <div class="log-entry px-6 py-4 hover:bg-gray-50 transition cursor-pointer"> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0 bg-green-100 rounded-full p-2 text-green-600"> | |
| <i class="fas fa-check-circle"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Protocolo concluído com sucesso</p> | |
| <p class="text-sm text-gray-500">Processo 0001234-56.2023.8.19.0001 no TJRJ via PJe</p> | |
| </div> | |
| <div class="ml-auto text-sm text-gray-500"> | |
| 14:32 | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Log Entry --> | |
| <div class="log-entry px-6 py-4 hover:bg-gray-50 transition cursor-pointer"> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0 bg-yellow-100 rounded-full p-2 text-yellow-600"> | |
| <i class="fas fa-spinner fa-pulse"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Protocolo em execução</p> | |
| <p class="text-sm text-gray-500">Processo 0005678-90.2023.4.01.0000 no TRF1 via e-SAJ</p> | |
| </div> | |
| <div class="ml-auto text-sm text-gray-500"> | |
| 14:15 | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Log Entry --> | |
| <div class="log-entry px-6 py-4 hover:bg-gray-50 transition cursor-pointer"> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0 bg-red-100 rounded-full p-2 text-red-600"> | |
| <i class="fas fa-exclamation-circle"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Falha no protocolo</p> | |
| <p class="text-sm text-gray-500">Processo 0009012-34.2023.5.02.0001 no TRT2 via PROJUDI - Sistema indisponível</p> | |
| </div> | |
| <div class="ml-auto text-sm text-gray-500"> | |
| 13:48 | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Log Entry --> | |
| <div class="log-entry px-6 py-4 hover:bg-gray-50 transition cursor-pointer"> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0 bg-green-100 rounded-full p-2 text-green-600"> | |
| <i class="fas fa-check-circle"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <p class="text-sm font-medium text-gray-900">Protocolo concluído com sucesso</p> | |
| <p class="text-sm text-gray-500">Processo 0003456-78.2023.8.26.0001 no TJSP via Eproc</p> | |
| </div> | |
| <div class="ml-auto text-sm text-gray-500"> | |
| 12:22 | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="px-6 py-3 bg-gray-50 text-center"> | |
| <button class="text-sm font-medium text-blue-600 hover:text-blue-800"> | |
| Ver todos os logs | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Statistics --> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="bg-white rounded-lg shadow p-6"> | |
| <h3 class="text-lg font-medium text-gray-700 mb-4">Protocolos por Tribunal</h3> | |
| <div class="h-64"> | |
| <!-- Placeholder for chart --> | |
| <div class="flex items-center justify-center h-full bg-gray-50 rounded"> | |
| <p class="text-gray-500">Gráfico de protocolos por tribunal</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-white rounded-lg shadow p-6"> | |
| <h3 class="text-lg font-medium text-gray-700 mb-4">Protocolos por Tipo</h3> | |
| <div class="h-64"> | |
| <!-- Placeholder for chart --> | |
| <div class="flex items-center justify-center h-full bg-gray-50 rounded"> | |
| <p class="text-gray-500">Gráfico de protocolos por tipo</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Schedule New Protocol Page (hidden by default) --> | |
| <div id="schedule-page" class="hidden"> | |
| <div class="bg-white rounded-lg shadow overflow-hidden mb-6"> | |
| <div class="px-6 py-4 border-b border-gray-200"> | |
| <h3 class="text-lg font-medium text-gray-700">Agendar Novo Protocolo</h3> | |
| </div> | |
| <div class="p-6"> | |
| <form> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <!-- Tribunal --> | |
| <div> | |
| <label for="tribunal" class="block text-sm font-medium text-gray-700 mb-1">Tribunal</label> | |
| <select id="tribunal" name="tribunal" class="mt-1 block w-full pl-3 pr-10 py-2 text-base border border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"> | |
| <option value="">Selecione o tribunal</option> | |
| <option value="TJ">Tribunal de Justiça (TJ)</option> | |
| <option value="TRF">Tribunal Regional Federal (TRF)</option> | |
| <option value="TRT">Tribunal Regional do Trabalho (TRT)</option> | |
| <option value="TRE">Tribunal Regional Eleitoral (TRE)</option> | |
| <option value="STM">Superior Tribunal Militar (STM)</option> | |
| <option value="STJ">Superior Tribunal de Justiça (STJ)</option> | |
| <option value="STF">Supremo Tribunal Federal (STF)</option> | |
| </select> | |
| </div> | |
| <!-- Sistema --> | |
| <div> | |
| <label for="sistema" class="block text-sm font-medium text-gray-700 mb-1">Sistema Judicial</label> | |
| <select id="sistema" name="sistema" class="mt-1 block w-full pl-3 pr-10 py-2 text-base border border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"> | |
| <option value="">Selecione o sistema</option> | |
| <option value="PJe">PJe</option> | |
| <option value="e-SAJ">e-SAJ</option> | |
| <option value="PROJUDI">PROJUDI</option> | |
| <option value="Eproc">Eproc</option> | |
| <option value="SAJ">SAJ</option> | |
| <option value="Outro">Outro</option> | |
| </select> | |
| </div> | |
| <!-- Processo --> | |
| <div class="md:col-span-2"> | |
| <label for="processo" class="block text-sm font-medium text-gray-700 mb-1">Número do Processo (CNJ)</label> | |
| <input type="text" id="processo" name="processo" placeholder="0000000-00.0000.0.00.0000" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"> | |
| </div> | |
| <!-- Tipo de Documento --> | |
| <div class="md:col-span-2"> | |
| <label for="documento" class="block text-sm font-medium text-gray-700 mb-1">Tipo de Documento</label> | |
| <select id="documento" name="documento" class="mt-1 block w-full pl-3 pr-10 py-2 text-base border border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"> | |
| <option value="">Selecione o tipo de documento</option> | |
| <option value="peticao">Petição Inicial</option> | |
| <option value="contestacao">Contestação</option> | |
| <option value="recurso">Recurso</option> | |
| <option value="impugnacao">Impugnação</option> | |
| <option value="manifestacao">Manifestação</option> | |
| <option value="informacao">Informação</option> | |
| <option value="outros">Outros</option> | |
| </select> | |
| </div> | |
| <!-- Upload --> | |
| <div class="md:col-span-2"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Documento PDF/A</label> | |
| <div class="mt-1 file-upload flex justify-center px-6 pt-5 pb-6 border-2 rounded-md"> | |
| <div class="space-y-1 text-center"> | |
| <div class="flex text-sm text-gray-600 justify-center"> | |
| <label for="file-upload" class="relative cursor-pointer bg-white rounded-md font-medium text-blue-600 hover:text-blue-500 focus-within:outline-none"> | |
| <span>Selecione um arquivo</span> | |
| <input id="file-upload" name="file-upload" type="file" class="sr-only" accept=".pdf,.pdfa"> | |
| </label> | |
| </div> | |
| <p class="text-xs text-gray-500">PDF ou PDF/A até 10MB</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Dados Complementares --> | |
| <div class="md:col-span-2"> | |
| <label for="complementares" class="block text-sm font-medium text-gray-700 mb-1">Dados Complementares</label> | |
| <textarea id="complementares" name="complementares" rows="3" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm" placeholder="Parte, advogado, assunto, observações..."></textarea> | |
| </div> | |
| <!-- Agendamento --> | |
| <div class="md:col-span-2"> | |
| <fieldset class="space-y-4"> | |
| <legend class="text-sm font-medium text-gray-700">Agendamento</legend> | |
| <div class="flex items-center"> | |
| <input id="imediato" name="agendamento" type="radio" checked class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300"> | |
| <label for="imediato" class="ml-3 block text-sm font-medium text-gray-700"> | |
| Imediato | |
| </label> | |
| </div> | |
| <div class="flex items-center"> | |
| <input id="programado" name="agendamento" type="radio" class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300"> | |
| <label for="programado" class="ml-3 block text-sm font-medium text-gray-700"> | |
| Programado | |
| </label> | |
| </div> | |
| <div id="programado-fields" class="hidden ml-7 space-y-4"> | |
| <div class="flex items-center space-x-4"> | |
| <div> | |
| <label for="data" class="block text-sm font-medium text-gray-700 mb-1">Data</label> | |
| <input type="date" id="data" name="data" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"> | |
| </div> | |
| <div> | |
| <label for="hora" class="block text-sm font-medium text-gray-700 mb-1">Hora</label> | |
| <input type="time" id="hora" name="hora" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"> | |
| </div> | |
| </div> | |
| <div class="flex items-center"> | |
| <input id="repetir" name="repetir" type="checkbox" class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"> | |
| <label for="repetir" class="ml-3 block text-sm font-medium text-gray-700"> | |
| Repetir semanalmente | |
| </label> | |
| </div> | |
| </div> | |
| </fieldset> | |
| </div> | |
| </div> | |
| <div class="mt-8 flex justify-end space-x-3"> | |
| <button type="button" class="px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"> | |
| Cancelar | |
| </button> | |
| <button type="submit" class="px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"> | |
| Agendar Protocolo | |
| </button> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| <!-- Templates Section --> | |
| <div class="bg-white rounded-lg shadow overflow-hidden mb-6"> | |
| <div class="px-6 py-4 border-b border-gray-200 flex justify-between items-center"> | |
| <h3 class="text-lg font-medium text-gray-700">Meus Templates</h3> | |
| <button class="text-sm font-medium text-blue-600 hover:text-blue-800"> | |
| <i class="fas fa-plus mr-1"></i> Novo Template | |
| </button> | |
| </div> | |
| <div class="p-6"> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> | |
| <!-- Template Card --> | |
| <div class="border border-gray-200 rounded-lg p-4 hover:border-blue-300 transition cursor-pointer"> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-blue-100 rounded-md p-2 text-blue-600"> | |
| <i class="fas fa-file-alt"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="text-sm font-medium text-gray-900">Petição Inicial - Ação Civil</h4> | |
| <p class="text-xs text-gray-500">TJSP via Eproc</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Template Card --> | |
| <div class="border border-gray-200 rounded-lg p-4 hover:border-blue-300 transition cursor-pointer"> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-green-100 rounded-md p-2 text-green-600"> | |
| <i class="fas fa-file-contract"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="text-sm font-medium text-gray-900">Contestação - Trabalhista</h4> | |
| <p class="text-xs text-gray-500">TRT2 via PJe</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Template Card --> | |
| <div class="border border-gray-200 rounded-lg p-4 hover:border-blue-300 transition cursor-pointer"> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-purple-100 rounded-md p-2 text-purple-600"> | |
| <i class="fas fa-file-import"></i> | |
| </div> | |
| <div class="ml-3"> | |
| <h4 class="text-sm font-medium text-gray-900">Recurso Ordinário</h4> | |
| <p class="text-xs text-gray-500">TJRJ via e-SAJ</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Settings Page (hidden by default) --> | |
| <div id="settings-page" class="hidden"> | |
| <div class="bg-white rounded-lg shadow overflow-hidden mb-6"> | |
| <div class="px-6 py-4 border-b border-gray-200"> | |
| <h3 class="text-lg font-medium text-gray-700">Configurações do Robô</h3> | |
| </div> | |
| <div class="p-6"> | |
| <div class="mb-8"> | |
| <h4 class="text-md font-medium text-gray-700 mb-4">Credenciais dos Sistemas</h4> | |
| <div class="space-y-6"> | |
| <!-- Credential Item --> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-blue-100 rounded-md p-2 text-blue-600"> | |
| <i class="fas fa-lock"></i> | |
| </div> | |
| <div class="ml-3 flex-1"> | |
| <div class="flex items-center justify-between"> | |
| <label class="block text-sm font-medium text-gray-700">PJe - TJSP</label> | |
| <span class="text-xs text-green-600 bg-green-50 px-2 py-1 rounded">Configurado</span> | |
| </div> | |
| <p class="text-xs text-gray-500 mt-1">Usuário: *********</p> | |
| <button class="mt-2 text-xs font-medium text-blue-600 hover:text-blue-800"> | |
| Alterar credenciais | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Credential Item --> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-blue-100 rounded-md p-2 text-blue-600"> | |
| <i class="fas fa-lock"></i> | |
| </div> | |
| <div class="ml-3 flex-1"> | |
| <div class="flex items-center justify-between"> | |
| <label class="block text-sm font-medium text-gray-700">e-SAJ - TRF3</label> | |
| <span class="text-xs text-yellow-600 bg-yellow-50 px-2 py-1 rounded">Pendente</span> | |
| </div> | |
| <p class="text-xs text-gray-500 mt-1">Nenhuma credencial cadastrada</p> | |
| <button class="mt-2 text-xs font-medium text-blue-600 hover:text-blue-800"> | |
| Adicionar credenciais | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Add New Button --> | |
| <button class="ml-11 text-sm font-medium text-blue-600 hover:text-blue-800 flex items-center"> | |
| <i class="fas fa-plus mr-1"></i> Adicionar novo sistema | |
| </button> | |
| </div> | |
| </div> | |
| <div class="mb-8"> | |
| <h4 class="text-md font-medium text-gray-700 mb-4">Configurações Gerais</h4> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <!-- Browser --> | |
| <div> | |
| <label for="browser" class="block text-sm font-medium text-gray-700 mb-1">Navegador</label> | |
| <select id="browser" name="browser" class="mt-1 block w-full pl-3 pr-10 py-2 text-base border border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"> | |
| <option value="chrome">Chrome Headless</option> | |
| <option value="firefox">Firefox</option> | |
| </select> | |
| </div> | |
| <!-- Directory --> | |
| <div> | |
| <label for="directory" class="block text-sm font-medium text-gray-700 mb-1">Diretório de Comprovantes</label> | |
| <div class="mt-1 flex rounded-md shadow-sm"> | |
| <input type="text" id="directory" name="directory" value="C:\JurisRPA\Comprovantes" class="flex-1 min-w-0 block w-full px-3 py-2 rounded-none rounded-l-md border border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"> | |
| <button class="inline-flex items-center px-3 py-2 border border-l-0 border-gray-300 rounded-r-md bg-gray-50 text-gray-500 hover:bg-gray-100"> | |
| <i class="fas fa-folder-open"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Notifications --> | |
| <div class="md:col-span-2"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">Notificações</label> | |
| <div class="space-y-3"> | |
| <div class="flex items-start"> | |
| <div class="flex items-center h-5"> | |
| <input id="email-notification" name="email-notification" type="checkbox" checked class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded"> | |
| </div> | |
| <div class="ml-3 text-sm"> | |
| <label for="email-notification" class="font-medium text-gray-700">E-mail</label> | |
| <div class="mt-1"> | |
| <input type="email" value="dr.silva@escritorio.com.br" class="block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex items-center h-5"> | |
| <input id="whatsapp-notification" name="whatsapp-notification" type="checkbox" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded"> | |
| </div> | |
| <div class="ml-3 text-sm"> | |
| <label for="whatsapp-notification" class="font-medium text-gray-700">WhatsApp</label> | |
| <div class="mt-1"> | |
| <input type="tel" placeholder="(00) 00000-0000" class="block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div> | |
| <h4 class="text-md font-medium text-gray-700 mb-4">Rotinas Automatizadas</h4> | |
| <div class="bg-gray-50 rounded-lg p-4"> | |
| <div class="flex items-center justify-between mb-3"> | |
| <div> | |
| <h5 class="text-sm font-medium text-gray-700">Protocolo Diário</h5> | |
| <p class="text-xs text-gray-500">Todos os dias às 15:00</p> | |
| </div> | |
| <div class="flex items-center space-x-2"> | |
| <span class="px-2 py-1 text-xs font-medium rounded-full bg-green-100 text-green-800"> | |
| Ativo | |
| </span> | |
| <button class="text-gray-400 hover:text-gray-500"> | |
| <i class="fas fa-ellipsis-v"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <div class="flex items-center justify-between"> | |
| <div> | |
| <h5 class="text-sm font-medium text-gray-700">Backup Semanal</h5> | |
| <p class="text-xs text-gray-500">Toda segunda-feira às 20:00</p> | |
| </div> | |
| <div class="flex items-center space-x-2"> | |
| <span class="px-2 py-1 text-xs font-medium rounded-full bg-gray-100 text-gray-800"> | |
| Inativo | |
| </span> | |
| <button class="text-gray-400 hover:text-gray-500"> | |
| <i class="fas fa-ellipsis-v"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <button class="mt-4 text-sm font-medium text-blue-600 hover:text-blue-800 flex items-center"> | |
| <i class="fas fa-plus mr-1"></i> Adicionar nova rotina | |
| </button> | |
| </div> | |
| <div class="mt-8 pt-5 border-t border-gray-200 flex justify-end"> | |
| <button type="button" class="px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"> | |
| Cancelar | |
| </button> | |
| <button type="submit" class="ml-3 px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"> | |
| Salvar Configurações | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- History Page (hidden by default) --> | |
| <div id="history-page" class="hidden"> | |
| <div class="bg-white rounded-lg shadow overflow-hidden mb-6"> | |
| <div class="px-6 py-4 border-b border-gray-200 flex justify-between items-center"> | |
| <h3 class="text-lg font-medium text-gray-700">Histórico de Protocolos</h3> | |
| <div class="flex space-x-3"> | |
| <div class="relative"> | |
| <input type="text" placeholder="Buscar processo..." class="pl-8 pr-4 py-2 border border-gray-300 rounded-md text-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"> | |
| <div class="absolute left-3 top-2.5 text-gray-400"> | |
| <i class="fas fa-search"></i> | |
| </div> | |
| </div> | |
| <button class="px-3 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"> | |
| <i class="fas fa-filter"></i> | |
| </button> | |
| </div> | |
| </div> | |
| <div class="overflow-x-auto"> | |
| <table class="min-w-full divide-y divide-gray-200"> | |
| <thead class="bg-gray-50"> | |
| <tr> | |
| <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> | |
| Data/Hora | |
| </th> | |
| <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> | |
| Tribunal/Sistema | |
| </th> | |
| <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> | |
| Processo | |
| </th> | |
| <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> | |
| Tipo | |
| </th> | |
| <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> | |
| Resultado | |
| </th> | |
| <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> | |
| Comprovante | |
| </th> | |
| <th scope="col" class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider"> | |
| Ações | |
| </th> | |
| </tr> | |
| </thead> | |
| <tbody class="bg-white divide-y divide-gray-200"> | |
| <!-- Row --> | |
| <tr class="hover:bg-gray-50"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| 15/06/2023 14:32 | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <div class="text-sm font-medium text-gray-900">TJRJ</div> | |
| <div class="text-sm text-gray-500">PJe</div> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"> | |
| 0001234-56.2023.8.19.0001 | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| Petição Inicial | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 py-1 text-xs font-semibold rounded-full bg-green-100 text-green-800"> | |
| Sucesso | |
| </span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-blue-600 hover:text-blue-800"> | |
| <a href="#" class="flex items-center"> | |
| <i class="fas fa-file-pdf mr-1"></i> Ver | |
| </a> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"> | |
| <i class="fas fa-redo"></i> | |
| </button> | |
| <button class="text-gray-600 hover:text-gray-900"> | |
| <i class="fas fa-ellipsis-v"></i> | |
| </button> | |
| </td> | |
| </tr> | |
| <!-- Row --> | |
| <tr class="hover:bg-gray-50"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| 15/06/2023 14:15 | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <div class="text-sm font-medium text-gray-900">TRF1</div> | |
| <div class="text-sm text-gray-500">e-SAJ</div> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"> | |
| 0005678-90.2023.4.01.0000 | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| Contestação | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 py-1 text-xs font-semibold rounded-full bg-yellow-100 text-yellow-800"> | |
| Em andamento | |
| </span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| - | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"> | |
| <i class="fas fa-redo"></i> | |
| </button> | |
| <button class="text-gray-600 hover:text-gray-900"> | |
| <i class="fas fa-ellipsis-v"></i> | |
| </button> | |
| </td> | |
| </tr> | |
| <!-- Row --> | |
| <tr class="hover:bg-gray-50"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| 15/06/2023 13:48 | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <div class="text-sm font-medium text-gray-900">TRT2</div> | |
| <div class="text-sm text-gray-500">PROJUDI</div> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"> | |
| 0009012-34.2023.5.02.0001 | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| Recurso | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 py-1 text-xs font-semibold rounded-full bg-red-100 text-red-800"> | |
| Falha | |
| </span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| - | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"> | |
| <i class="fas fa-redo"></i> | |
| </button> | |
| <button class="text-gray-600 hover:text-gray-900"> | |
| <i class="fas fa-ellipsis-v"></i> | |
| </button> | |
| </td> | |
| </tr> | |
| <!-- Row --> | |
| <tr class="hover:bg-gray-50"> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| 15/06/2023 12:22 | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <div class="text-sm font-medium text-gray-900">TJSP</div> | |
| <div class="text-sm text-gray-500">Eproc</div> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"> | |
| 0003456-78.2023.8.26.0001 | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> | |
| Petição Intermediária | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap"> | |
| <span class="px-2 py-1 text-xs font-semibold rounded-full bg-green-100 text-green-800"> | |
| Sucesso | |
| </span> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-sm text-blue-600 hover:text-blue-800"> | |
| <a href="#" class="flex items-center"> | |
| <i class="fas fa-file-pdf mr-1"></i> Ver | |
| </a> | |
| </td> | |
| <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> | |
| <button class="text-blue-600 hover:text-blue-900 mr-3"> | |
| <i class="fas fa-redo"></i> | |
| </button> | |
| <button class="text-gray-600 hover:text-gray-900"> | |
| <i class="fas fa-ellipsis-v"></i> | |
| </button> | |
| </td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <div class="px-6 py-3 bg-gray-50 border-t border-gray-200 flex items-center justify-between"> | |
| <div class="text-sm text-gray-500"> | |
| Mostrando <span class="font-medium">1</span> a <span class="font-medium">4</span> de <span class="font-medium">24</span> resultados | |
| </div> | |
| <div class="flex space-x-1"> | |
| <button class="px-3 py-1 border border-gray-300 rounded text-sm font-medium text-gray-700 bg-white hover:bg-gray-50"> | |
| Anterior | |
| </button> | |
| <button class="px-3 py-1 border border-gray-300 rounded text-sm font-medium text-white bg-blue-600 hover:bg-blue-700"> | |
| 1 | |
| </button> | |
| <button class="px-3 py-1 border border-gray-300 rounded text-sm font-medium text-gray-700 bg-white hover:bg-gray-50"> | |
| 2 | |
| </button> | |
| <button class="px-3 py-1 border border-gray-300 rounded text-sm font-medium text-gray-700 bg-white hover:bg-gray-50"> | |
| 3 | |
| </button> | |
| <button class="px-3 py-1 border border-gray-300 rounded text-sm font-medium text-gray-700 bg-white hover:bg-gray-50"> | |
| Próximo | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| // Simple page navigation | |
| document.addEventListener('DOMContentLoaded', function() { | |
| // Show dashboard by default | |
| document.getElementById('dashboard-page').classList.remove('hidden'); | |
| // Sidebar navigation | |
| const sidebarItems = document.querySelectorAll('.sidebar-item'); | |
| sidebarItems.forEach(item => { | |
| item.addEventListener('click', function(e) { | |
| e.preventDefault(); | |
| // Remove active class from all items | |
| sidebarItems.forEach(i => i.classList.remove('active')); | |
| // Add active class to clicked item | |
| this.classList.add('active'); | |
| // Hide all pages | |
| document.getElementById('dashboard-page').classList.add('hidden'); | |
| document.getElementById('schedule-page').classList.add('hidden'); | |
| document.getElementById('settings-page').classList.add('hidden'); | |
| document.getElementById('history-page').classList.add('hidden'); | |
| // Show the selected page | |
| if (this.textContent.includes('Dashboard')) { | |
| document.getElementById('dashboard-page').classList.remove('hidden'); | |
| document.querySelector('.flex.items-center h1').textContent = 'Dashboard'; | |
| } else if (this.textContent.includes('Agendar')) { | |
| document.getElementById('schedule-page').classList.remove('hidden'); | |
| document.querySelector('.flex.items-center h1').textContent = 'Agendar Protocolo'; | |
| } else if (this.textContent.includes('Configurações')) { | |
| document.getElementById('settings-page').classList.remove('hidden'); | |
| document.querySelector('.flex.items-center h1').textContent = 'Configurações'; | |
| } else if (this.textContent.includes('Histórico')) { | |
| document.getElementById('history-page').classList.remove('hidden'); | |
| document.querySelector('.flex.items-center h1').textContent = 'Histórico'; | |
| } | |
| }); | |
| }); | |
| // Schedule form radio buttons | |
| const radioImediato = document.getElementById('imediato'); | |
| const radioProgramado = document.getElementById('programado'); | |
| const programadoFields = document.getElementById('programado-fields'); | |
| radioImediato.addEventListener('change', function() { | |
| if (this.checked) { | |
| programadoFields.classList.add('hidden'); | |
| } | |
| }); | |
| radioProgramado.addEventListener('change', function() { | |
| if (this.checked) { | |
| programadoFields.classList.remove('hidden'); | |
| } | |
| }); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=JEFFERSON1995/robodeautomacao" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |