Mercurial > gemma

annotate client/src/application/Morphtool.vue @ 836:0b994949a4a0

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
client: make Morphtool selection more robust * Check if the selected features we are testing has an id before operating on it.
author Bernhard Reiter <bernhard@intevation.de>
date Fri, 28 Sep 2018 10:17:11 +0200
parents 797063af6dc8
children b1489669ba52
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
1 <template>
829
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 826
diff changeset
2 <div v-if="selectedBottleneck || selectedMorph">
826
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
3 <div v-if="surveyList" class="ui-element card card-body shadow">
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
4 <div class="headline">
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
5 <h5>{{selectedBottleneck.get("objnam")}}</h5>
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
6 </div>
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
7 <ul class="list-group">
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
8 <li v-for="survey of surveyList.surveys" :key="survey.data_info"
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
9 class="list-group-item" @click.prevent="selectSurvey(survey)">
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
10 <a href="#" @click.prevent=""
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
11 >{{survey.date_info}}</a>
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
12 </li>
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
13 </ul>
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
14 <div @click="clearSelection"
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
15 class="float-left ui-element d-flex shadow morphtoolminus">
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
16 <i class="fa fa-minus morphtoolsminus"></i>
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
17 </div>
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
18 </div>
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
19 <div v-else @click="clearSelection" class="float-right ui-element d-flex shadow morphtool">
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
20 <i class="fa fa-object-ungroup"></i>
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
21 </div>
826
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
22 </div>
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
23 </template>
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
24
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
25 <style lang="scss">
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
26 .morphtool {
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
27 position: relative;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
28 background-color: white;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
29 padding: $small-offset;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
30 border-radius: $border-radius;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
31 margin-left: $offset;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
32 height: $icon-width;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
33 width: $icon-height;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
34 margin-bottom: $offset;
826
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
35 margin-right: $offset;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
36 z-index: 2;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
37 }
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
38 .morphtoolminus {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
39 position: relative;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
40 background-color: white;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
41 padding: $small-offset;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
42 border-radius: $border-radius;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
43 height: $icon-width;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
44 width: $icon-height;
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
45 z-index: 2;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
46 }
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
47 </style>
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
48
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
49 <script>
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
50 import { mapGetters, mapState } from "vuex";
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
51
826
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
52 import { displayError } from "../application/lib/errors.js";
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
53 import { HTTP } from "../application/lib/http";
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
54
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
55 export default {
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
56 name: "morphtool",
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
57 data() {
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
58 return {
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
59 surveyList: null
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
60 };
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
61 },
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
62 computed: {
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
63 ...mapGetters("application", ["drawMode"]),
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
64 ...mapState("mapstore", ["identifiedFeatures", "selectedMorph"]),
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
65 selectedBottleneck: function() {
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
66 if (this.identifiedFeatures) {
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
67 for (let feature of this.identifiedFeatures) {
836
0b994949a4a0 client: make Morphtool selection more robust
Bernhard Reiter <bernhard@intevation.de>
parents: 829
diff changeset
68 let id = feature.getId();
0b994949a4a0 client: make Morphtool selection more robust
Bernhard Reiter <bernhard@intevation.de>
parents: 829
diff changeset
69 if (id && id.replace(/[.][^.]*$/, "") === "bottlenecks") {
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
70 return feature;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
71 }
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
72 }
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
73 }
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
74 return null;
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
75 }
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
76 },
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
77 watch: {
826
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
78 selectedBottleneck: function(bottleneckFeature) {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
79 if (bottleneckFeature) {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
80 let bottleneckName = bottleneckFeature.get("objnam");
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
81 if (bottleneckName) {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
82 this.queryBottleneck(bottleneckName);
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
83 }
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
84 }
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
85 }
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
86 },
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
87 methods: {
826
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
88 queryBottleneck(name) {
836
0b994949a4a0 client: make Morphtool selection more robust
Bernhard Reiter <bernhard@intevation.de>
parents: 829
diff changeset
89 // DEBUG console.log("starting to query bottleneck", name);
826
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
90 HTTP.get("/surveys/" + name, {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
91 headers: {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
92 "X-Gemma-Auth": localStorage.getItem("token"),
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
93 "Content-type": "text/xml; charset=UTF-8"
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
94 }
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
95 })
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
96 .then(response => {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
97 this.surveyList = response.data;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
98 })
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
99 .catch(error => {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
100 this.surveyList = null;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
101 const { status, data } = error.response;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
102 displayError({
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
103 title: "Backend Error",
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
104 message: `${status}: ${data.message || data}`
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
105 });
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
106 });
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
107 },
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
108 selectSurvey(survey) {
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
109 this.$store.commit("mapstore/setSelectedMorph", survey);
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
110 this.surveyList = null;
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
111 },
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
112 clearSelection() {
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
113 this.$store.commit("mapstore/setIdentifiedFeatures", []);
826
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
114 this.$store.commit("mapstore/setSelectedMorph", null);
90a601884ff2 client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents: 823
diff changeset
115 this.surveyList = null;
823
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
116 }
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
117 }
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
118 };
d7ae7338872d client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff changeset
119 </script>