inclusão de mapas

This commit is contained in:
Luiz Silva 2026-06-06 18:54:24 -03:00
parent b564c2c302
commit 6b9a9dc705
20 changed files with 4200 additions and 3696 deletions

View file

@ -27,11 +27,14 @@
```bash
pnpm add eli-vue
# Dependências (Peer Dependencies)
pnpm add vue vuetify lucide-vue-next
pnpm add vue vuetify lucide-vue-next leaflet
pnpm add -D @types/leaflet
```
Certifique-se de que seu projeto esteja configurado com Vuetify 3.
> **Nota**: O CSS do Leaflet é incluído automaticamente no bundle do eli-vue. Não é necessário importar `leaflet/dist/leaflet.css` manualmente.
---
## 📦 Referência de Componentes
@ -249,7 +252,9 @@ Um conjunto de wrappers padronizados em torno dos campos do Vuetify.
- `EliEntradaNumero`: Inteiros, Decimais, Moeda.
- `EliEntradaDataHora`: Data, DataHora.
- `EliEntradaSelecao`: Select/Dropdown (pode ser assíncrono).
- `EliEntradaSelecaoMultipla`: Multi-select (pode ser assíncrono).
- `EliEntradaParagrafo`: Textarea.
- `EliEntradaCoordenadas`: Mapa Leaflet interativo com inputs de lat/lng.
#### API Comum
Todas as entradas aceitam duas props principais:
@ -299,6 +304,22 @@ opcoes: {
}
```
**EliEntradaCoordenadas**
```typescript
// value: { formato: "decimal", datum: "EPSG:4326", latitude: number, longitude: number }
opcoes: {
rotulo: string;
zoom?: number; // Nível de zoom inicial (padrão: 4)
alturaMapa?: number; // Altura do mapa em pixels (padrão: 300)
apenasLeitura?: boolean; // Desabilita clique e arraste no mapa
}
```
> **Importante**: Requer `import "leaflet/dist/leaflet.css"` no entry point do app consumidor.
> O componente inclui: mapa Leaflet interativo, inputs editáveis de lat/lng (aceita vírgula BR),
> marcador arrastável, botão "Usar minha localização" (GPS + GeoIP fallback),
> e seletor de camadas (Mapa / Satélite).
#### Exemplo de Uso
```vue