inclusão de mapas
This commit is contained in:
parent
b564c2c302
commit
6b9a9dc705
20 changed files with 4200 additions and 3696 deletions
23
README.md
23
README.md
|
|
@ -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
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue