Mercurial > gemma
view client/src/components/importschedule/importtypes/Fairwaydimensions.vue @ 2486:bca9a7a89f28 octree-diff
Merged default into octree-diff branch.
author | Sascha L. Teichmann <sascha.teichmann@intevation.de> |
---|---|
date | Fri, 01 Mar 2019 18:28:50 +0100 |
parents | dfa4db82e784 |
children |
line wrap: on
line source
<template> <div> <div class="d-flex flex-row"> <div class="flex-column mt-3 mr-3 w-100"> <div class="flex-row text-left"> <small class="text-muted"> <translate>URL</translate> </small> </div> <div class="w-100"> <input @input="urlChanged" class="url form-control" type="url" :value="url" /> </div> </div> </div> <div v-if="!url" class="d-flex flex-row"> <small ><translate class="text-danger">Please enter a URL</translate></small > </div> <div class="d-flex flex-row"> <div class="flex-column mt-3 mr-3 w-50"> <div class="flex-row text-left"> <small class="text-muted"> <translate>Featuretype</translate> </small> </div> <div class="w-100"> <input @input="featureTypeChanged" class="featuretype form-control" type="text" :value="featureType" /> </div> <div v-if="!featureType" class="d-flex flex-row"> <small ><translate class="text-danger" >Please enter a Featuretype</translate ></small > </div> </div> <div class="flex-column mt-3 w-50"> <div class="flex-row text-left"> <small class="text-muted"> <translate>SortBy</translate> </small> </div> <div class="w-100"> <input @input="sortByChanged" class="sortby form-control" type="text" :value="sortBy" /> </div> <div v-if="!sortBy" class="d-flex flex-row"> <small ><translate class="text-danger" >Please enter SortBy</translate ></small > </div> </div> </div> <div class="d-flex flex-row"> <div class="flex-column mt-3 mr-3 w-50"> <div class="flex-row text-left"> <small class="text-muted"> <translate>LOS</translate> </small> </div> <div class="w-100"> <select v-model="los" class="form-control"> <option>1</option> <option>2</option> <option>3</option> </select> </div> <div v-if="!LOS" class="d-flex flex-row"> <small ><translate class="text-danger" >Please enter a level of service</translate ></small > </div> </div> <div class="flex-column mt-3 w-50"> <div class="flex-row text-left"> <small class="text-muted"> <translate>Depth</translate> </small> </div> <div class="d-flex flex-row"> <input @input="depthChanged" class="depth form-control" type="number" :value="depth" /> <div class="ml-2 my-auto">cm</div> </div> <div v-if="!depth" class="d-flex flex-row"> <small ><translate class="text-danger" >Please enter a depth</translate ></small > </div> </div> </div> <div class="d-flex flex-row"> <div class="flex-column mt-3 mr-3 w-50"> <div class="flex-row text-left"> <small class="text-muted"> <translate>MinWidth</translate> </small> </div> <div class="d-flex flex-row"> <input @input="minWidthChanged" class="minwidth form-control" type="number" :value="minWidth" /> <div class="ml-2 my-auto"> m</div> </div> <div v-if="!minWidth" class="d-flex flex-row"> <small ><translate class="text-danger" >Please enter a minimum width</translate ></small > </div> </div> <div class="flex-column mt-3 w-50"> <div class="flex-row text-left"> <small class="text-muted"> <translate>MaxWidth</translate> </small> </div> <div class="d-flex flex-row"> <input @input="maxWidthChanged" class="maxwidth form-control" type="number" :value="maxWidth" /> <div class="ml-2 my-auto"> m</div> </div> <div v-if="!maxWidth" class="d-flex flex-row"> <small ><translate class="text-danger" >Please enter a maximum width</translate ></small > </div> </div> </div> <div class="d-flex flex-row"> <div class="flex-column mt-3 mr-3 w-50"> <div class="flex-row text-left"> <small class="text-muted"> <translate>Source orgranization</translate> </small> </div> <div class="w-100"> <input @input="sourceOrganizationChanged" class="sourceorganization form-control" type="text" :value="sourceOrganization" /> </div> <div v-if="!sourceOrganization" class="d-flex flex-row"> <small ><translate class="text-danger" >Please enter a source orgranization</translate ></small > </div> </div> </div> </div> </template> <script> /* This is Free Software under GNU Affero General Public License v >= 3.0 * without warranty, see README.md and license for details. * * SPDX-License-Identifier: AGPL-3.0-or-later * License-Filename: LICENSES/AGPL-3.0.txt * * Copyright (C) 2018 by via donau * – Österreichische Wasserstraßen-Gesellschaft mbH * Software engineering by Intevation GmbH * * Author(s): * Thomas Junk <thomas.junk@intevation.de> */ export default { name: "fairwaydimensions", props: [ "url", "featureType", "sortBy", "depth", "LOS", "minWidth", "maxWidth", "sourceOrganization" ], methods: { urlChanged(e) { this.$emit("urlChanged", e.target.value); }, featureTypeChanged(e) { this.$emit("featureTypeChanged", e.target.value); }, sortByChanged(e) { this.$emit("sortByChanged", e.target.value); }, depthChanged(e) { this.$emit("depthChanged", e.target.value * 1); }, LOSChanged(e) { this.$emit("LOSChanged", e.target.value * 1); }, minWidthChanged(e) { this.$emit("minWidthChanged", e.target.value * 1); }, maxWidthChanged(e) { this.$emit("maxWidthChanged", e.target.value * 1); }, sourceOrganizationChanged(e) { this.$emit("sourceOrganizationChanged", e.target.value); } }, computed: { los: { get() { return this.LOS; }, set(value) { this.$emit("LOSChanged", value * 1); } } } }; </script> <style></style>