BIG UPDATE: can now change the entites position in front
This commit is contained in:
parent
052a37d714
commit
9aecfc62e9
4
package-lock.json
generated
4
package-lock.json
generated
@ -16,6 +16,7 @@
|
||||
"@tweenjs/tween.js": "^21.0.0",
|
||||
"fabric": "^6.0.0-beta7",
|
||||
"granim": "^2.0.0",
|
||||
"lodash": "^4.17.21",
|
||||
"matter-attractors": "^0.1.6",
|
||||
"matter-js": "^0.19.0",
|
||||
"medium-editor-x": "^0.0.5",
|
||||
@ -2726,8 +2727,7 @@
|
||||
"node_modules/lodash": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
|
||||
"dev": true
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
|
||||
},
|
||||
"node_modules/lodash.merge": {
|
||||
"version": "4.6.2",
|
||||
|
||||
@ -16,6 +16,7 @@
|
||||
"@tweenjs/tween.js": "^21.0.0",
|
||||
"fabric": "^6.0.0-beta7",
|
||||
"granim": "^2.0.0",
|
||||
"lodash": "^4.17.21",
|
||||
"matter-attractors": "^0.1.6",
|
||||
"matter-js": "^0.19.0",
|
||||
"medium-editor-x": "^0.0.5",
|
||||
|
||||
18
src/App.vue
18
src/App.vue
@ -55,7 +55,14 @@ export default {
|
||||
this.parseMapitems();
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
// concernementsByID:{
|
||||
// handler (n, o) {
|
||||
// console.log('App watch concernementsByID o, n', o, n);
|
||||
// this.parseMapitems();
|
||||
// },
|
||||
// deep: true
|
||||
// }
|
||||
},
|
||||
methods: {
|
||||
...mapActions(ConcernementsStore,['loadConcernements']),
|
||||
@ -71,7 +78,9 @@ export default {
|
||||
// create the main mapitem object
|
||||
let mapitem = {
|
||||
id: concernement.id,
|
||||
concernement: concernement,
|
||||
cid: concernement.id,
|
||||
visible: concernement.visible,
|
||||
// concernement: concernement,
|
||||
// superposition_ids: [],
|
||||
superposition_cluster_index: -1,
|
||||
clone: false,
|
||||
@ -95,7 +104,8 @@ export default {
|
||||
}else{
|
||||
let mapitem_superposition = {
|
||||
id: `${concernement.id}___${cluster_index}`,
|
||||
concernement: concernement,
|
||||
cid: concernement.id,
|
||||
// concernement: concernement,
|
||||
superposition_cluster_index: cluster_index,
|
||||
clone: true
|
||||
};
|
||||
@ -145,7 +155,7 @@ export default {
|
||||
<template v-for="(mapitem,index) in mapitems">
|
||||
<!-- && ((map_mode === 'superposition' && mapitem.clone) || !mapitem.clone) -->
|
||||
<ConcernementMapItem
|
||||
v-if="mapitem.concernement.visible"
|
||||
v-if="mapitem.visible"
|
||||
:key="mapitem.id"
|
||||
:mapitem="mapitem"
|
||||
/>
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<script>
|
||||
|
||||
import REST from '@api/rest-axios'
|
||||
|
||||
import { nextTick } from 'vue'
|
||||
|
||||
@ -8,6 +9,7 @@ import MatterAttractors from "matter-attractors";
|
||||
// Matter.use(MatterAttractors);
|
||||
// import polydecomp from "poly-decomp";
|
||||
|
||||
|
||||
import paper from 'paper';
|
||||
|
||||
// import { easeInOutQuad, easeInOutQuart } from 'easing-utils';
|
||||
@ -16,7 +18,9 @@ import Tween from "@tweenjs/tween.js";
|
||||
import { mapState, mapActions } from 'pinia'
|
||||
import { ConcernementsStore } from '@/stores/concernements'
|
||||
import { CommonStore } from '@/stores/common'
|
||||
import { mdiPictureInPictureBottomRight } from '@mdi/js';
|
||||
import { UserStore } from '@stores/user'
|
||||
|
||||
// import { mdiPictureInPictureBottomRight } from '@mdi/js';
|
||||
|
||||
export default {
|
||||
inject: ['canvasMap', 'matterEngine'],
|
||||
@ -41,6 +45,9 @@ export default {
|
||||
scale: 1,
|
||||
prev_scale: 1,
|
||||
//
|
||||
entite_mouse_downed: null, // for entite dragging (admin front)
|
||||
wait: false,
|
||||
//
|
||||
details_zoom_scale: 1,
|
||||
is_dragging: false,
|
||||
//
|
||||
@ -76,12 +83,15 @@ export default {
|
||||
'opened_entite_id',
|
||||
'concernement_active_revision',
|
||||
'detailsZoomValue',
|
||||
'reloadConcernements',
|
||||
'reloadConcernementEntites',
|
||||
'concernements_loading_nb']),
|
||||
...mapState(CommonStore,['hover_elmt',
|
||||
'map_item_ray',
|
||||
'cartouch_width',
|
||||
'cartouch_is_opened',
|
||||
'paper_symbol_definitions'])
|
||||
'paper_symbol_definitions']),
|
||||
...mapState(UserStore,['csrf_token']),
|
||||
},
|
||||
created () {
|
||||
console.log('ConcernementMapItem created', this.mapitem);
|
||||
@ -319,16 +329,37 @@ export default {
|
||||
// },
|
||||
// deep: true
|
||||
// },
|
||||
mapitem: {
|
||||
'mapitem.concernements_loading_nb': {
|
||||
handler (n, o) {
|
||||
console.log(`ConcernementMapItem ${this.id} watch mapitem o, n`, o, n);
|
||||
if (n.concernements_loading_nb !== o.concernements_loading_nb) {
|
||||
console.log(`ConcernementMapItem ${this.id} watch mapitem.concernements_loading_nb o, n`, o, n);
|
||||
// if (n.concernements_loading_nb !== o.concernements_loading_nb) {
|
||||
// this.resetPaperEntitesAndContours();
|
||||
// this.concernement = this.mapitem.concernement;
|
||||
this.resetConcernement();
|
||||
// }
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
'concernement.entites': {
|
||||
handler (n, o) {
|
||||
console.log(`ConcernementMapItem ${this.id} watch concernement.entites o, n`, o, n);
|
||||
// do not trigger on first fill of the property (if o is null)
|
||||
if (o) {
|
||||
this.resetPaperEntitesAndContours();
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
wait: {
|
||||
handler (n, o){
|
||||
// when we are reloading entites par exemple
|
||||
// also handled by onMouseMove
|
||||
if (n) {
|
||||
document.body.style.cursor = "wait";
|
||||
} else {
|
||||
document.body.style.cursor = "auto";
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -343,8 +374,9 @@ export default {
|
||||
'setDetailsZoomValue',
|
||||
]),
|
||||
resetConcernement(){
|
||||
console.log(`resetConcernement() ${this.mapitem.id}`);
|
||||
this.id = this.mapitem.id;
|
||||
this.concernement = this.mapitem.concernement;
|
||||
this.concernement = this.concernementsByID[this.mapitem.cid];// this.mapitem.concernement;
|
||||
this.cid = this.concernement.id;
|
||||
// console.log('mapitem this.cid', this.cid);
|
||||
this.active_revision = this.concernement.active_revision;
|
||||
@ -354,6 +386,7 @@ export default {
|
||||
this.entites = this.concernement.revisions_byid[this.concernement.revision_id].entites;
|
||||
},
|
||||
parseEntityPointsValues (){
|
||||
console.log(`parseEntityPointsValues`);
|
||||
// converts data (menace/maintien, actuel/future, prise) into atcual position x,y
|
||||
for (let r = 0; r < this.concernement.revisions.length; r++) { // loop through all revisions
|
||||
for (let i = 0; i < this.concernement.revisions[r].entites.length; i++) { // loop through all entite for each revision
|
||||
@ -372,9 +405,6 @@ export default {
|
||||
let init_max = 100
|
||||
let slope = this.ray / init_max
|
||||
entite.display.ray = slope * (init_max - entite.prise);
|
||||
// if (this.concernement.id === 28) {
|
||||
// console.log(`entity prise: ${entite.prise} | ray: ${entite.display.ray}`);
|
||||
// }
|
||||
|
||||
|
||||
// ANGLE
|
||||
@ -807,6 +837,7 @@ export default {
|
||||
case 'terraindevie':
|
||||
this.addNewPaperSymbolInstance('boussole_bg', true);
|
||||
this.paper_main_object.addChild(this.setPaperEntites());
|
||||
// this.setPaperEntitesEvents();
|
||||
break;
|
||||
case 'superposition':
|
||||
this.addNewPaperSymbolInstance('boussole_bg', true);
|
||||
@ -834,6 +865,11 @@ export default {
|
||||
if (!this.isResetingPaperEntites) {
|
||||
console.log(`ResetingPaperEntites ${this.id}`);
|
||||
this.isResetingPaperEntites = true;
|
||||
|
||||
this.active_revision = this.concernement.active_revision;
|
||||
console.log(`this.active_revision ${this.active_revision}`);
|
||||
console.log(`entite len : ${this.concernement.revisions_byid[this.active_revision].entites.length}`);
|
||||
|
||||
this.parseEntityPointsValues()
|
||||
|
||||
this.sailentEntites = this.getJarvisEnvelopeConvexeEntites(this.concernement.revisions_byid[this.active_revision].entites);
|
||||
@ -962,7 +998,7 @@ export default {
|
||||
let paper_segments = [];
|
||||
segments.forEach(seg => {
|
||||
paper_segments.push(new paper.Segment({
|
||||
point: [this.pos.x+seg.point[0]*this.scale, this.pos.y+seg.point[1]*this.scale],
|
||||
point: [this.pos.x+seg.point[0]*this.details_zoom_scale, this.pos.y+seg.point[1]*this.details_zoom_scale],
|
||||
handleIn: seg.handleIn,
|
||||
handleout: seg.handleOut
|
||||
}))
|
||||
@ -973,10 +1009,11 @@ export default {
|
||||
segments: paper_segments,
|
||||
fillColor: 'rgba(255,255,255,0.4)',
|
||||
// selected: true,
|
||||
strokeColor: this.mapitem.clone ? '#f00' : '#fff',
|
||||
strokeColor: '#fff',
|
||||
strokeWidth: 1,
|
||||
pivot: new paper.Point(this.pos),
|
||||
cid: this.cid
|
||||
// scale: this.details_zoom_scale,
|
||||
cid: this.cid,
|
||||
});
|
||||
// return the paper path
|
||||
return contrs;
|
||||
@ -1018,7 +1055,7 @@ export default {
|
||||
|
||||
let instance = new paper.SymbolItem(this.paper_symbol_definitions[symbol_name]);
|
||||
instance.name = 'entite';
|
||||
let pos_point = new paper.Point([this.pos.x + entite.display.pos.x * this.scale, this.pos.y + entite.display.pos.y * this.scale]);
|
||||
let pos_point = new paper.Point([this.pos.x + entite.display.pos.x * this.details_zoom_scale, this.pos.y + entite.display.pos.y * this.details_zoom_scale]);
|
||||
instance.position = pos_point;
|
||||
instance.scale(this.scale);
|
||||
instance.fillColor = '#000';
|
||||
@ -1075,6 +1112,8 @@ export default {
|
||||
label_click_zone.insertAbove(label_txt);
|
||||
// label.sendToBack();
|
||||
g_label.addChild(label);
|
||||
|
||||
instance.label_item = label;
|
||||
}
|
||||
}
|
||||
return g;
|
||||
@ -1797,20 +1836,31 @@ export default {
|
||||
},
|
||||
handlePaperVisibilityOnAfterEnginUpdate(){
|
||||
// contours focused
|
||||
let fc, sc, sw;
|
||||
if (!this.isFocused()){
|
||||
this.paper_main_object.children['contours'].fillColor = "rgba(255,255,255,0.1)"; // this.mapitem.clone ? "rgba(255,0,0,0.1)" : "rgba(255,255,255,0.1)"; //
|
||||
fc = "rgba(255,255,255,0.1)";
|
||||
}else{
|
||||
this.paper_main_object.children['contours'].fillColor = "rgba(255,255,255,0.4)"; // this.mapitem.clone ? "rgba(255,0,0,0.4)" : "rgba(255,255,255,0.4)"; //
|
||||
if (this.is_hover) {
|
||||
this.paper_main_object.children['contours'].strokeColor = "#01ffe2";
|
||||
this.paper_main_object.children['contours'].strokeWidth = 2;
|
||||
|
||||
|
||||
}else{
|
||||
this.paper_main_object.children['contours'].strokeColor = "#fff";
|
||||
this.paper_main_object.children['contours'].strokeWidth = 1;
|
||||
fc = "rgba(255,255,255,0.4)";
|
||||
if (this.concernement.can_update) {
|
||||
sc = "#01ffe2";
|
||||
if (this.is_hover) {
|
||||
sw = 2;
|
||||
}else{
|
||||
sw = 1;
|
||||
}
|
||||
} else {
|
||||
if (this.is_hover) {
|
||||
sc = "#01ffe2";
|
||||
sw = 2;
|
||||
}else{
|
||||
sc = "#fff";
|
||||
sw = 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
this.paper_main_object.children['contours'].fillColor = fc
|
||||
this.paper_main_object.children['contours'].strokeColor = sc;
|
||||
this.paper_main_object.children['contours'].strokeWidth = sw;
|
||||
|
||||
// contours visibility
|
||||
if (!this.is_open
|
||||
@ -2037,12 +2087,19 @@ export default {
|
||||
initPaperEvents(){
|
||||
|
||||
this.paper_main_object.onMouseLeave = function(event){
|
||||
if (!this.opened_concernement && this.isFocused()) { // only if no concernement is opened
|
||||
this.resetHoverElmt();
|
||||
document.body.style.cursor = "auto";
|
||||
}
|
||||
if (this.is_open) {
|
||||
document.body.style.cursor = "auto";
|
||||
if (this.wait) {
|
||||
// when we are reloading entites par exemple
|
||||
// also handled by watch and onMouseMove for more reactivity
|
||||
document.body.style.cursor = "wait";
|
||||
} else {
|
||||
if (!this.opened_concernement && this.isFocused()) { // only if no concernement is opened
|
||||
this.resetHoverElmt();
|
||||
document.body.style.cursor = "auto";
|
||||
}
|
||||
if (this.is_open) {
|
||||
document.body.style.cursor = "auto";
|
||||
}
|
||||
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
@ -2131,8 +2188,13 @@ export default {
|
||||
|
||||
let result = paper_group_tohit ? paper_group_tohit.hitTest(event.point) : null;
|
||||
// console.log('move result', result);
|
||||
if (result && result.item.item_id && (result.item.name != "label_click_zone" || this.detailsZoomValue > 2)) {
|
||||
console.log('move has result', result);
|
||||
|
||||
if (this.wait) {
|
||||
// when we are reloading entites par exemple
|
||||
// also handled by watch for more reactivity
|
||||
document.body.style.cursor = "wait";
|
||||
} else if (result && result.item.item_id && (result.item.name != "label_click_zone" || this.detailsZoomValue > 2)) {
|
||||
// console.log('move has result', result);
|
||||
let new_hover_elmt = {
|
||||
paper_id: result.item.id,
|
||||
type: result.item.item_type,
|
||||
@ -2322,28 +2384,136 @@ export default {
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
this.paper_main_object.onMouseDown = function(event){
|
||||
console.log('onMouseDown', event);
|
||||
if (this.is_open && this.map_mode === 'terraindevie' && this.concernement.can_update) {
|
||||
let group_to_hit = this.paper_main_object.children['entites'];
|
||||
let result = group_to_hit.hitTest(event.point);
|
||||
console.log('drag result', result);
|
||||
this.entite_mouse_downed = result;
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
/*
|
||||
* works i correlation with updateDetailsZoomScale()
|
||||
*/
|
||||
this.paper_main_object.onMouseDrag = async function(event){
|
||||
if (this.is_open && this.map_mode === 'terraindevie') {
|
||||
if (this.is_open && this.map_mode === 'terraindevie' && this.concernement.can_update) {
|
||||
// console.log('paper concernement onMouseDrag', event, this);
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
|
||||
console.log('paper concernement onMouseDrag', event.delta);
|
||||
if (this.detailsZoomValue > 1) {
|
||||
let x = this.pos.x + event.delta.x;
|
||||
let y = this.pos.y + event.delta.y;
|
||||
|
||||
this.pos = this.paper_main_object.position = this.constraint.pointA = {x: x, y: y};
|
||||
Matter.Body.setPosition(this.body, this.pos);
|
||||
|
||||
if (this.entite_mouse_downed) {
|
||||
// console.log('paper concernement onMouseDrag entite', this.entite_mouse_downed);
|
||||
this.entite_mouse_downed.item.position.x += event.delta.x;
|
||||
this.entite_mouse_downed.item.position.y += event.delta.y;
|
||||
|
||||
this.is_dragging = true;
|
||||
// Hide popup
|
||||
this.resetHoverElmt();
|
||||
|
||||
// move the label
|
||||
let pad = 2;
|
||||
this.entite_mouse_downed.item.label_item.position.x = this.entite_mouse_downed.item.position.x + pad;
|
||||
this.entite_mouse_downed.item.label_item.position.y = this.entite_mouse_downed.item.position.y - pad*2;
|
||||
|
||||
// indicate that the entity is been dragged (for onMouseUp)
|
||||
this.entite_mouse_downed.dragged = true;
|
||||
} else {
|
||||
// console.log('paper concernement onMouseDrag general', event.delta);
|
||||
if (this.detailsZoomValue > 1) {
|
||||
let x = this.pos.x + event.delta.x;
|
||||
let y = this.pos.y + event.delta.y;
|
||||
|
||||
this.pos = this.paper_main_object.position = this.constraint.pointA = {x: x, y: y};
|
||||
Matter.Body.setPosition(this.body, this.pos);
|
||||
|
||||
this.is_dragging = true;
|
||||
}
|
||||
event.stop();
|
||||
return false;
|
||||
}
|
||||
event.stop();
|
||||
return false;
|
||||
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
this.paper_main_object.onMouseUp = function(event){
|
||||
console.log('onMouseUp', event);
|
||||
if (this.is_open && this.map_mode === 'terraindevie' && this.entite_mouse_downed) {
|
||||
if (this.entite_mouse_downed.dragged) {
|
||||
// console.log('onMouseUp entite_mouse_downed', this.entite_mouse_downed);
|
||||
|
||||
this.wait = true;
|
||||
|
||||
let pos = {
|
||||
x:this.entite_mouse_downed.item.position.x - this.pos.x,
|
||||
y:this.entite_mouse_downed.item.position.y - this.pos.y
|
||||
};
|
||||
|
||||
// compute value for api
|
||||
let {af, mm, p} = this.computeNewEntitePos(pos);
|
||||
// record value
|
||||
let pid = this.concernement.entites_byid[this.entite_mouse_downed.item.item_id].id;
|
||||
this.recordNewEntitePos(pid, af, mm, p)
|
||||
.then((parag) => {
|
||||
// then reload value
|
||||
// redrawing entites is handle by watch concernement.entites
|
||||
this.reloadConcernementEntites(this.concernement.id)
|
||||
.then(() => {
|
||||
this.wait = false;
|
||||
});
|
||||
})
|
||||
}
|
||||
this.entite_mouse_downed = null;
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
},
|
||||
computeNewEntitePos(pos){
|
||||
// actuel future
|
||||
let af = pos.y >= 0 ? 0 : 1;
|
||||
|
||||
// menace / maintien (angle)
|
||||
let mm = parseFloat(Math.atan(pos.x/Math.abs(pos.y)) * (180/Math.PI)).toFixed(2);
|
||||
|
||||
// Prise (rayon)
|
||||
let r = Math.sqrt(Math.pow(pos.x,2)+Math.pow(pos.y,2));
|
||||
// https://stackoverflow.com/questions/5731863/mapping-a-numeric-range-onto-another
|
||||
// from range 0 -> rayon_de_la_boussole moins 8% de padding |to| range 0 -> 100
|
||||
let ext_circle_factor = 1;//0.915; // this factor is also used in MapConcernement
|
||||
let r_max = this.ray * ext_circle_factor * this.details_zoom_scale;
|
||||
let r_slope = (100 - 0) / (r_max - 0);
|
||||
let p = Math.max(0, 100 - parseFloat(0 + r_slope * (r - 0)).toFixed(2));
|
||||
// console.log(`onMouseUp af: ${af}, mm: ${mm}, p: ${p}`);
|
||||
|
||||
return {af, mm, p};
|
||||
},
|
||||
recordNewEntitePos(pid, af, mm, p){
|
||||
return new Promise((resolve, reject) => {
|
||||
// record new values of entite parag (prise, actuel/future, menace/maintien)
|
||||
const params = {
|
||||
id: [{'value': pid}],
|
||||
type: 'entite_concernement',
|
||||
'field_actuel_future': [{'value': af}],
|
||||
'field_menace_maintien_degres': [{'value': mm}],
|
||||
'field_prise': [{'value': p}]
|
||||
};
|
||||
|
||||
const configs = {
|
||||
headers: {'X-CSRF-Token': this.csrf_token}
|
||||
};
|
||||
|
||||
// call the api
|
||||
REST.patch(`/entity/paragraph/${pid}?_format=json`, params, configs)
|
||||
.then(({ data }) => {
|
||||
console.log('concernementMapItem REST patch parag entite', data)
|
||||
resolve(data);
|
||||
})
|
||||
.catch(error => {
|
||||
console.warn(`Issue with patch ${this.data.entitytype} ${this.data.bundle}`, error)
|
||||
Promise.reject(error)
|
||||
})
|
||||
});
|
||||
},
|
||||
resetHoverElmt(){
|
||||
// console.log('resetHoverElmt');
|
||||
@ -2437,6 +2607,8 @@ export default {
|
||||
Matter.Events.off(this.matterEngine, "afterUpdate", this.onAfterEngineUpdate);
|
||||
Matter.Events.on(this.matterEngine, "afterUpdate", this.onAfterEngineUpdate);
|
||||
} else {
|
||||
this.setDetailsZoomValue(1);
|
||||
this.updateDetailsZoomScale();
|
||||
// CLOSING
|
||||
this.is_closing = true;
|
||||
|
||||
@ -2447,6 +2619,7 @@ export default {
|
||||
// this.active_revision = this.concernement.revision_id;
|
||||
// this.setActiveRevision(this.cid, this.concernement.revision_id);//this.concernement.revisions[this.concernement.revisions.length -1].revision_id);
|
||||
// this.resetPaperEntitesAndContours();
|
||||
|
||||
|
||||
this.handlePaperVisibilityOnBeforeClose();
|
||||
|
||||
|
||||
@ -25,7 +25,7 @@ export default {
|
||||
}
|
||||
},
|
||||
created () {
|
||||
console.log(`popup created type: ${this.infos.type}`, this.infos);
|
||||
// console.log(`popup created type: ${this.infos.type}`, this.infos);
|
||||
this.parseInfos()
|
||||
},
|
||||
mounted () {
|
||||
@ -52,7 +52,7 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
parseInfos(){
|
||||
console.log('mapPopup infos', this.infos);
|
||||
// console.log('mapPopup infos', this.infos);
|
||||
switch (this.infos.type) {
|
||||
case 'concernement':
|
||||
this.concernement = this.concernementsByID[this.infos.cid];
|
||||
|
||||
@ -156,7 +156,7 @@ export default {
|
||||
// over highlight effect on paper items
|
||||
if (n && n.paper_id) {
|
||||
let nitem = paper.project.getItem({id: n.paper_id});
|
||||
console.log('watch hover_element nitem', nitem.definition);
|
||||
// console.log('watch hover_element nitem', nitem.definition);
|
||||
if (!nitem.is_symbol_instance) { // not symbol instance
|
||||
nitem.bringToFront();
|
||||
if (nitem.strokeColor) {
|
||||
@ -168,7 +168,7 @@ export default {
|
||||
}
|
||||
|
||||
} else { // is a symbol instanceof, then swap
|
||||
console.log(`symbol instance n.type:${n.type}, nitem`, nitem);
|
||||
// console.log(`symbol instance n.type:${n.type}, nitem`, nitem);
|
||||
switch (n.type) {
|
||||
case 'entite':
|
||||
nitem.definition = this.paper_symbol_definitions.entite_hover;
|
||||
@ -189,7 +189,7 @@ export default {
|
||||
if (o && o.paper_id && (!n || o.paper_id !== n.paper_id)) {
|
||||
let oitem = paper.project.getItem({id: o.paper_id})
|
||||
if (oitem) {
|
||||
console.log('watch hover_element oitem', oitem);
|
||||
// console.log('watch hover_element oitem', oitem);
|
||||
if (!oitem.is_symbol_instance) { // not symbol instance
|
||||
if (oitem.data.prevStrokeColor) {
|
||||
oitem.strokeColor = oitem.data.prevStrokeColor;
|
||||
@ -197,7 +197,7 @@ export default {
|
||||
oitem.fillColor = oitem.data.prevFillColor;
|
||||
}
|
||||
} else { // is a symbol instanceof, then swap
|
||||
console.log(`symbol instance o.type:${o.type}, oitem`, oitem);
|
||||
// console.log(`symbol instance o.type:${o.type}, oitem`, oitem);
|
||||
switch (o.type) {
|
||||
case 'entite':
|
||||
// console.log('this.opened_entite_id', parseInt(this.opened_entite_id), 'oitem.item_id', oitem.item_id);
|
||||
@ -448,7 +448,7 @@ export default {
|
||||
// }
|
||||
|
||||
// cercle exterieur
|
||||
let ext_circle_factor = 0.915;
|
||||
let ext_circle_factor = 0.915; // be eware that concernement map item also use this factor
|
||||
children.push(new paper.Path.Circle({
|
||||
center: [pos.x, pos.y],
|
||||
radius: ray*ext_circle_factor,
|
||||
|
||||
@ -246,11 +246,14 @@ export default {
|
||||
.then((concernement) => {
|
||||
console.log('concernement', concernement);
|
||||
// TODO reload the map item
|
||||
// this.reloadConcernementEntites(concernement.nid[0].value);
|
||||
this.reloadConcernements()
|
||||
this.reloadConcernementEntites(concernement.nid[0].value)
|
||||
.then(() => {
|
||||
this.reloading_concernements = false;
|
||||
});
|
||||
// this.reloadConcernements()
|
||||
// .then(() => {
|
||||
// this.reloading_concernements = false;
|
||||
// });
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@ -13,6 +13,8 @@ import GQL from '@api/graphql-axios'
|
||||
import ConcernementFields from '@api/gql/concernement.fragment.gql'
|
||||
// import EntityFields from '@api/gql/entitydef.fragment.gql'
|
||||
|
||||
import _assign from 'lodash/assign';
|
||||
|
||||
export const ConcernementsStore = defineStore({
|
||||
id: 'concernements',
|
||||
state: () => ({
|
||||
@ -307,41 +309,96 @@ export const ConcernementsStore = defineStore({
|
||||
})
|
||||
},
|
||||
reloadConcernementEntites(nid){
|
||||
// console.log('reloadConcernementEntites nid', nid);
|
||||
// const ast = gql`{
|
||||
// concernement(id:${nid}) {
|
||||
// entites {
|
||||
// id
|
||||
// revision_id
|
||||
// menacemaintien
|
||||
// actuelfuture
|
||||
// entite {
|
||||
// title
|
||||
// id
|
||||
// agissante
|
||||
// proximite {
|
||||
// id
|
||||
// title
|
||||
// }
|
||||
// superposition {
|
||||
// id
|
||||
// title
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// `
|
||||
// // console.log('ast', ast);
|
||||
// GQL.post('', { query: print(ast) })
|
||||
// .then(({ data : { data : { concernement } } }) => {
|
||||
// console.log('reloadConcernementEntites loaded', concernement)
|
||||
// // this.concernementsByID[concernement.id].entites = concernement.entites;
|
||||
// })
|
||||
// .catch(error => {
|
||||
// console.warn('Issue with reloadConcernementEntites', error)
|
||||
// Promise.reject(error)
|
||||
// })
|
||||
let tmp_conc = this.concernementsByID[nid];
|
||||
console.log(`reloadConcernementEntites len: ${tmp_conc.entites.length} revision: ${tmp_conc.revision_id} nid: ${nid}`);
|
||||
return new Promise((resolve, reject) => {
|
||||
const ast = gql`{
|
||||
concernement(id:${nid}) {
|
||||
id
|
||||
entites {
|
||||
id
|
||||
revision_id
|
||||
menacemaintien
|
||||
actuelfuture
|
||||
entite {
|
||||
title
|
||||
id
|
||||
agissante
|
||||
proximite {
|
||||
id
|
||||
title
|
||||
}
|
||||
superposition {
|
||||
id
|
||||
title
|
||||
}
|
||||
}
|
||||
}
|
||||
revision_id
|
||||
revisions {
|
||||
revision_id
|
||||
changed
|
||||
entites {
|
||||
menacemaintien
|
||||
prise
|
||||
actuelfuture
|
||||
entite {
|
||||
id
|
||||
title
|
||||
agissante
|
||||
proximite {
|
||||
id
|
||||
title
|
||||
}
|
||||
superposition {
|
||||
id
|
||||
title
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
// console.log('ast', ast);
|
||||
GQL.post('', { query: print(ast) })
|
||||
.then(({ data : { data : { concernement } } }) => {
|
||||
console.log(`reloadConcernementEntites loaded len: ${concernement.entites.length} revision: ${concernement.revision_id}`, concernement)
|
||||
let tmp_conc = this.concernementsByID[concernement.id];
|
||||
// merge old concernement entites with new once
|
||||
_assign(tmp_conc.entites, concernement.entites);
|
||||
// records and/or merge into general object and on cpnernement entitites_byid
|
||||
tmp_conc.entites.forEach(entite => {
|
||||
entite.cid = tmp_conc.id;
|
||||
if (this.allEntitesById[entite.entite.id]) {
|
||||
_assign(this.allEntitesById[entite.entite.id], entite);
|
||||
}else{
|
||||
this.allEntitesById[entite.entite.id] = entite;
|
||||
}
|
||||
if (tmp_conc.entites_byid[entite.entite.id]) {
|
||||
_assign(tmp_conc.entites_byid[entite.entite.id], entite);
|
||||
}else{
|
||||
tmp_conc.entites_byid[entite.entite.id] = entite;
|
||||
}
|
||||
});
|
||||
// add and/or merge revisions
|
||||
tmp_conc.active_revision = concernement.revision_id;
|
||||
concernement.revisions.forEach(rev => {
|
||||
if(tmp_conc.revisions_byid[rev.revision_id]){
|
||||
_assign(tmp_conc.revisions_byid[rev.revision_id], rev);
|
||||
}else{
|
||||
tmp_conc.revisions_byid[rev.revision_id] = rev;
|
||||
tmp_conc.revisions.push(rev);
|
||||
}
|
||||
})
|
||||
resolve(concernement);
|
||||
})
|
||||
.catch(error => {
|
||||
console.warn('Issue with reloadConcernementEntites', error)
|
||||
reject(error);
|
||||
Promise.reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
loadContentTypeDefinition () {
|
||||
const body = {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user