puissance agir hover events both ways (map <-> cartouche) are done

This commit is contained in:
2023-07-06 22:43:27 +02:00
parent 19e61bbcd7
commit 213f151557
5 changed files with 50 additions and 7 deletions

View File

@@ -39,14 +39,28 @@ export default {
},
created () {
console.log(`puissance d'agir content created, id: ${this.id}, opened_concernement:`,this.opened_concernement);
},
mounted() {
},
methods: {
...mapActions(CommonStore,['setHoverElmt']),
onClickBesoin(id){
console.log("onClickBesoin", id);
this.opened_besoin_id = id === this.opened_besoin_id ? null : id;
},
besoinClass(id){
return this.opened_besoin_id === id ? "opened" : "";
},
onHoverItem(type, pid, bid, rid){
console.log(`onHoverItem type:${type}, paper_id:${pid} bid:${bid}, rid:${rid}`);
this.setHoverElmt({
type: type,
paper_id: pid,
id: rid ? rid : bid,
bid: rid ? bid : null,
no_popup: true
});
}
},
components: {
@@ -74,6 +88,7 @@ export default {
class="besoin"
:id="besoin.id"
:class="besoinClass(besoin.id)"
@mouseover="onHoverItem('besoin', besoin.paper_id, besoin.id)"
>
<svg-icon
type="mdi"
@@ -81,12 +96,11 @@ export default {
class="open-btn"
@click="onClickBesoin(besoin.id)"
></svg-icon>
<header>
<header @click="onClickBesoin(besoin.id)">
<label
:class="{ 'hover': hover_elmt
&& (hover_elmt.type === 'besoin' || hover_elmt.type === 'reponse')
&& (hover_elmt.id === besoin.id || hover_elmt.bid === besoin.id) }"
@click="onClickBesoin(besoin.id)"
>
<svg-icon
type="mdi"
@@ -102,6 +116,7 @@ export default {
:key="reponse.id"
class="reponse"
:id="reponse.id"
@mouseover.stop="onHoverItem('reponse', reponse.paper_id, besoin.id, reponse.id)"
>
<label
:class="{ 'hover': hover_elmt