From e717b8ed76a9fa91899dc905cdab2acd597f342a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Timoth=C3=A9e?= <tpoussard@neogeo.fr> Date: Tue, 31 May 2022 18:18:52 +0200 Subject: [PATCH] retrieve opacity from request --- .../FeatureType/SymbologySelector.vue | 6 ++--- .../FeatureType/FeatureTypeSymbology.vue | 24 +++++++++++++------ 2 files changed, 20 insertions(+), 10 deletions(-) diff --git a/src/components/FeatureType/SymbologySelector.vue b/src/components/FeatureType/SymbologySelector.vue index 83bb0653..cefaec73 100644 --- a/src/components/FeatureType/SymbologySelector.vue +++ b/src/components/FeatureType/SymbologySelector.vue @@ -18,10 +18,10 @@ <label>Opacité <span>(%)</span></label> <div class="range-container"> <input + v-model="form.opacity" type="range" min="0" max="1" - v-model="form.opacity" step="0.01" > <output class="range-output-bubble"> @@ -83,8 +83,8 @@ export default { default: 'circle' }, initOpacity: { - type: Number, - default: 1 + type: String, + default: '1' }, geomType: { type: String, diff --git a/src/views/FeatureType/FeatureTypeSymbology.vue b/src/views/FeatureType/FeatureTypeSymbology.vue index 39ac0a99..dac30e57 100644 --- a/src/views/FeatureType/FeatureTypeSymbology.vue +++ b/src/views/FeatureType/FeatureTypeSymbology.vue @@ -50,6 +50,7 @@ v-if="feature_type" :init-color="feature_type.color" :init-icon="feature_type.icon" + :init-opacity="feature_type.opacity" :geom-type="feature_type.geom_type" @set="setDefaultStyle" /> @@ -98,6 +99,7 @@ feature_type.colors_style.value.icons[option] : null " + :init-opacity="feature_type.colors_style.opacity" :geom-type="feature_type.customfield_set.geomType" @set="setColorsStyle" /> @@ -253,17 +255,25 @@ export default { }, setDefaultStyle(e) { - const value = e.value; - this.form.color = value.color.value; - this.form.icon = value.icon; + const { color, icon, opacity } = e.value; + console.log({ color, icon, opacity }); + console.log('this.form', this.form); + this.form.color = color.value; + this.form.icon = icon; + this.form.opacity = opacity; }, setColorsStyle(e) { const { name, value } = e; - this.form.colors_style.colors[name] = value.color; - this.form.colors_style.icons[name] = value.icon; - this.form.colors_style.value.colors[name] = value.color; - this.form.colors_style.value.icons[name] = value.icon; + const { color, icon, opacity } = value; + console.log({ color, icon, opacity }); + console.log(this.form.colors_style.colors); + console.log(this.form.colors_style.colors[name]); + this.form.colors_style.colors[name] = color; + this.form.colors_style.icons[name] = icon; + //this.form.colors_style.icons[name] = icon; + this.form.colors_style.value.colors[name] = color; + this.form.colors_style.value.icons[name] = icon; }, sendFeatureSymbology() { -- GitLab