Mercurial > gemma

comparison client/src/identify/Identify.vue @ 1123:d9e6a1f6f394 store-refactoring

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
moved all collapse flags for UI elements to store UI elements can now be expanded/collapsed via the application store
author Markus Kottlaender <markus@intevation.de>
date Tue, 06 Nov 2018 13:00:17 +0100
parents 595654ad3f66
children 2fda33d55d81
comparison
equal deleted inserted replaced
1122:a4c74a95c177 1123:d9e6a1f6f394
1 <template> 1 <template>
2 <div class="identifymenu"> 2 <div class="identifymenu">
3 <div @click="collapse" class="d-flex flex-column ui-element minimizer"> 3 <div @click="$store.commit('application/showIdentify', !showIdentify)" class="d-flex flex-column ui-element minimizer">
4 <div :class="infoStyle"> 4 <div :class="infoStyle">
5 <i class="fa fa-info"></i> 5 <i class="fa fa-info"></i>
6 </div> 6 </div>
7 </div> 7 </div>
8 <div :class="identifyStyle"> 8 <div :class="identifyStyle">
9 <div v-if="!collapsed" class="card-body"> 9 <div v-if="showIdentify" class="card-body">
10 <div class="headline"> 10 <div class="headline">
11 <h4 class="card-title">Identified</h4> 11 <h4 class="card-title">Identified</h4>
12 </div> 12 </div>
13 <hr> 13 <hr>
14 <div class="d-flex flex-column features"> 14 <div class="d-flex flex-column features">
95 * 95 *
96 * Author(s): 96 * Author(s):
97 * Thomas Junk <thomas.junk@intevation.de> 97 * Thomas Junk <thomas.junk@intevation.de>
98 * Bernhard E. Reiter <bernhard.reiter@intevation.de> 98 * Bernhard E. Reiter <bernhard.reiter@intevation.de>
99 */ 99 */
100 import { mapState } from "vuex"; 100 import { mapState, mapGetters } from "vuex";
101 import { mapGetters } from "vuex";
102 101
103 export default { 102 export default {
104 name: "identify", 103 name: "identify",
105 data() {
106 return {
107 collapsed: true
108 };
109 },
110 computed: { 104 computed: {
111 ...mapGetters("application", ["versionStr"]), 105 ...mapGetters("application", ["versionStr"]),
106 ...mapState("application", ["showIdentify"]),
112 ...mapState("map", ["identifiedFeatures", "currentMeasurement"]), 107 ...mapState("map", ["identifiedFeatures", "currentMeasurement"]),
113 identifyStyle() { 108 identifyStyle() {
114 return { 109 return {
115 "ui-element": true, 110 "ui-element": true,
116 card: true, 111 card: true,
117 identify: true, 112 identify: true,
118 shadow: true, 113 shadow: true,
119 identifyexpanded: !this.collapsed, 114 identifyexpanded: this.showIdentify,
120 identifycollapsed: this.collapsed 115 identifycollapsed: !this.showIdentify
121 }; 116 };
122 }, 117 },
123 infoStyle() { 118 infoStyle() {
124 return { 119 return {
125 info: true, 120 info: true,
127 this.identifiedFeatures && this.identifiedFeatures.length > 0 122 this.identifiedFeatures && this.identifiedFeatures.length > 0
128 }; 123 };
129 } 124 }
130 }, 125 },
131 methods: { 126 methods: {
132 collapse() {
133 this.collapsed = !this.collapsed;
134 },
135 prepareProperties(feature) { 127 prepareProperties(feature) {
136 // return dict object with propertyname:plainvalue prepared for display 128 // return dict object with propertyname:plainvalue prepared for display
137 var properties = feature.getProperties(); 129 var properties = feature.getProperties();
138 delete properties[feature.getGeometryName()]; 130 delete properties[feature.getGeometryName()];
139 return properties; 131 return properties;