tethys/resources/js/components/locations-map.vue
Arno Kaimbacher 43d98a1f82 - edit Dataset before release to editor
- robots.txt avoid search bots
- adapt Dataset.ts and LocationsMap.ts for edit form
- edit createForm for new dataset attributes
- vue-countdown.vue 1800 seconds
2020-06-10 21:09:28 +02:00

108 lines
2.5 KiB
Vue

<template>
<div style="position:relative">
<!-- <div id="inset">
</div>-->
<div id="map"></div>
<!-- <div id="delete">Delete Features</div> -->
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-2 pure-div">
<label for="xmin">xmin:</label>
<input
name="coverage[x_min]"
type="text"
class="pure-u-23-24"
v-model="geolocation.x_min"
data-vv-scope="step-2"
id="xmin"
v-validate="'decimal'"
/>
</div>
<div class="pure-u-1 pure-u-md-1-2 pure-div">
<label for="ymin">ymin:</label>
<input
name="coverage[y_min]"
type="text"
class="pure-u-23-24"
v-model="geolocation.y_min"
data-vv-scope="step-2"
id="ymin"
v-validate="'decimal'"
/>
</div>
<div class="pure-u-1 pure-u-md-1-2 pure-div">
<label for="xmax">xmax:</label>
<input
name="coverage[x_max]"
type="text"
class="pure-u-23-24"
v-model="geolocation.x_max"
data-vv-scope="step-2"
id="xmax"
v-validate="'decimal'"
/>
</div>
<div class="pure-u-1 pure-u-md-1-2 pure-div">
<label for="ymax">ymax:</label>
<input
name="coverage[y_max]"
type="text"
class="pure-u-23-24"
v-model="geolocation.y_max"
data-vv-scope="step-2"
id="ymax"
v-validate="'decimal'"
/>
</div>
<input type="button" v-if="validBoundingBox" v-on:click="zoomTo" value="validate coordinates" />
</div>
</div>
</template>
<script lang="ts">
import LocationsMap from "./LocationsMap";
export default LocationsMap;
</script>
// https://github.com/vuejs-templates/webpack/issues/121
// npm install node-sass sass-loader --save-dev
<style lang="scss">
/* Import CSS from Leaflet and plugins.*/
@import "~leaflet/dist/leaflet.css";
@import "~leaflet-draw/dist/leaflet.draw.css";
#map {
width: 100%;
height: 400px;
font-weight: bold;
font-size: 13px;
text-shadow: 0 0 2px #fff;
}
#delete,
#export {
position: absolute;
top: 50px;
right: 10px;
z-index: 100;
background: white;
color: black;
padding: 6px;
border-radius: 4px;
font-family: "Helvetica Neue";
cursor: pointer;
font-size: 12px;
text-decoration: none;
z-index: 999;
}
#inset {
position: absolute;
bottom: 0;
left: 0;
border: none;
width: 120px;
z-index: 999;
/*height: 120px;*/
}
</style>