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

some css on doleance content, started mouse events

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2023-06-07 16:53:19 +02:00
parent 0b9a1ae946
commit c0028a636b
4 changed files with 100 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/assets/main.scss
View File

@@ -82,6 +82,7 @@ body{
}
#content{
section.concernement{
background-color: rgba(255, 255, 255, 0.9);
box-sizing: border-box;
@@ -99,6 +100,12 @@ body{
font-size: 0.882em;
padding: 0 0 1em 0;
}
ul, li{
padding:0; margin:0;
list-style: none;
}
>header{
display: flex;
height: 8rem;
@@ -110,27 +117,35 @@ body{
// padding: 0 0 1em 0;
// flex-grow: auto;
}
h3{
font-weight: 400;
font-size: 1.2em;
}
h2{
font-weight: 400;
font-size: 1.512em;
}
h3{
font-weight: 400;
font-size: 1.2em;
}
}
section>div{
h3{
font-weight: 400;
font-size: 1.2em;
}
h4{
font-weight: 400;
font-size: 1.2em;
}
h5{
font-weight: 400;
font-size: 1.1em;
}
section>div, p{
font-size: 1em;
font-weight: 300;
}
// PUISSANCE D'AGIR
section.content-besoins{
ul, li{
padding:0; margin:0;
list-style: none;
}
li.besoin{
position: relative;
label.mdi:before{
@@ -190,6 +205,23 @@ body{
margin-bottom: 1em;
}
}
section.content-doleances{
label{
margin:0;
padding:0 0 0.5em 0;
}
p{
margin:0;
padding:0 0 0.5em 0;
}
ul{
// padding:0 0 0 1em;
}
}
}
}

88
src/components/ConcernementMapItem.vue
View File

@@ -1330,26 +1330,28 @@ export default {
let cam = new paper.Path({
strokeColor: '#fff',
strokeWidth: 2,
fillColor: "rgba(255, 255, 255, 0.4)"
fillColor: "rgba(255, 255, 255, 0.4)",
item_type: 'doleance_step',
item_id: 'lenquete'
});
cam.add({x: this.pos.x + n, y: this.pos.y + n});
cam.lineTo({x: this.pos.x + m , y: this.pos.y + m});
cam.arcTo({x: this.pos.x + p, y: this.pos.y + o}, {x: this.pos.x, y: this.pos.y + r});
cam.lineTo({x: this.pos.x, y: this.pos.y + dr});
cam.arcTo({x: this.pos.x + p_d, y: this.pos.y + o_d}, {x: this.pos.x + n, y: this.pos.y + n});
cam.add({x: this.pos.x , y: this.pos.y + dr});
cam.lineTo({x: this.pos.x, y: this.pos.y + r});
cam.arcTo({x: this.pos.x - p, y: this.pos.y + o}, {x: this.pos.x - m, y: this.pos.y + m});
cam.lineTo({x: this.pos.x - n, y: this.pos.y + n});
cam.arcTo({x: this.pos.x - p_d, y: this.pos.y + o_d}, {x: this.pos.x , y: this.pos.y + dr});
enquete.addChild(cam)
// texte
enquete.addChild(new paper.PointText({
point: {
x:this.pos.x + Math.sin(22.5*(Math.PI/180)) * r*0.75,
y:this.pos.y + Math.cos(22.5*(Math.PI/180)) * r*0.75
},
content: doleance['lenquete'],
fontSize: fontsize,
fillColor: '#fff',
justification: 'center'
}));
// enquete.addChild(new paper.PointText({
// point: {
// x:this.pos.x + Math.sin(22.5*(Math.PI/180)) * r*0.75,
// y:this.pos.y + Math.cos(22.5*(Math.PI/180)) * r*0.75
// },
// content: doleance['lenquete'],
// fontSize: fontsize,
// fillColor: '#fff',
// justification: 'center',
// locked: true
// }));
g.addChild(enquete);
//
@@ -1360,27 +1362,31 @@ export default {
});
// camenbert
let rescam = new paper.Path({
name: 'resolution',
item_type: 'doleance_step',
item_id: 'probleme_initial_resolu',
strokeColor: '#fff',
strokeWidth: 2,
fillColor: "rgba(255, 255, 255, 0.4)"
fillColor: "rgba(255, 255, 255, 0.4)",
});
rescam.add({x: this.pos.x , y: this.pos.y + dr});
rescam.lineTo({x: this.pos.x, y: this.pos.y + r});
rescam.arcTo({x: this.pos.x - p, y: this.pos.y + o}, {x: this.pos.x - m, y: this.pos.y + m});
rescam.lineTo({x: this.pos.x - n, y: this.pos.y + n});
rescam.arcTo({x: this.pos.x - p_d, y: this.pos.y + o_d}, {x: this.pos.x , y: this.pos.y + dr});
rescam.add({x: this.pos.x + n, y: this.pos.y + n});
rescam.lineTo({x: this.pos.x + m , y: this.pos.y + m});
rescam.arcTo({x: this.pos.x + p, y: this.pos.y + o}, {x: this.pos.x, y: this.pos.y + r});
rescam.lineTo({x: this.pos.x, y: this.pos.y + dr});
rescam.arcTo({x: this.pos.x + p_d, y: this.pos.y + o_d}, {x: this.pos.x + n, y: this.pos.y + n});
resolution.addChild(rescam)
// texte
resolution.addChild(new paper.PointText({
point: {
x:this.pos.x - Math.sin(22.5*(Math.PI/180)) * r*0.75,
y:this.pos.y + Math.cos(22.5*(Math.PI/180)) * r*0.75
},
content: doleance['probleme_initial_resolu'] ? doleance['oui_nouvelle_situation'] : doleance['non_adresse_doleance'],
fontSize: fontsize,
fillColor: '#fff',
justification: 'center'
}));
// resolution.addChild(new paper.PointText({
// point: {
// x:this.pos.x - Math.sin(22.5*(Math.PI/180)) * r*0.75,
// y:this.pos.y + Math.cos(22.5*(Math.PI/180)) * r*0.75
// },
// content: doleance['probleme_initial_resolu'] ? doleance['oui_nouvelle_situation'] : doleance['non_adresse_doleance'],
// fontSize: fontsize,
// fillColor: '#fff',
// justification: 'center'
// }));
g.addChild(resolution);
@@ -1468,22 +1474,32 @@ export default {
if (this.is_opened) {
// lets define some options regarding the map_mode
let paper_group_tohit;
let paper_group_tohit, op;
switch (this.map_mode) {
case "terraindevie":
paper_group_tohit = 'entites';
op = {};
break;
case "action":
paper_group_tohit = 'agissantes';
op = {};
break;
case "puissancedagir":
paper_group_tohit = 'puissanceagir_besoins';
op = {};
break;
case "doleancer":
paper_group_tohit = 'doleance_steps';
op = {
// class: paper.Path
fill: true
};
break;
}
let result = this.paper_objects.children[paper_group_tohit].hitTest(event.point);
let result = this.paper_objects.children[paper_group_tohit].hitTest(event.point, op);
// console.log('move result', result);
if (result) {
if (result && result.item.item_id) {
// console.log('move has result', result);
let hover_elmt = {
type: result.item.item_type,

2
src/components/MapConcernements.vue
View File

@@ -159,7 +159,7 @@ export default {
</ul>
</nav>
<ConcernementMapPopup
v-if="hover_elmt"
v-if="hover_elmt && hover_elmt.type !== 'doleance_step'"
:infos="hover_elmt"
/>
</template>

12
src/views/Concernement.vue
View File

@@ -217,13 +217,13 @@ export default {
class="doleance">
<header>
<label for="leprobleme">{{ ct_cercle_politique.field_le_probleme.label }}</label>
<h4 name="leprobleme">{{ doleance.leprobleme }}</h4>
<h3 name="leprobleme">{{ doleance.leprobleme }}</h3>
<label for="lenquete">{{ ct_cercle_politique.field_enquete_terraindevie.label }}</label>
<h3 name="lenquete">{{ doleance.lenquete }}</h3>
<h4 name="lenquete">{{ doleance.lenquete }}</h4>
</header>
<section class="groupesinterets">
<h2>{{ ct_cercle_politique.field_groupes.label }}</h2>
<h5>{{ ct_cercle_politique.field_groupes.label }}</h5>
<ul>
<li
v-for="groupe in doleance.groupesinterets">
@@ -244,7 +244,7 @@ export default {
<p name="comment_ennonce_doleance" v-html="doleance.comment_ennonce_doleance" />
<label for="aqui_addresse_doleance">{{ ct_cercle_politique.field_a_qui_adresse_doleance.label }}</label>
<p name="aqui_addresse_doleance" v-html="doleance.aqui_addresse_doleance" />
<h2>{{ ct_cercle_politique.field_receptions_et_traitements.label }}</h2>
<h5>{{ ct_cercle_politique.field_receptions_et_traitements.label }}</h5>
<ul class="reception_traitement">
<li
v-for="rec in doleance.reception_traitement">
@@ -264,7 +264,7 @@ export default {
<p name="entites_decisionnaires" v-html="doleance.entites_decisionnaires" />
<label for="decision_formule">{{ ct_cercle_politique.field_decision_formulee.label }}</label>
<p name="decision_formule" v-html="doleance.decision_formule" />
<h2>{{ ct_cercle_politique.field_mise_en_oeuvre_decision.label }}</h2>
<h5>{{ ct_cercle_politique.field_mise_en_oeuvre_decision.label }}</h5>
<ul class="mise_en_oeuvre_decision">
<li
v-for="dec in doleance.mise_en_oeuvre_decision">
@@ -284,7 +284,7 @@ export default {
<p name="aqui_adresse_decision" v-html="doleance.aqui_adresse_decision" />
<label for="comment_formule_decision">{{ ct_cercle_politique.field_comment_formule_decision.label }}</label>
<p name="comment_formule_decision" v-html="doleance.comment_formule_decision" />
<h2>{{ ct_cercle_politique.field_receptions_et_applications.label }}</h2>
<h5>{{ ct_cercle_politique.field_receptions_et_applications.label }}</h5>
<ul class="receptions_et_applications">
<li
v-for="app in doleance.receptions_et_applications">