Mercurial > gemma
changeset 4219:c904e339f661
merge with stylesconfig
| author | Fadi Abbud <fadi.abbud@intevation.de> |
|---|---|
| date | Fri, 16 Aug 2019 15:35:02 +0200 |
| parents | cbc75527916f (current diff) d3939b32738d (diff) |
| children | d8b736ba3f32 |
| files | |
| diffstat | 5 files changed, 395 insertions(+), 119 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/map/Map.vue Fri Aug 16 14:43:47 2019 +0200 +++ b/client/src/components/map/Map.vue Fri Aug 16 15:35:02 2019 +0200 @@ -271,32 +271,93 @@ ); } // load configured bottleneck colors - HTTP.get("/system/style/Bottlenecks/stroke", { + HTTP.get("/system/settings", { headers: { "X-Gemma-Auth": localStorage.getItem("token") } }) .then(response => { - let btlnStrokeC = response.data.code; - HTTP.get("/system/style/Bottlenecks/fill", { - headers: { "X-Gemma-Auth": localStorage.getItem("token") } - }) - .then(response => { - let btlnFillC = response.data.code; - var newStyle = new Style({ - stroke: new Stroke({ - color: btlnStrokeC, - width: 4 - }), - fill: new Fill({ - color: btlnFillC - }) - }); - this.layers.get("BOTTLENECKS").setStyle(newStyle); - this.$store.commit("gauges/deleteNashSutcliffeCache"); - this.$store.dispatch("map/refreshLayers"); - }) - .catch(error => { - console.log(error); + let btlnStrokeC = response.data.bottlenecks_stroke, + btlnFillC = response.data.bottlenecks_fill, + strFillC = response.data.stretches_fill, + strStrokeC = response.data.stretches_stroke, + secStrokeC = response.data.sections_stroke, + secFillC = response.data.sections_fill, + fwd1StrokeC = response.data.fairwaydimensionslos1_stroke, + fwd1FillC = response.data.fairwaydimensionslos1_fill, + fwd2StrokeC = response.data.fairwaydimensionslos2_stroke, + fwd2FillC = response.data.fairwaydimensionslos2_fill, + fwd3StrokeC = response.data.fairwaydimensionslos3_stroke, + fwd3FillC = response.data.fairwaydimensionslos3_fill, + wwpStokeC = response.data.waterwayprofiles_stroke; + let btlnStyle = new Style({ + stroke: new Stroke({ + color: btlnStrokeC, + width: 4 + }), + fill: new Fill({ + color: btlnFillC + }) + }), + strStyle = new Style({ + stroke: new Stroke({ + color: strStrokeC, + width: 2 + }), + fill: new Fill({ + color: strFillC + }) + }), + secStyle = new Style({ + stroke: new Stroke({ + color: secStrokeC, + width: 5 + }), + fill: new Fill({ + color: secFillC + }) + }), + fwd1Style = new Style({ + stroke: new Stroke({ + color: fwd1StrokeC, + width: 2 + }), + fill: new Fill({ + color: fwd1FillC + }) + }), + fwd2Style = new Style({ + stroke: new Stroke({ + color: fwd2StrokeC, + width: 2 + }), + fill: new Fill({ + color: fwd2FillC + }) + }), + fwd3Style = new Style({ + stroke: new Stroke({ + color: fwd3StrokeC, + width: 2 + }), + fill: new Fill({ + color: fwd3FillC + }) + }), + wwpStyle = new Style({ + stroke: new Stroke({ + color: wwpStokeC, + lineDash: [5, 5], + width: 2 + }) }); + this.layers.get("WATERWAYPROFILES").setStyle(wwpStyle); + this.layers.get("FAIRWAYDIMENSIONSLOS1").setStyle(fwd1Style); + this.layers.get("FAIRWAYDIMENSIONSLOS2").setStyle(fwd2Style); + this.layers.get("FAIRWAYDIMENSIONSLOS3").setStyle(fwd3Style); + this.layers.get("SECTIONS").setStyle(secStyle); + this.layers.get("STRETCHES").setStyle(strStyle); + this.layers.get("BOTTLENECKS").setStyle(btlnStyle); + this.$store.commit("gauges/deleteNashSutcliffeCache"); + this.$store.dispatch("map/refreshLayers"); }) .catch(error => { console.log(error);
--- a/client/src/components/systemconfiguration/ColorSettings.vue Fri Aug 16 14:43:47 2019 +0200 +++ b/client/src/components/systemconfiguration/ColorSettings.vue Fri Aug 16 15:35:02 2019 +0200 @@ -2,36 +2,54 @@ <div class="d-flex flex-column py-4"> <div class="px-3 container-fluid"> <div class="row"> - <div class="col-sm-2"> - <div class="card"> - <div class="card-header small"> - <translate>Bottleneck Fill Color</translate> + <div v-for="f in features" :key="f.key" class="col-sm-2 mt-2"> + <div v-if="f.fillColor" class="card"> + <div class="card-header small text-center"> + <translate>{{ f.name }} Fill Color</translate> </div> <div class="card-body p-0"> - <chrome-picker v-model="fillColor" /> + <chrome-picker v-model="f.fillColor" /> + </div> + </div> + <div class="mt-2"> + <div v-if="f.strokeColor" class="card"> + <div class="card-header small text-center"> + <translate>{{ f.name }} Border Color</translate> + </div> + <div class="card-body p-0"> + <chrome-picker v-model="f.strokeColor" /> + </div> </div> </div> + <div class="mt-2"> + <a + @click.prevent="submit(f)" + class="btn btn-info btn-sm text-white" + > + <translate>Send</translate> + </a> + <a + @click.prevent="reset(f)" + class="btn btn-outline-info btn-sm ml-2" + > + <translate>Reset to defaults</translate> + </a> + </div> </div> - <div class="col-sm-2"> - <div class="card"> - <div class="card-header small"> - <translate>Bottleneck Border Color</translate> - </div> - <div class="card-body p-0"> - <chrome-picker v-model="strokeColor" /> - </div> + <div class="col-sm-2 px-3 align-self-end"> + <a @click.prevent="resetAll" class="btn btn-outline-info btn-sm w-100" + >Reset all to defaults + </a> + <div class="d-flex mt-2"> + <a + @click.prevent="saveAll" + class="btn btn-info btn-sm text-white w-100" + >Send all + </a> </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> @@ -67,100 +85,260 @@ * Markus Kottländer <markus@intevation.de> */ import { Chrome, Compact } from "vue-color"; -import { HTTP } from "@/lib/http"; -import { displayError, displayInfo } from "@/lib/errors"; import defaults from "./defaults"; +import { mapState } from "vuex"; +import { displayInfo } from "@/lib/errors"; + +const initSColor = "#000000", + initFColor = "#000000"; export default { name: "colorsettings", data() { return { sent: false, - strokeColor: { r: 0, g: 0, b: 0, a: 1.0 }, - fillColor: { r: 0, g: 0, b: 0, a: 1.0 }, - currentConfig: null + currentConfig: null, + features: [ + { + name: "Bottlenecks", + fillColor: initSColor, + strokeColor: initSColor + }, + { + name: "Stretches", + fillColor: initFColor, + strokeColor: initSColor + }, + { + name: "Sections", + fillColor: initFColor, + strokeColor: initSColor + }, + { + name: "LOS_1", + fillColor: initFColor, + strokeColor: initSColor + }, + { + name: "LOS_2", + fillColor: initFColor, + strokeColor: initSColor + }, + { + name: "LOS_3", + fillColor: initFColor, + strokeColor: initSColor + }, + { + name: "Waterway profiles", + strokeColor: initSColor + } + ] }; }, + computed: { + ...mapState("application", ["config"]) + }, components: { "chrome-picker": Chrome, "compact-picker": Compact }, methods: { - reset() { - this.strokeColor = defaults.feature_colours_bottlenecks_stroke; - this.fillColor = defaults.feature_colours_bottlenecks_fill; + saveAll() { + this.features.forEach(f => { + this.submit(f); + }); + }, + resetAll() { + this.features.forEach(f => { + this.reset(f); + }); }, - submit() { - Promise.all([ - HTTP.put( - "/system/style/Bottlenecks/stroke", - this.strokeColor.rgba || this.strokeColor, - { - headers: { - "X-Gemma-Auth": localStorage.getItem("token"), - "Content-type": "application/json" - } + reset(feature) { + switch (feature.name) { + case "Bottlenecks": { + feature.strokeColor = defaults.feature_colours_bottlenecks_stroke; + feature.fillColor = defaults.feature_colours_bottlenecks_fill; + break; + } + case "Stretches": { + feature.strokeColor = defaults.feature_colours_stretches_stroke; + feature.fillColor = defaults.feature_colours_stretches_fill; + break; + } + case "Sections": { + feature.strokeColor = defaults.feature_colours_sections_stroke; + feature.fillColor = defaults.feature_colours_sections_fill; + break; + } + case "LOS_1": { + feature.strokeColor = + defaults.feature_colours_fairwaydimensionslos1_stroke; + feature.fillColor = + defaults.feature_colours_fairwaydimensionslos1_fill; + break; + } + case "LOS_2": { + feature.strokeColor = + defaults.feature_colours_fairwaydimensionslos2_stroke; + feature.fillColor = + defaults.feature_colours_fairwaydimensionslos2_fill; + break; + } + case "LOS_3": { + feature.strokeColor = + defaults.feature_colours_fairwaydimensionslos3_stroke; + feature.fillColor = + defaults.feature_colours_fairwaydimensionslos3_fill; + break; + } + case "Waterway profiles": { + feature.strokeColor = + defaults.feature_colours_waterwayprofiles_stroke; + break; + } + } + }, + submit(feature) { + let strokeC = feature.strokeColor.hex8 || feature.strokeColor, + fillC = feature.fillColor + ? feature.fillColor.hex8 || feature.fillColor + : initFColor; + let noChangeMsg = name => { + displayInfo({ + title: name + ":", + message: this.$gettext("No style-changes") + }); + }; + switch (feature.name) { + case "Bottlenecks": { + // send values only if they changed + if ( + strokeC !== this.config.bottlenecks_stroke || + fillC !== this.config.bottlenecks_fill + ) { + this.$store + .dispatch("application/saveConfig", { + bottlenecks_stroke: strokeC, + bottlenecks_fill: fillC + }) + .finally(() => this.$store.dispatch("application/loadConfig")); + } else { + noChangeMsg(feature.name); } - ), - HTTP.put( - "/system/style/Bottlenecks/fill", - this.fillColor.rgba || this.fillColor, - { - headers: { - "X-Gemma-Auth": localStorage.getItem("token"), - "Content-type": "application/json" - } + break; + } + case "Stretches": { + if ( + strokeC !== this.config.stretches_stroke || + fillC !== this.config.stretches_fill + ) { + this.$store + .dispatch("application/saveConfig", { + stretches_stroke: strokeC, + stretches_fill: fillC + }) + .finally(() => this.$store.dispatch("application/loadConfig")); + } else { + noChangeMsg(feature.name); + } + break; + } + case "Sections": { + if ( + strokeC !== this.config.sections_stroke || + fillC !== this.config.sections_fill + ) { + this.$store + .dispatch("application/saveConfig", { + sections_stroke: strokeC, + sections_fill: fillC + }) + .finally(() => this.$store.dispatch("application/loadConfig")); + } else { + noChangeMsg(feature.name); + } + break; + } + case "LOS_1": { + if ( + strokeC !== this.config.fairwaydimensionslos1_stroke || + fillC !== this.config.fairwaydimensionslos1_fill + ) { + this.$store + .dispatch("application/saveConfig", { + fairwaydimensionslos1_stroke: strokeC, + fairwaydimensionslos1_fill: fillC + }) + .finally(() => this.$store.dispatch("application/loadConfig")); + } else { + noChangeMsg(feature.name); } - ) - ]) - .then(() => { - displayInfo({ - message: "Configuration saved!" - }); - }) - .catch(error => { - const { status, data } = error.response; - displayError({ - title: "Backend Error", - message: `${status}: ${data.message || data}` - }); - }); + break; + } + case "LOS_2": { + if ( + strokeC !== this.config.fairwaydimensionslos2_stroke || + fillC !== this.config.fairwaydimensionslos2_fill + ) { + this.$store + .dispatch("application/saveConfig", { + fairwaydimensionslos2_stroke: strokeC, + fairwaydimensionslos2_fill: fillC + }) + .finally(() => this.$store.dispatch("application/loadConfig")); + } else { + noChangeMsg(feature.name); + } + break; + } + case "LOS_3": { + if ( + strokeC !== this.config.fairwaydimensionslos3_stroke || + fillC !== this.config.fairwaydimensionslos3_fill + ) { + this.$store + .dispatch("application/saveConfig", { + fairwaydimensionslos3_stroke: strokeC, + fairwaydimensionslos3_fill: fillC + }) + .finally(() => this.$store.dispatch("application/loadConfig")); + } else { + noChangeMsg(feature.name); + } + break; + } + case "Waterway profiles": { + if (strokeC !== this.config.waterwayprofiles_stroke) { + this.$store + .dispatch("application/saveConfig", { + waterwayprofiles_stroke: strokeC + }) + .finally(() => { + this.$store.dispatch("application/loadConfig"); + }); + } else { + noChangeMsg(feature.name); + } + break; + } + } } }, mounted() { - HTTP.get("/system/style/Bottlenecks/stroke", { - headers: { - "X-Gemma-Auth": localStorage.getItem("token"), - "Content-type": "application/json" - } - }) - .then(response => { - this.strokeColor = response.data.colour; - }) - .catch(error => { - const { status, data } = error.response; - displayError({ - title: this.$gettext("Backend Error"), - message: `${status}: ${data.message || data}` - }); - }); - - HTTP.get("/system/style/Bottlenecks/fill", { - headers: { - "X-Gemma-Auth": localStorage.getItem("token"), - "Content-type": "application/json" - } - }) - .then(response => { - this.fillColor = response.data.colour; - }) - .catch(error => { - const { status, data } = error.response; - displayError({ - title: this.$gettext("Backend Error"), - message: `${status}: ${data.message || data}` - }); - }); + this.features[0].strokeColor = this.config.bottlenecks_stroke; + this.features[0].fillColor = this.config.bottlenecks_fill; + this.features[1].strokeColor = this.config.stretches_stroke; + this.features[1].fillColor = this.config.stretches_fill; + this.features[2].strokeColor = this.config.sections_stroke; + this.features[2].fillColor = this.config.sections_fill; + this.features[3].strokeColor = this.config.fairwaydimensionslos1_stroke; + this.features[3].fillColor = this.config.fairwaydimensionslos1_fill; + this.features[4].strokeColor = this.config.fairwaydimensionslos2_stroke; + this.features[4].fillColor = this.config.fairwaydimensionslos2_fill; + this.features[5].strokeColor = this.config.fairwaydimensionslos3_stroke; + this.features[5].fillColor = this.config.fairwaydimensionslos3_fill; + this.features[6].strokeColor = this.config.waterwayprofiles_stroke; } }; </script>
--- a/client/src/components/systemconfiguration/defaults.js Fri Aug 16 14:43:47 2019 +0200 +++ b/client/src/components/systemconfiguration/defaults.js Fri Aug 16 15:35:02 2019 +0200 @@ -12,6 +12,17 @@ "-2:#06b100,-1.9,-1.8,-1.7,-1.6,-1.5,-1.4,-1.3,-1.2,-1.1,-1:#1cc68e,-0.9,-0.8,-0.7,-0.6,-0.5,-0.4,-0.3,-0.2,-0.1,0:#c2c2c2,0.1,0.2,0.3,0.4,0.5,0.6,0.7,0.8,0.9,1:#fff01a,1.1,1.2,1.3,1.4,1.5,1.6,1.7,1.8,1.9,2:#f80012", ecdis_wms_url: "https://service.d4d-portal.info/wms/", ecdis_wms_params: '{"LAYERS": "d4d", "VERSION": "1.1.1", "TILED": true}', - feature_colours_bottlenecks_stroke: { r: 250, g: 40, b: 255, a: 1 }, - feature_colours_bottlenecks_fill: { r: 255, g: 37, b: 196, a: 0.14 } + feature_colours_bottlenecks_stroke: "#fa28ff", + feature_colours_bottlenecks_fill: "#ff25c424", + feature_colours_stretches_stroke: "#fac800cc", + feature_colours_stretches_fill: "#fac80a4d", + feature_colours_sections_stroke: "#ff960acc", + feature_colours_sections_fill: "#ff96004d", + feature_colours_fairwaydimensionslos1_stroke: "#0000ffcc", + feature_colours_fairwaydimensionslos1_fill: "#f0e60033", + feature_colours_fairwaydimensionslos2_stroke: "#0000ffe6", + feature_colours_fairwaydimensionslos2_fill: "#f0e6001a", + feature_colours_fairwaydimensionslos3_stroke: "#0000ff", + feature_colours_fairwaydimensionslos3_fill: "#ffffff66", + feature_colours_waterwayprofiles_stroke: "#0000ff80" };
--- a/schema/default_sysconfig.sql Fri Aug 16 14:43:47 2019 +0200 +++ b/schema/default_sysconfig.sql Fri Aug 16 15:35:02 2019 +0200 @@ -37,5 +37,18 @@ INSERT INTO sys_admin.system_config VALUES ('gm_forecast_vs_reality_nsc_72h', -12.5); INSERT INTO sys_admin.system_config VALUES ('morphology_classbreaks', '1:#ff00dd,1.5,1.7,1.9,2.1,2.3,2.5:#f25f20,2.7,2.9,3.1:#f7e40e,3.3,3.5,4:#8ad51a,4.5,5,5.5,6,6.5,7:#1414ff'); INSERT INTO sys_admin.system_config VALUES ('morphology_classbreaks_compare', '-2:#06b100,-1.9,-1.8,-1.7,-1.6,-1.5,-1.4,-1.3,-1.2,-1.1,-1:#1cc68e,-0.9,-0.8,-0.7,-0.6,-0.5,-0.4,-0.3,-0.2,-0.1,0:#c2c2c2,0.1,0.2,0.3,0.4,0.5,0.6,0.7,0.8,0.9,1:#fff01a,1.1,1.2,1.3,1.4,1.5,1.6,1.7,1.8,1.9,2:#f80012'); +INSERT INTO sys_admin.system_config VALUES ('bottlenecks_stroke','#fa28ff'); +INSERT INTO sys_admin.system_config VALUES ('bottlenecks_fill','#ff25c424'); +INSERT INTO sys_admin.system_config VALUES ('stretches_stroke','#fac800cc'); +INSERT INTO sys_admin.system_config VALUES ('stretches_fill','#fac80a4d'); +INSERT INTO sys_admin.system_config VALUES ('sections_stroke','#ff960acc'); +INSERT INTO sys_admin.system_config VALUES ('sections_fill','#ff96004d'); +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos1_stroke','#0000ffcc'); +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos1_fill','#f0e60033'); +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos2_stroke','#0000ffe6'); +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos2_fill','#f0e6001a'); +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos3_stroke','#0000ff'); +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos3_fill','#ffffff66'); +INSERT INTO sys_admin.system_config VALUES ('waterwayprofiles_stroke','#0000ff80'); COMMIT;
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/schema/updates/1108/01.more_system_config.sql Fri Aug 16 15:35:02 2019 +0200 @@ -0,0 +1,13 @@ +INSERT INTO sys_admin.system_config VALUES ('bottlenecks_stroke','#fa28ff') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('bottlenecks_fill','#ff25c424') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('stretches_stroke','#fac800cc') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('stretches_fill','#fac80a4d') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('sections_stroke','#ff960acc') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('sections_fill','#ff96004d') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos1_stroke','#0000ffcc') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos1_fill','#f0e60033') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos2_stroke','#0000ffe6') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos2_fill','#f0e6001a') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos3_stroke','#0000ff') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('fairwaydimensionslos3_fill','#ffffff66') ON CONFLICT (config_key) DO NOTHING; +INSERT INTO sys_admin.system_config VALUES ('waterwayprofiles_stroke','#0000ff80') ON CONFLICT (config_key) DO NOTHING;