116 lines
3.6 KiB
Vue
116 lines
3.6 KiB
Vue
<template >
|
|
<div >
|
|
<h2 class='title is-2' >Tags de data.elements[0]</h2 >
|
|
<section
|
|
v-if='data && data.elements'
|
|
class='edit' >
|
|
elements: {{ data.elements.length }}
|
|
<b-field label='Nom' >
|
|
<b-input
|
|
v-model='data.elements[0].tags.name'
|
|
icon='pencil'
|
|
placeholder='le nom de votre commerce'
|
|
></b-input >
|
|
</b-field >
|
|
<b-field label='Site web' >
|
|
<b-input
|
|
v-model='data.elements[0].tags.website'
|
|
icon='planet'
|
|
placeholder='www.monsite.com'
|
|
></b-input >
|
|
</b-field >
|
|
<b-field label='email officiel' >
|
|
<b-input
|
|
v-model='data.elements[0].tags.mail'
|
|
icon='enveloppe'
|
|
placeholder='contact@monsite.com'
|
|
></b-input >
|
|
</b-field >
|
|
<b-field label='Tel' >
|
|
<b-input
|
|
v-model='data.elements[0].tags.phone'
|
|
icon='planet'
|
|
placeholder='012345'
|
|
type='tel'
|
|
></b-input >
|
|
</b-field >
|
|
<b-field label='Description de votre activité' >
|
|
<b-input
|
|
v-model='data.elements[0].tags.description'
|
|
icon='planet'
|
|
placeholder='description de votre activité'
|
|
type='tel'
|
|
></b-input >
|
|
</b-field >
|
|
<b-field >
|
|
<b-switch v-model='data.elements[0].tags.takeaway' >
|
|
Vente à emporter
|
|
</b-switch >
|
|
<b-switch v-model="data.elements[0].tags['parking:velo']" >
|
|
Parking vélo
|
|
</b-switch >
|
|
<b-switch v-model="data.elements[0].tags['webaccess']" >
|
|
Accès Internet
|
|
</b-switch >
|
|
<b-switch v-model="data.elements[0].tags['elecborne']" >
|
|
borne de recharge électrique sur parking
|
|
</b-switch >
|
|
<b-switch v-model="data.elements[0].tags['access:public']" >
|
|
Accès autorisé au public
|
|
</b-switch >
|
|
</b-field >
|
|
|
|
<h2 class='title is-2' >Horaires d'ouverture</h2 >
|
|
<div class='padded' >
|
|
{{ data.elements[0].tags.opening_hours }}
|
|
</div >
|
|
|
|
<button class='btn button has-background-success' >Enregistrer</button >
|
|
</section >
|
|
<section class='comparaison' >
|
|
<h2 >Comparaison des tags</h2 >
|
|
<table >
|
|
<thead >
|
|
<tr >
|
|
<td >API OSM</td >
|
|
<td >API addok</td >
|
|
</tr >
|
|
</thead >
|
|
<tbody >
|
|
<tr >
|
|
<td >
|
|
<!-- <div v-for="(value, name) in data[0].properties.tags" :key="name">-->
|
|
<!-- <div class="columns">-->
|
|
<!-- <div class="column">-->
|
|
<!-- <strong> {{ name }} </strong>-->
|
|
<!-- </div>-->
|
|
<!-- <div class="column">-->
|
|
<!-- {{ value }}-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
<!-- </div>-->
|
|
</td >
|
|
<td v-if='fetchedData.osm_data && fetchedData.osm_data.elements' >
|
|
<div
|
|
v-for='(value, name) in fetchedData.osm_data.elements[0].tags'
|
|
:key='name'
|
|
>
|
|
<div class='columns' >
|
|
<div class='column' >
|
|
<strong > {{ name }}</strong >
|
|
</div >
|
|
<div class='column' >{{ value }}</div >
|
|
</div >
|
|
</div >
|
|
</td >
|
|
</tr >
|
|
</tbody >
|
|
</table >
|
|
</section >
|
|
<pre v-if='data' >
|
|
data:
|
|
{{ data }}
|
|
</pre >
|
|
</div >
|
|
</template >
|