91 lines
2.4 KiB
Vue
91 lines
2.4 KiB
Vue
|
<template>
|
||
|
|
<div class="q-pa-sm">
|
||
|
|
<div class="q-gutter-sm">
|
||
|
|
<div class="row q-col-gutter-sm q-mb-sm items-center">
|
||
|
|
<div class="col">
|
||
|
|
<q-select
|
||
|
|
v-model="localAddressObj"
|
||
|
|
label="Indirizzo"
|
||
|
|
use-input
|
||
|
|
input-debounce="300"
|
||
|
|
:options="suggestions"
|
||
|
|
@filter="getAddressSuggestions"
|
||
|
|
filled
|
||
|
|
dense
|
||
|
|
hide-dropdown-icon
|
||
|
|
clearable
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<div class="col-auto">
|
||
|
|
<q-btn @click="searchAddress" label="Cerca" color="primary" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row q-col-gutter-sm q-mb-sm items-center no-wrap">
|
||
|
|
<q-col class="q-col-auto" style="width: 120px">
|
||
|
|
<q-input
|
||
|
|
v-model="localCoordinates.lat"
|
||
|
|
label="Latitudine:"
|
||
|
|
filled
|
||
|
|
:label-color="modificato ? 'negative' : 'primary'"
|
||
|
|
dense
|
||
|
|
/>
|
||
|
|
</q-col>
|
||
|
|
<q-col class="q-col-auto" style="width: 120px">
|
||
|
|
<q-input
|
||
|
|
v-model="localCoordinates.lng"
|
||
|
|
label="Longitudine:"
|
||
|
|
filled
|
||
|
|
:label-color="modificato ? 'negative' : 'primary'"
|
||
|
|
dense
|
||
|
|
/>
|
||
|
|
</q-col>
|
||
|
|
<q-col class="q-col-auto" style="width: 60px">
|
||
|
|
<q-btn
|
||
|
|
@click="getCurrentLocation"
|
||
|
|
label=""
|
||
|
|
color="primary"
|
||
|
|
icon="gps_fixed"
|
||
|
|
/>
|
||
|
|
</q-col>
|
||
|
|
<q-col class="q-col-auto" style="width: 60px">
|
||
|
|
<q-btn
|
||
|
|
@click="mostraMappa = !mostraMappa"
|
||
|
|
:color="mostraMappa ? 'negative' : 'positive'"
|
||
|
|
class="q-ma-sm"
|
||
|
|
icon="fas fa-map"
|
||
|
|
/>
|
||
|
|
</q-col>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div v-if="modificato" class="row justify-center q-ma-sm">
|
||
|
|
<q-btn
|
||
|
|
@click="salvaCoordinate"
|
||
|
|
color="primary"
|
||
|
|
label="Salva"
|
||
|
|
:disable="!modificato"
|
||
|
|
class="q-ma-sm"
|
||
|
|
/>
|
||
|
|
<q-btn
|
||
|
|
@click="annullaSalvataggio"
|
||
|
|
label="Annulla"
|
||
|
|
class="q-ma-sm"
|
||
|
|
:disable="!modificato"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div
|
||
|
|
id="map"
|
||
|
|
ref="mapContainer"
|
||
|
|
v-show="mostraMappa"
|
||
|
|
:style="`height:${myheight}px; width:99%`"
|
||
|
|
></div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script lang="ts" src="./CMapEditAddressByCoord.ts">
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
@import './CMapEditAddressByCoord.scss';
|
||
|
|
</style>
|