bachir/ouatterrir-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

map_popup for superpositions OK

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2023-09-12 12:20:35 +02:00
parent aae6d0c9d5
commit 5836d39a38
4 changed files with 125 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
src/components/ConcernementMapPopup.vue
View File

@@ -16,7 +16,7 @@ export default {
dom: null,
type: null,
concernement: null,
entite: null,
entites: null,
besoin: null,
reponse: null,
superposition: null,
@@ -24,32 +24,17 @@ export default {
}
},
created () {
// console.log(`popup created type: ${this.infos.type}`, this.infos);
if (this.infos.type === 'concernement') {
this.concernement = this.concernementsByID[this.infos.id];
} else if(this.infos.type === 'entite' || this.infos.type === 'entite_action') {
this.entite = this.allEntitesById[this.infos.id];
} else if (this.infos.type === 'besoin') {
this.besoin = this.allBesoinsById[this.infos.id];
} else if (this.infos.type === 'reponse') {
for (let i = 0; i < this.allBesoinsById[this.infos.bid].reponses.length; i++) {
if (this.allBesoinsById[this.infos.bid].reponses[i].id === this.infos.id) {
this.reponse = this.allBesoinsById[this.infos.bid].reponses[i];
break;
}
}
} else if (this.infos.type === 'superposition') {
this.superposition = {
concernement: this.concernementsByID[this.infos.cid],
entite: this.allEntitesById[this.infos.eid]
}
}
console.log(`popup created type: ${this.infos.type}`, this.infos);
this.parseInfos()
},
mounted () {
// console.log('APP onMounted')
this.dom = this.$refs['map-popup'];
window.addEventListener('mousemove', this.onMousemove);
},
beforeUnmount () {
window.removeEventListener('mousemove', this.onMousemove);
},
computed: {
...mapState(ConcernementsStore,['concernements']),
...mapState(ConcernementsStore,['concernementsByID']),
@@ -59,20 +44,43 @@ export default {
watch: {
infos: {
handler (n, o){
if (n.type === 'concernement') {
this.concernement = this.concernementsByID[n.id];
} else if(n.type === 'entite' || n.type === 'entite_action') {
this.entite = this.allEntitesById[this.infos.id];
} else if (n.type === 'besoin') {
this.besoin = this.allBesoinsById[this.infos.id];
} else if (n.type === 'reponse') {
}
this.parseInfos()
},
deep: true
},
},
methods: {
parseInfos(){
switch (this.infos.type) {
case 'concernement':
this.concernement = this.concernementsByID[this.infos.cid];
break;
case 'entite':
case 'entite_action':
this.entites = [this.allEntitesById[this.infos.id]];
break;
case 'besoin':
this.besoin = this.allBesoinsById[this.infos.id];
break;
case 'reponse':
this.besoin = this.allBesoinsById[this.infos.id];
for (let i = 0; i < this.allBesoinsById[this.infos.bid].reponses.length; i++) {
if (this.allBesoinsById[this.infos.bid].reponses[i].id === this.infos.id) {
this.reponse = this.allBesoinsById[this.infos.bid].reponses[i];
break;
}
}
break;
case 'superposition':
this.concernement = this.concernementsByID[this.infos.cid];
// this.entite = this.allEntitesById[this.infos.eid];
this.entites = [];
for (let eid of this.infos.eids) {
this.entites.push(this.allEntitesById[eid])
}
break;
}
},
onMousemove(e){
// console.log(`popup move type: ${this.infos.type}`);
let v = "top";
@@ -124,23 +132,29 @@ export default {
<div id="map-popup" ref="map-popup">
<div class="popup-content-wrapper">
<section v-if="infos.type === 'concernement'" class="concernement-map-popup">
<h1>{{ concernement.title }}</h1>
<ul class="icons" v-if="concernement.has_puissancedagir || concernement.has_proximite || concernement.has_superposition || concernement.has_agissantes || concernement.has_doleance">
<li v-if="concernement.has_puissancedagir" ><span class="icon puissancedagir"></span></li>
<li v-if="concernement.has_proximite" ><span class="icon proximite"></span></li>
<li v-if="concernement.has_superposition" ><span class="icon superposition"></span></li>
<li v-if="concernement.has_agissantes" ><span class="icon action"></span></li>
<li v-if="concernement.has_doleance" ><span class="icon doleancer"></span></li>
</ul>
<section v-if="infos.type === 'concernement' || infos.type === 'superposition'" class="concernement-map-popup">
<div class="concernement-map-popup-content">
<h1>{{ concernement.title }}</h1>
<ul class="icons" v-if="concernement.has_puissancedagir || concernement.has_proximite || concernement.has_superposition || concernement.has_agissantes || concernement.has_doleance">
<li v-if="concernement.has_puissancedagir" ><span class="icon puissancedagir"></span></li>
<li v-if="concernement.has_proximite" ><span class="icon proximite"></span></li>
<li v-if="concernement.has_superposition" ><span class="icon superposition"></span></li>
<li v-if="concernement.has_agissantes" ><span class="icon action"></span></li>
<li v-if="concernement.has_doleance" ><span class="icon doleancer"></span></li>
</ul>
</div>
<div v-if="(infos.type === 'concernement' || infos.type === 'superposition') && concernement.has_recit" class="concernement-map-popup-recit">
<svg-icon type="mdi" :path="headphones_path"></svg-icon>
</div>
</section>
<section v-if="infos.type === 'concernement' && concernement.has_recit" class="concernement-map-popup-recit">
<svg-icon type="mdi" :path="headphones_path"></svg-icon>
<section v-if="infos.type === 'entite' || infos.type === 'entite_action' || infos.type === 'superposition'" class="entite-map-popup">
<h1
v-for="(entite, index) of entites"
:key="index"
>⋅ {{ entite.entite.title }}</h1>
</section>
<section v-if="infos.type === 'entite' || infos.type === 'entite_action'" class="entite-map-popup">
<h1>{{ entite.entite.title }}</h1>
</section>
<section v-if="infos.type === 'besoin'" class="besoin-map-popup">
<div v-html="besoin.description"></div>
</section>