Desenvolvimento

Estrutura do Projeto

Organização de diretórios e arquivos do frontend e backend.

Estrutura do Projeto

Frontend (stCall)

stCall/
├── app.vue                     # Componente raiz (Toast, IncomingCall, TabBlocked)
├── nuxt.config.ts              # Configuração Nuxt (módulos, tema, runtime config)
├── theme.config.ts             # Tema PrimeVue (cores laranja)
├── tailwind.config.cjs         # Configuração Tailwind CSS
├── tsconfig.json               # TypeScript (extends .nuxt/tsconfig)
├── package.json                # Dependências
├── Dockerfile                  # Imagem Docker (oven/bun:1-alpine)
├── docker-compose.yml          # Compose para desenvolvimento local
│
├── assets/css/
│   └── tailwind.css            # Imports do Tailwind
│
├── components/                 # Componentes Vue (auto-importados)
│   ├── ActiveCallDisplay.vue   # Display de chamada ativa (full/compact)
│   ├── AppSidebar.vue          # Barra lateral de navegação
│   ├── AudioPlayer.vue         # Reprodutor de áudio
│   ├── Dialer.vue              # Teclado de discagem
│   ├── IncomingCallDialog.vue  # Diálogo de chamada entrante
│   ├── MicrophoneSelector.vue  # Seletor de microfone
│   ├── OutgoingCallDialog.vue  # Diálogo de chamada saindo
│   ├── PasswordRecoveryDialog.vue
│   ├── RecentCallItem.vue      # Item de chamada recente
│   ├── StatCard.vue            # Card de estatística
│   ├── TabBlockedOverlay.vue   # Overlay para instância única
│   ├── TopBar.vue              # Barra superior
│   ├── VolumeIndicator.vue     # Indicador de volume
│   └── WebRTCAudioPlayer.vue   # Player de áudio WebRTC (invisível)
│
├── composables/                # Composables (auto-importados pelo Nuxt)
│   ├── agent/                  # Gerenciamento de agentes
│   │   ├── useAgentConnection.ts
│   │   └── useAgentStatus.ts
│   ├── audio/                  # Áudio e microfone
│   │   ├── useAudioLevel.ts
│   │   └── useMicTest.ts
│   ├── calls/                  # Lógica de chamadas
│   │   ├── useCallControls.ts
│   │   ├── useCallDuration.ts
│   │   ├── useCallEvents.ts
│   │   ├── useCallFormatters.ts
│   │   ├── useCallHandler.ts
│   │   ├── useCallHistoryFilters.ts
│   │   ├── useCallLifecycle.ts
│   │   ├── useCallStatus.ts
│   │   └── useRecordingPlayer.ts
│   ├── storage/
│   │   └── useCallHistoryPersistence.ts
│   ├── utils/
│   │   └── useCommandExecutor.ts
│   ├── webrtc/                 # Integração WebRTC
│   │   ├── useWebRTCCall.ts
│   │   ├── useWebRTCIntegration.ts
│   │   ├── useWebRTCMedia.ts
│   │   ├── useWebRTCPhone.ts
│   │   ├── useWebRTCSession.ts
│   │   └── useWebRTCState.ts
│   ├── ws/                     # Integração WebSocket
│   │   ├── useAsteriskEventHandler.ts
│   │   ├── useWebSocketCommands.ts
│   │   ├── useWebSocketConnection.ts
│   │   ├── useWebSocketErrors.ts
│   │   ├── useWebSocketHandler.ts
│   │   ├── useWebSocketHeartbeat.ts
│   │   ├── useWebSocketMessageRouter.ts
│   │   └── useWebSocketReconnection.ts
│   ├── useAuthAPI.ts
│   ├── useDialer.ts
│   ├── useGlobalToast.ts
│   ├── useSessionManager.ts
│   ├── useSingleInstance.ts
│   └── useTokenStorage.ts
│
├── stores/                     # Pinia stores
│   ├── agentStore.ts           # Dados e status dos agentes
│   ├── asteriskStore.ts        # Conexão WebSocket com stcall-ws
│   ├── audioStore.ts           # Configurações de áudio
│   ├── authStore.ts            # Autenticação e papel do usuário
│   ├── callStore.ts            # Chamada ativa e histórico
│   ├── dialerStore.ts          # Estado do discador
│   └── uiStore.ts              # Preferências de UI (dark mode, notificações)
│
├── pages/                      # Rotas (file-based routing)
│   ├── index.vue               # Dashboard (/)
│   ├── agents.vue              # Gerenciamento de agentes (/agents)
│   ├── call.vue                # Interface de chamada (/call)
│   ├── history.vue             # Histórico (/history)
│   ├── login.vue               # Login (/login) - layout blank
│   ├── profile.vue             # Perfil (/profile)
│   ├── settings.vue            # Configurações (/settings)
│   ├── mic-test.vue            # Teste de microfone (/mic-test)
│   ├── test-asterisk.vue       # Teste Asterisk (/test-asterisk)
│   └── admin/
│       ├── index.vue           # Dashboard admin (/admin)
│       └── analytics.vue       # Analytics (/admin/analytics)
│
├── layouts/                    # Templates de layout
│   ├── default.vue             # Sidebar + TopBar + conteúdo
│   └── blank.vue               # Mínimo (usado no login)
│
├── middleware/                  # Middleware de rota
│   ├── auth.global.ts          # Autenticação global
│   ├── admin.ts                # Proteção de rotas admin
│   └── root-redirect.global.ts # Redirecionamento da raiz
│
├── plugins/
│   └── primevue.ts             # Configuração do PrimeVue
│
├── types/                      # Definições TypeScript
│   ├── index.ts                # Barrel export
│   ├── agent.ts                # Agent, AgentStatus, AgentStats
│   ├── asterisk.ts             # Tipos do Asterisk
│   ├── call.ts                 # Call, CallHistory, CallStatus
│   ├── ui.ts                   # Notification, ReleaseNote
│   ├── user.ts                 # User, LoginResponse
│   └── runtime-config.d.ts     # Config de runtime
│
├── utils/
│   ├── jwt.ts                  # Utilidades JWT
│   └── toastManager.ts         # Gerenciador de toasts
│
└── server/
    ├── api/asterisk/test.get.ts # API de teste Asterisk
    └── utils/asterisk.ts        # Utilidades do Asterisk

