Mercurial > gemma
view client/src/components/systemconfiguration/MapLayers.vue @ 5095:e21cbb9768a2
Prevent duplicate fairway areas
In principal, there can be only one or no fairway area at each point
on the map. Since polygons from real data will often be topologically
inexact, just disallow equal geometries. This will also help to
avoid importing duplicates with concurrent imports, once the history
of fairway dimensions will be preserved.
author | Tom Gottfried <tom@intevation.de> |
---|---|
date | Wed, 25 Mar 2020 18:10:02 +0100 |
parents | efe0904b1d45 |
children |
line wrap: on
line source
<template> <div class="d-flex flex-column py-4"> <div class="px-3 container-fluid"> <div class="row"> <div class="col-sm-6"> <div class="form-group"> <label for="ecdis-url" class="font-weight-bold"> ECDIS WMS URL </label> <input type="url" class="form-control" placeholder="https://..." @input="lookupWMSCapabilities()" v-model="config.ecdis_wms_url" /> </div> <label for="ecdis-layers"> <translate>Layers</translate> <transition name="fade" ><font-awesome-icon icon="spinner" spin v-if="availableWMSLayersLoading" class="ml-2" /></transition> </label> <div class="container-fluid"> <div class="row"> <div class="custom-control custom-checkbox col-sm-4" v-for="layer in availableWMSLayers" :key="'layer-' + layer" > <input type="checkbox" class="custom-control-input" v-model="selectedWMSLayers" :id="'layer-' + layer" :value="layer" /> <label class="custom-control-label text-break" :for="'layer-' + layer" > {{ layer }} </label> </div> </div> </div> </div> </div> </div> <div class="mt-4 px-3"> <a @click.prevent="submit" class="btn btn-info btn-sm text-white"> <translate>Send</translate> </a> <a @click.prevent="reset" class="btn btn-outline-info btn-sm ml-2"> <translate>Reset to defaults</translate> </a> </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): * Markus Kottländer <markus@intevation.de> */ import { mapState } from "vuex"; import WMSCapabilities from "ol/format/WMSCapabilities"; import { HTTP } from "@/lib/http"; import defaults from "./defaults"; const WMSCapabilitiesParser = new WMSCapabilities(); export default { data() { return { selectedWMSLayers: [], availableWMSLayers: [], availableWMSLayersLoading: false, lookupWMSCapabilitiesTimeout: null, wmsVersion: "" }; }, computed: { ...mapState("application", ["config"]) }, methods: { lookupWMSCapabilities() { if (this.lookupWMSCapabilitiesTimeout) { clearTimeout(this.lookupWMSCapabilitiesTimeout); } this.lookupWMSCapabilitiesTimeout = setTimeout(() => { let url; try { let urlParts = new URL(this.config.ecdis_wms_url); url = urlParts.protocol + "//" + urlParts.host + urlParts.pathname.trim("/") + "/"; } catch (e) { url = this.config.ecdis_wms_url; } this.availableWMSLayersLoading = true; HTTP.get(url + "?request=GetCapabilities&service=WMS") .then(response => { let capabilities = WMSCapabilitiesParser.read(response.data); this.wmsVersion = capabilities.version; this.availableWMSLayers = []; this.getLayersRecursive(capabilities.Capability.Layer.Layer); }) .catch(() => { this.availableWMSLayers = []; }) .finally(() => (this.availableWMSLayersLoading = false)); }, 500); }, getLayersRecursive(layers) { layers.forEach(l => { if (l.hasOwnProperty("Layer")) { this.getLayersRecursive(l.Layer); } else { this.availableWMSLayers.push(l.Name); } }); }, reset() { this.config.ecdis_wms_url = defaults.ecdis_wms_url; let ecdisWmsParams = JSON.parse(defaults.ecdis_wms_params); this.selectedWMSLayers = ecdisWmsParams.LAYERS.split(","); this.lookupWMSCapabilities(); }, submit() { const layers = this.selectedWMSLayers .filter(l => this.availableWMSLayers.find(al => al === l)) .join(","); const wmsParams = JSON.stringify({ LAYERS: layers, VERSION: this.wmsVersion, TILED: true }); this.$store .dispatch("application/saveConfig", { ecdis_wms_url: this.config.ecdis_wms_url, ecdis_wms_params: wmsParams }) .then(() => { this.config.ecdis_wms_params = wmsParams; }); } }, mounted() { let ecdisWmsParams = JSON.parse(this.config.ecdis_wms_params); if (ecdisWmsParams.LAYERS) { this.selectedWMSLayers = ecdisWmsParams.LAYERS.split(","); } this.lookupWMSCapabilities(); } }; </script>