Mercurial > gemma

comparison client/src/components/importoverview/SectionDetails.vue @ 3358:c0c880553cd5

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
client: import review: added section details (actually just the link to move the map to the feature)
author Markus Kottlaender <markus@intevation.de>
date Tue, 21 May 2019 16:31:22 +0200
parents
children 40bc7e3bc561
comparison
equal deleted inserted replaced
3357:8d6e70a9ffcb 3358:c0c880553cd5
1 <template>
2 <div>
3 <a @click="zoomToSection()" class="text-info pointer">{{
4 details.summary.section
5 }}</a>
6 </div>
7 </template>
8
9 <script>
10 /* This is Free Software under GNU Affero General Public License v >= 3.0
11 * without warranty, see README.md and license for details.
12 *
13 * SPDX-License-Identifier: AGPL-3.0-or-later
14 * License-Filename: LICENSES/AGPL-3.0.txt
15 *
16 * Copyright (C) 2018 by via donau
17 * – Österreichische Wasserstraßen-Gesellschaft mbH
18 * Software engineering by Intevation GmbH
19 *
20 * Author(s):
21 * Thomas Junk <thomas.junk@intevation.de>
22 */
23 import { displayError } from "@/lib/errors";
24 import { mapState, mapGetters } from "vuex";
25
26 export default {
27 props: ["entry"],
28 mounted() {
29 this.$store.commit("imports/hideAdditionalInfo");
30 },
31 computed: {
32 ...mapState("imports", ["showAdditional", "details"]),
33 ...mapGetters("map", ["openLayersMap"])
34 },
35 methods: {
36 zoomToSection() {
37 const name = this.details.summary.section;
38 this.openLayersMap()
39 .getLayer("SECTIONS")
40 .setVisible(true);
41 this.$store
42 .dispatch("imports/loadSection", name)
43 .then(response => {
44 if (response.data.features.length < 1)
45 throw new Error("no feaures found for: " + name);
46 this.$store.commit(
47 "imports/selectedSectionId",
48 response.data.features[0].id
49 );
50 this.$store.dispatch("map/moveToFeauture", {
51 feature: response.data.features[0],
52 zoom: 17,
53 preventZoomOut: true
54 });
55 })
56 .catch(error => {
57 console.log(error);
58 const { status, data } = error.response;
59 displayError({
60 title: this.$gettext("Backend Error"),
61 message: `${status}: ${data.message || data}`
62 });
63 });
64 }
65 }
66 };
67 </script>