mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-07-01 06:26:15 +00:00
Merge branch 'household_filiation' of gitlab.com:Chill-Projet/chill-bundles into household_filiation
This commit is contained in:
commit
6d5f94ab45
@ -900,7 +900,28 @@ class ChillPersonExtension extends Extension implements PrependExtensionInterfac
|
||||
]
|
||||
],
|
||||
]
|
||||
]
|
||||
],
|
||||
[
|
||||
'class' => \Chill\PersonBundle\Entity\Relationships\Relation::class,
|
||||
'controller' => \Chill\PersonBundle\Controller\RelationshipApiController::class,
|
||||
'name' => 'relations',
|
||||
'base_path' => '/api/1.0/relations/relation',
|
||||
'base_role' => 'ROLE_USER',
|
||||
'actions' => [
|
||||
'_index' => [
|
||||
'methods' => [
|
||||
Request::METHOD_GET => true,
|
||||
Request::METHOD_HEAD => true
|
||||
],
|
||||
],
|
||||
'_entity' => [
|
||||
'methods' => [
|
||||
Request::METHOD_GET => true,
|
||||
Request::METHOD_HEAD => true
|
||||
]
|
||||
],
|
||||
]
|
||||
],
|
||||
]
|
||||
]);
|
||||
}
|
||||
|
@ -20,6 +20,7 @@ class Relation
|
||||
* @ORM\Id
|
||||
* @ORM\GeneratedValue
|
||||
* @ORM\Column(type="integer")
|
||||
* @Serializer\Groups({"read"})
|
||||
*/
|
||||
private ?int $id = null;
|
||||
|
||||
@ -78,7 +79,7 @@ class Relation
|
||||
public function setIsActive(?bool $isActive): self
|
||||
{
|
||||
$this->isActive = $isActive;
|
||||
|
||||
|
||||
return $this;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,9 +1,14 @@
|
||||
<template>
|
||||
|
||||
<!-- TEST appelle la fonction sans passer par le callback de vis-network -->
|
||||
<button class="btn btn-sm btn-create" @click="addRelationshipModal({ from: 'person_1617', to: 'person_1614' })">add link</button>
|
||||
<!--// <=== InternalError: too much recursion -->
|
||||
|
||||
<div id="visgraph"></div>
|
||||
|
||||
<teleport to="#visgraph-legend">
|
||||
<div class="my-4 post-menu legend">
|
||||
<h3>{{ $t('visgraph.Legend')}}</h3>
|
||||
<h3>{{ $t('visgraph.Legend') }}</h3>
|
||||
<div class="list-group">
|
||||
<label class="list-group-item" v-for="layer in legendLayers">
|
||||
<input
|
||||
@ -24,45 +29,74 @@
|
||||
<modal v-if="modal.showModal" :modalDialogClass="modal.modalDialogClass" @close="modal.showModal = false">
|
||||
<template v-slot:header>
|
||||
<h2 class="modal-title">{{ $t(modal.title) }}</h2>
|
||||
<!-- {{ modal.data.id }} -->
|
||||
</template>
|
||||
<template v-slot:body>
|
||||
<div v-if="modal.action === 'delete'">
|
||||
<p>
|
||||
{{ $t('visgraph.delete_confirmation_text') }}
|
||||
</p>
|
||||
<p>{{ $t('visgraph.delete_confirmation_text') }}</p>
|
||||
</div>
|
||||
<div v-else>
|
||||
<form>
|
||||
{{ modal.data.id }}
|
||||
<div class="row">
|
||||
<div class="col-12 text-center">entre<br>et</div>
|
||||
<div class="col">
|
||||
{{ modal.data.from }}
|
||||
<h4>
|
||||
{{ getPerson(modal.data.from).text }}
|
||||
</h4>
|
||||
<p class="text-start" v-if="relation && relation.title">
|
||||
<span v-if="reverse">
|
||||
{{ $t('visgraph.relation_from_to_like', [ getPerson(modal.data.from).text, getPerson(modal.data.to).text, relation.reverseTitle.fr.toLowerCase() ])}}
|
||||
</span>
|
||||
<span v-else>
|
||||
{{ $t('visgraph.relation_from_to_like', [ getPerson(modal.data.from).text, getPerson(modal.data.to).text, relation.title.fr.toLowerCase() ])}}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col text-end">
|
||||
{{ modal.data.to }}
|
||||
<h4>
|
||||
{{ getPerson(modal.data.to).text }}
|
||||
</h4>
|
||||
<p class="text-end" v-if="relation && relation.title">
|
||||
<span v-if="reverse">
|
||||
{{ $t('visgraph.relation_from_to_like', [ getPerson(modal.data.to).text, getPerson(modal.data.from).text, relation.title.fr.toLowerCase() ])}}
|
||||
</span>
|
||||
<span v-else>
|
||||
{{ $t('visgraph.relation_from_to_like', [ getPerson(modal.data.to).text, getPerson(modal.data.from).text, relation.reverseTitle.fr.toLowerCase() ])}}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div><!--
|
||||
<div class="my-3"><!--
|
||||
:value="relation"
|
||||
-->
|
||||
<VueMultiselect
|
||||
id="relationshipLink"
|
||||
id="relation"
|
||||
label="title"
|
||||
track-by="id"
|
||||
:custom-label="customLabel"
|
||||
:placeholder="$t('Choisissez le lien de parenté')"
|
||||
:options="relationLinks"
|
||||
v-model="relationshipLink"
|
||||
:close-on-select="true"
|
||||
:multiple="false"
|
||||
:searchable="true"
|
||||
:options="relations"
|
||||
v-model="relation"
|
||||
>
|
||||
</VueMultiselect>
|
||||
-->
|
||||
</div>
|
||||
<p>
|
||||
phrase
|
||||
</p>
|
||||
<div>
|
||||
toggle reverse
|
||||
<div class="form-check form-switch">
|
||||
<input
|
||||
class="form-check-input"
|
||||
type="checkbox"
|
||||
id="reverse"
|
||||
v-model="reverse"
|
||||
>
|
||||
<label class="form-check-label" for="reverse">{{ $t('visgraph.reverse_relation') }}</label>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</template>
|
||||
<template v-slot:footer>
|
||||
<button class="btn" :class="modal.button.class" @click="modal.showModal = false">
|
||||
<button class="btn" :class="modal.button.class" @click="submitRelationship">
|
||||
{{ $t(modal.button.text)}}</button>
|
||||
</template>
|
||||
</modal>
|
||||
@ -75,6 +109,7 @@ import vis from 'vis-network/dist/vis-network'
|
||||
import { mapState, mapGetters } from "vuex"
|
||||
import Modal from 'ChillMainAssets/vuejs/_components/Modal'
|
||||
import VueMultiselect from 'vue-multiselect'
|
||||
import { getRelationsList, postRelationship } from "./api";
|
||||
|
||||
export default {
|
||||
name: "App",
|
||||
@ -86,9 +121,12 @@ export default {
|
||||
return {
|
||||
container: '',
|
||||
checkedLayers: [],
|
||||
relations: [],
|
||||
relation: null,
|
||||
reverse: false,
|
||||
modal: {
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-dialog-scrollable modal-md",
|
||||
modalDialogClass: "modal-md",
|
||||
title: null,
|
||||
action: null,
|
||||
data: {},
|
||||
@ -101,9 +139,8 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['nodes', 'edges']),
|
||||
...mapState(['households', 'courses', 'excludedNodesIds',
|
||||
// not used
|
||||
'persons', 'links', 'relationships', 'personLoadedIds', 'householdLoadingIds', 'courseLoadedIds', 'relationshipLoadedIds',
|
||||
...mapState(['households', 'courses', 'excludedNodesIds', 'persons',
|
||||
// not used 'links', 'relationships', 'personLoadedIds', 'householdLoadingIds', 'courseLoadedIds', 'relationshipLoadedIds',
|
||||
]),
|
||||
|
||||
visgraph_data() {
|
||||
@ -141,7 +178,28 @@ export default {
|
||||
|
||||
checkedLayers() { // required to refresh data checkedLayers
|
||||
return this.checkedLayers
|
||||
}
|
||||
},
|
||||
|
||||
relation: {
|
||||
get() {
|
||||
return this.relation
|
||||
},
|
||||
set(value) {
|
||||
//console.log('setter relation', value) // <=== InternalError: too much recursion
|
||||
this.relation = value
|
||||
}
|
||||
},
|
||||
|
||||
reverse: {
|
||||
get() {
|
||||
return this.reverse
|
||||
},
|
||||
set(value) {
|
||||
//console.log('setter reverse', value) // <=== InternalError: too much recursion
|
||||
this.reverse = value
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
created() {
|
||||
@ -157,6 +215,7 @@ export default {
|
||||
mounted() {
|
||||
console.log('=== mounted: init graph')
|
||||
this.initGraph()
|
||||
this.getRelationsList()
|
||||
},
|
||||
methods: {
|
||||
initGraph() {
|
||||
@ -191,8 +250,8 @@ export default {
|
||||
},
|
||||
|
||||
addRelationshipModal(edgeData) {
|
||||
console.log('==> addRelationshipModal <=======================', edgeData)
|
||||
this.modal.data = edgeData
|
||||
console.log('==- addRelationshipModal', edgeData) // { from: "person_1617", to: "person_1614" }
|
||||
this.modal.action = 'create'
|
||||
this.modal.title = 'visgraph.add_relationship_link'
|
||||
this.modal.button.class = 'btn-create'
|
||||
@ -200,8 +259,8 @@ export default {
|
||||
this.modal.showModal = true
|
||||
},
|
||||
editRelationshipModal(edgeData) {
|
||||
console.log('==> editRelationshipModal <=======================', edgeData)
|
||||
this.modal.data = edgeData
|
||||
console.log('==- editRelationshipModal', edgeData)
|
||||
this.modal.action = 'edit'
|
||||
this.modal.title = 'visgraph.edit_relationship_link'
|
||||
this.modal.button.class = 'btn-edit'
|
||||
@ -209,40 +268,62 @@ export default {
|
||||
this.modal.showModal = true
|
||||
},
|
||||
deleteRelationshipModal(edgeData) {
|
||||
console.log('==> deleteRelationshipModal <=======================', edgeData)
|
||||
this.modal.data = edgeData
|
||||
console.log('==- deleteRelationshipModal', edgeData)
|
||||
this.modal.action = 'delete'
|
||||
this.modal.title = 'visgraph.delete_relationship_link'
|
||||
this.modal.button.class = 'btn-delete'
|
||||
this.modal.button.text = 'action.delete'
|
||||
this.modal.showModal = true
|
||||
},
|
||||
resetForm() {
|
||||
console.log('==- reset Form')
|
||||
this.modal.data = {}
|
||||
this.modal.action = null
|
||||
this.modal.title = null
|
||||
this.modal.button.class = null
|
||||
this.modal.button.text = null
|
||||
},
|
||||
|
||||
relationLinks() {
|
||||
console.log('fetch relationLinks')
|
||||
return getRelations().then(relationsList => new Promise(resolve => {
|
||||
console.log('relationsList', relationsList)
|
||||
getRelationsList() {
|
||||
console.log('fetch relationsList')
|
||||
return getRelationsList().then(relations => new Promise(resolve => {
|
||||
console.log('+ relations list', relations.results.filter(r => r.isActive === true))
|
||||
this.relations = relations.results
|
||||
resolve()
|
||||
})).catch()
|
||||
},
|
||||
}
|
||||
/*
|
||||
TODO / TO CHECK / TO UNDERSTAND
|
||||
customLabel(value) {
|
||||
console.log('customLabel', value)
|
||||
return (value.title && value.reverseTitle) ? `${value.title.fr} ↔ ${value.reverseTitle.fr}` : ''
|
||||
},
|
||||
getPerson(idtext) {
|
||||
let person = this.persons.filter(p => p.id === idtext)
|
||||
return person[0]
|
||||
},
|
||||
|
||||
///// A
|
||||
new vis.Network(), param 2: why we don't need to instanciate node and edges with new vis.DataSet like in example ?
|
||||
{
|
||||
nodes: new vis.DataSet(this.nodes),
|
||||
edges: new vis.DataSet(this.relationships)
|
||||
submitRelationship() {
|
||||
console.log('submitRelationship')
|
||||
if (this.modal.action !== 'delete') {
|
||||
return postRelationship(
|
||||
this.getPerson(this.modal.data.from), this.getPerson(this.modal.data.to), this.relation, this.reverse
|
||||
)
|
||||
.then(response => new Promise(resolve => {
|
||||
console.log('', response)
|
||||
modal.showModal = false
|
||||
this.resetForm()
|
||||
resolve()
|
||||
}))
|
||||
.catch()
|
||||
}
|
||||
}
|
||||
}
|
||||
///// B
|
||||
refreshNetwork() computed: need to watch/listen event to force refreshing ?
|
||||
|
||||
*/
|
||||
}
|
||||
</script>
|
||||
|
||||
<style src="vis-network/dist/dist/vis-network.min.css"></style>
|
||||
<style src="vue-multiselect/dist/vue-multiselect.css"></style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
div#visgraph {
|
||||
margin: 2em auto;
|
||||
@ -253,4 +334,7 @@ div#visgraph-legend {
|
||||
div.post-menu.legend {
|
||||
}
|
||||
}
|
||||
.modal-mask {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
</style>
|
||||
|
@ -111,19 +111,30 @@ const getRelationshipsByPerson = (person) => {
|
||||
}
|
||||
|
||||
/**
|
||||
* @function postRelationship
|
||||
* @param person
|
||||
* Return list of relations
|
||||
* @returns {Promise<Response>}
|
||||
*/
|
||||
const postRelationship = (person) => {
|
||||
//console.log('postRelationship', person.id)
|
||||
const getRelationsList = () => {
|
||||
return getFetch(`/api/1.0/relations/relation.json`)
|
||||
}
|
||||
|
||||
/**
|
||||
* @function postRelationship
|
||||
* @param fromPerson
|
||||
* @param toPerson
|
||||
* @param relation
|
||||
* @param reverse
|
||||
* @returns {Promise<Response>}
|
||||
*/
|
||||
const postRelationship = (fromPerson, toPerson, relation, reverse) => {
|
||||
return postFetch(
|
||||
`/api/1.0/relations/relationship.json`,
|
||||
{
|
||||
from: { type: 'person', id: 0 },
|
||||
to: { type: 'person', id: 0 },
|
||||
relation: { type: 'relation', id: 0 },
|
||||
reverse: bool
|
||||
type: 'relationship',
|
||||
fromPerson: { type: 'person', id: fromPerson._id },
|
||||
toPerson: { type: 'person', id: toPerson._id },
|
||||
relation: { type: 'relation', id: relation.id },
|
||||
reverse: reverse
|
||||
}
|
||||
)
|
||||
}
|
||||
@ -132,5 +143,6 @@ export {
|
||||
getHouseholdByPerson,
|
||||
getCoursesByPerson,
|
||||
getRelationshipsByPerson,
|
||||
postRelationship
|
||||
getRelationsList,
|
||||
postRelationship,
|
||||
}
|
||||
|
@ -15,14 +15,16 @@ const visMessages = {
|
||||
edit_relationship_link: "Modifier le lien de filiation",
|
||||
delete_relationship_link: "Êtes-vous sûr ?",
|
||||
delete_confirmation_text: "Vous allez supprimer le lien entre ces 2 usagers.",
|
||||
reverse_relation: "Inverser la relation",
|
||||
relation_from_to_like: "{2} de {1}", // disable {0}
|
||||
},
|
||||
edit: 'Éditer',
|
||||
del: 'Supprimer',
|
||||
back: 'Revenir en arrière',
|
||||
addNode: 'Ajouter un noeuds',
|
||||
addEdge: 'Ajouter un lien',
|
||||
editNode: 'Éditer un noeuds',
|
||||
editEdge: 'Éditer un lien',
|
||||
addEdge: 'Ajouter un lien de filiation',
|
||||
editNode: 'Éditer le noeuds',
|
||||
editEdge: 'Éditer le lien',
|
||||
addDescription: 'Cliquez dans un espace vide pour créer un nouveau nœud.',
|
||||
edgeDescription: 'Cliquez sur un usager et faites glisser le lien vers un autre usager pour les connecter.',
|
||||
editEdgeDescription: 'Cliquez sur les points de contrôle et faites-les glisser vers un nœud pour les relier.',
|
||||
|
@ -152,7 +152,7 @@ const store = createStore({
|
||||
.then(household => new Promise(resolve => {
|
||||
//console.log('getHouseholdByPerson', household)
|
||||
commit('addHousehold', adapt2vis(household))
|
||||
commit('addExcludedNode', household.id)
|
||||
//commit('addExcludedNode', household.id)
|
||||
dispatch('addLinkFromPersonsToHousehold', household)
|
||||
resolve()
|
||||
})
|
||||
@ -290,7 +290,7 @@ const store = createStore({
|
||||
commit('addLink', {
|
||||
from: `person_${r.fromPerson.id}`,
|
||||
to: `person_${r.toPerson.id}`,
|
||||
id: 'r' + r.id + '_p' + r.fromPerson.id + '_p' + r.toPerson.id,
|
||||
id: 'r' + splitId(r.id,'id') + '_p' + r.fromPerson.id + '_p' + r.toPerson.id,
|
||||
arrows: 'to',
|
||||
color: 'lightblue',
|
||||
font: { color: '#33839d' },
|
||||
@ -315,7 +315,7 @@ const store = createStore({
|
||||
commit('markPersonLoaded', person.id)
|
||||
commit('addPerson', adapt2vis(person, { folded: true }))
|
||||
|
||||
console.log('********* fetch infos for missing', person.id, '******')
|
||||
console.log(' fetch infos for missing', person.id)
|
||||
//dispatch('fetchInfoForPerson', person)
|
||||
},
|
||||
}
|
||||
|
@ -39,8 +39,8 @@ window.options = {
|
||||
theta: 0.5,
|
||||
gravitationalConstant: -50,
|
||||
centralGravity: 0.01,
|
||||
springConstant: 0.08,
|
||||
springLength: 100,
|
||||
springConstant: 0.08,
|
||||
damping: 0.4,
|
||||
avoidOverlap: 0
|
||||
},
|
||||
@ -61,7 +61,7 @@ window.options = {
|
||||
},
|
||||
maxVelocity: 50,
|
||||
minVelocity: 0.1,
|
||||
solver: 'barnesHut',
|
||||
solver: 'forceAtlas2Based', //'barnesHut', //
|
||||
stabilization: {
|
||||
enabled: true,
|
||||
iterations: 1000,
|
||||
@ -85,11 +85,8 @@ window.options = {
|
||||
},
|
||||
manipulation: {
|
||||
enabled: true,
|
||||
initiallyActive: true,
|
||||
addNode: function(nodeData, callback) {
|
||||
console.log('addNode', nodeData)
|
||||
//callback(nodeData) disabled
|
||||
},
|
||||
initiallyActive: false,
|
||||
addNode: false,
|
||||
editNode: function(nodeData, callback) {
|
||||
console.log('editNode', nodeData)
|
||||
//callback(nodeData) disabled
|
||||
|
@ -307,7 +307,7 @@ components:
|
||||
- $ref: "#/components/schemas/RelationById"
|
||||
reverse:
|
||||
type: boolean
|
||||
|
||||
|
||||
|
||||
paths:
|
||||
/1.0/person/person/{id}.json:
|
||||
@ -1093,7 +1093,7 @@ paths:
|
||||
description: "OK"
|
||||
400:
|
||||
description: "transition cannot be applyed"
|
||||
|
||||
|
||||
/1.0/person/accompanying-course/by-person/{person_id}.json:
|
||||
get:
|
||||
tags:
|
||||
@ -1647,7 +1647,7 @@ paths:
|
||||
description: "OK"
|
||||
400:
|
||||
description: "Bad Request"
|
||||
|
||||
|
||||
/1.0/relations/relationship.json:
|
||||
post:
|
||||
tags:
|
||||
@ -1671,3 +1671,14 @@ paths:
|
||||
description: "Unauthorized"
|
||||
422:
|
||||
description: "Invalid data: the data is a valid json, could be deserialized, but does not pass validation"
|
||||
|
||||
/1.0/relations/relation.json:
|
||||
get:
|
||||
tags:
|
||||
- relationships
|
||||
summary: get a list of relations
|
||||
responses:
|
||||
401:
|
||||
description: "Unauthorized"
|
||||
200:
|
||||
description: "OK"
|
||||
|
Loading…
x
Reference in New Issue
Block a user