WebSocket Server (websockets-stcall)

websockets-stcall/
├── src/
│   ├── server.ts               # Entry point principal
│   ├── healthcheck.ts          # Endpoint de health check
│   │
│   ├── agents/                 # Gerenciamento de agentes
│   │   ├── auth.ts             # Validação JWT
│   │   ├── authentication.ts   # Lógica de autenticação
│   │   └── registry.ts         # Registro de agentes (Map)
│   │
│   ├── asterisk/               # Integração Asterisk
│   │   ├── ami-connection.ts   # Conexão AMI
│   │   ├── api-client.ts       # Cliente REST ARI
│   │   └── connection.ts       # Conexão ARI WebSocket
│   │
│   ├── commands/
│   │   └── handler.ts          # Handler de comandos dos agentes
│   │
│   ├── database/
│   │   ├── calls.ts            # Operações de chamadas
│   │   ├── cdr-client.ts       # Cliente CDR
│   │   ├── prisma-client.ts    # Inicialização Prisma
│   │   └── users.ts            # Operações de usuários
│   │
│   ├── routes/                 # Rotas HTTP
│   │   ├── auth.ts             # Rota de autenticação
│   │   ├── pjsip-sync.ts      # Rota de sincronização PJSIP
│   │   └── users.ts            # Rota de usuários
│   │
│   ├── routing/
│   │   └── filter.ts           # Filtro de eventos ARI
│   │
│   ├── services/
│   │   ├── call-tracker.ts     # Rastreamento de chamadas
│   │   ├── direct-call-tracker.ts
│   │   ├── incoming-call-bridge.ts
│   │   ├── pjsip-sync.ts      # Sincronização PJSIP
│   │   ├── queue-tracker.ts    # Rastreamento de filas
│   │   ├── sip-sync.ts
│   │   └── freepbx/            # Integração FreePBX GraphQL
│   │       ├── auth.ts
│   │       ├── client.ts
│   │       ├── extensions.ts
│   │       ├── index.ts
│   │       └── types.ts
│   │
│   ├── types/
│   │   ├── index.ts            # Tipos principais
│   │   └── ami-events.ts       # Tipos de eventos AMI
│   │
│   └── utils/
│       ├── api-helpers.ts
│       ├── config.ts           # Configuração centralizada
│       ├── encryption.ts       # Criptografia de senhas SIP
│       ├── logger.ts           # Logger estruturado JSON
│       └── password.ts         # Utilitários de senha
│
├── prisma/
│   ├── schema.prisma           # Schema MySQL (FreePBX)
│   ├── schema-stcall.prisma    # Schema PostgreSQL (stCall)
│   └── schema-cdr.prisma       # Schema MySQL (CDR)
│
├── database/
│   └── init-schema.sql         # SQL de inicialização
│
├── scripts/
│   └── generate-password-hashes.ts
│
├── prisma.config.ts            # Config Prisma PostgreSQL
├── prisma-freepbx.config.ts    # Config Prisma MySQL
├── docker-compose.yml          # Compose: WS + PostgreSQL + pgAdmin
├── Dockerfile
└── package.json
Copyright © 2026