mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
finish form behaviour
This commit is contained in:
parent
b72b1bd4c7
commit
92a95d4186
@ -45,6 +45,7 @@ use Symfony\Component\Validator\Constraints as Assert;
|
||||
|
||||
/**
|
||||
* @ORM\ManyToOne(targetEntity=AccompanyingPeriod::class)
|
||||
* @Serializer\Groups({"read"})
|
||||
*/
|
||||
private ?AccompanyingPeriod $accompanyingPeriod = null;
|
||||
|
||||
|
||||
@ -69,6 +69,90 @@
|
||||
<div><!-- empty for results --></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="persons">
|
||||
<h2>{{ $t('persons_involved') }}</h2>
|
||||
|
||||
<ul>
|
||||
<li v-for="p in personsReachables" :key="p.id">
|
||||
<input type="checkbox" :value="p.id" v-model="personsPicked">
|
||||
<person :person="p"></person>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="handlingThirdParty">
|
||||
<h2>Tiers traitant</h2>
|
||||
|
||||
<div v-if="!hasHandlingThirdParty">
|
||||
<p class="chill-no-data-statement">
|
||||
Aucun tiers traitant
|
||||
</p>
|
||||
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<add-persons
|
||||
buttonTitle="Indiquer un tiers traitant"
|
||||
modalTitle="Choisir un tiers"
|
||||
v-bind:key="handlingThirdPartyPicker.key"
|
||||
v-bind:options="handlingThirdPartyPicker.options"
|
||||
@addNewPersons="setHandlingThirdParty"
|
||||
ref="handlingThirdPartyPicker"> <!-- to cast child method -->
|
||||
</add-persons>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div v-else>
|
||||
<p>{{ handlingThirdParty.text }}</p>
|
||||
<show-address :address="handlingThirdParty.address"></show-address>
|
||||
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<button class="sc-button bt-delete" @click="removeHandlingThirdParty">
|
||||
Supprimer le tiers traitant
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div id="thirdParties">
|
||||
<h2>Tiers intervenants</h2>
|
||||
|
||||
<div v-if="!hasThirdParties">
|
||||
<p class="chill-no-data-statement">Aucun tiers intervenant</p>
|
||||
|
||||
</div>
|
||||
<div v-else>
|
||||
<ul>
|
||||
<li v-for="t in thirdParties">
|
||||
<p>{{ t.text }}</p>
|
||||
<show-address :address="t.address"></show-address>
|
||||
|
||||
<ul class="record_actions">
|
||||
<button class="sc-button bt-delete" @click="removeThirdParty(t)"></button>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<add-persons
|
||||
buttonTitle="Ajouter des tiers"
|
||||
modalTitle="Choisir des tiers"
|
||||
v-bind:key="thirdPartyPicker.key"
|
||||
v-bind:options="thirdPartyPicker.options"
|
||||
@addNewPersons="addThirdParties"
|
||||
ref="thirdPartyPicker"> <!-- to cast child method -->
|
||||
</add-persons>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
@ -82,6 +166,9 @@
|
||||
"startDate endDate"
|
||||
"comment comment"
|
||||
"objectives objectives"
|
||||
"persons persons"
|
||||
"handling handling"
|
||||
"3parties 3parties"
|
||||
;
|
||||
|
||||
#title {
|
||||
@ -116,6 +203,15 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
#persons {
|
||||
grid-area: persons;
|
||||
}
|
||||
#handlingThirdParty {
|
||||
grid-area: handling;
|
||||
}
|
||||
#thirdParties {
|
||||
grid-area: 3parties;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -123,21 +219,43 @@
|
||||
<script>
|
||||
|
||||
import { mapState, mapGetters, } from 'vuex';
|
||||
import { dateToISO, ISOToDatetime } from 'ChillMainAssets/js/date.js';
|
||||
import { dateToISO, ISOToDate, ISOToDatetime } from 'ChillMainAssets/js/date.js';
|
||||
import CKEditor from '@ckeditor/ckeditor5-vue';
|
||||
import ClassicEditor from 'ChillMainAssets/modules/ckeditor5/index.js';
|
||||
import AddResult from './_components/AddResult.vue';
|
||||
import Person from 'ChillPersonAssets/vuejs/_components/Person/Person.vue';
|
||||
import AddPersons from 'ChillPersonAssets/vuejs/_components/AddPersons.vue';
|
||||
import ShowAddress from 'ChillMainAssets/vuejs/_components/ShowAddress.vue';
|
||||
|
||||
export default {
|
||||
name: 'App',
|
||||
components: {
|
||||
ckeditor: CKEditor.component,
|
||||
AddResult,
|
||||
AddPersons,
|
||||
Person,
|
||||
ShowAddress,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
editor: ClassicEditor,
|
||||
showAddObjective: false,
|
||||
handlingThirdPartyPicker: {
|
||||
key: 'handling-third-party',
|
||||
options: {
|
||||
type: [ 'thirdparty' ],
|
||||
priority: null,
|
||||
uniq: true
|
||||
},
|
||||
},
|
||||
thirdPartyPicker: {
|
||||
key: 'third-party',
|
||||
options: {
|
||||
type: [ 'thirdparty' ],
|
||||
priority: null,
|
||||
uniq: false,
|
||||
},
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -145,9 +263,14 @@ export default {
|
||||
'work',
|
||||
'resultsForAction',
|
||||
'goalsPicked',
|
||||
'personsReachables',
|
||||
'handlingThirdParty',
|
||||
'thirdParties'
|
||||
]),
|
||||
...mapGetters([
|
||||
'hasResultsForAction',
|
||||
'hasHandlingThirdParty',
|
||||
'hasThirdParties',
|
||||
]),
|
||||
startDate: {
|
||||
get() {
|
||||
@ -155,7 +278,7 @@ export default {
|
||||
return dateToISO(this.$store.state.startDate);
|
||||
},
|
||||
set(v) {
|
||||
this.$store.mutate('setStartDate', ISOToDate(v));
|
||||
this.$store.commit('setStartDate', ISOToDate(v));
|
||||
}
|
||||
},
|
||||
endDate: {
|
||||
@ -164,7 +287,7 @@ export default {
|
||||
return dateToISO(this.$store.state.endDate);
|
||||
},
|
||||
set(v) {
|
||||
this.$store.mutate('setEndDate', ISOToDate(v));
|
||||
this.$store.commit('setEndDate', ISOToDate(v));
|
||||
}
|
||||
},
|
||||
note: {
|
||||
@ -172,7 +295,7 @@ export default {
|
||||
return this.$store.state.note;
|
||||
},
|
||||
set(v) {
|
||||
this.$store.mutate('setNote', note);
|
||||
this.$store.commit('setNote', note);
|
||||
}
|
||||
},
|
||||
availableForCheckGoal() {
|
||||
@ -182,6 +305,18 @@ export default {
|
||||
|
||||
return this.$store.state.goalsForAction.filter(g => !pickedIds.includes(g.id));
|
||||
},
|
||||
personsPicked: {
|
||||
get() {
|
||||
let s = this.$store.state.personsPicked.map(p => p.id);
|
||||
console.log('persons picked', s);
|
||||
|
||||
return s;
|
||||
},
|
||||
set(v) {
|
||||
console.log('persons picked', v);
|
||||
this.$store.commit('setPersonsPickedIds', v);
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
toggleAddObjective() {
|
||||
@ -195,6 +330,26 @@ export default {
|
||||
console.log('remove goal', g);
|
||||
this.$store.commit('removeGoal', g);
|
||||
},
|
||||
setHandlingThirdParty({ selected, modal }) {
|
||||
console.log('setHandlingThirdParty', selected);
|
||||
this.$store.commit('setHandlingThirdParty', selected.shift().result);
|
||||
this.$refs.handlingThirdPartyPicker.resetSearch();
|
||||
modal.showModal = false;
|
||||
},
|
||||
removeHandlingThirdParty() {
|
||||
console.log('removeHandlingThirdParty');
|
||||
this.$store.commit('setHandlingThirdParty', null);
|
||||
},
|
||||
addThirdParties({ selected, modal}) {
|
||||
console.log('addThirdParties', selected);
|
||||
this.$store.commit('addThirdParties', selected.map(r => r.result));
|
||||
this.$refs.thirdPartyPicker.resetSearch();
|
||||
modal.showModal = false;
|
||||
},
|
||||
removeThirdParty(t) {
|
||||
console.log('remove third party', t);
|
||||
this.$store.commit('removeThirdParty', t);
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -20,6 +20,11 @@ const store = createStore({
|
||||
resultsForAction: [],
|
||||
goalsForAction: [],
|
||||
resultsForGoal: [],
|
||||
personsPicked: window.accompanyingCourseWork.persons,
|
||||
personsReachables: window.accompanyingCourseWork.accompanyingPeriod.participations.filter(p => p.endDate == null)
|
||||
.map(p => p.person),
|
||||
handlingThirdParty: window.accompanyingCourseWork.handlingThierParty,
|
||||
thirdParties: window.accompanyingCourseWork.thirdParties,
|
||||
errors: [],
|
||||
},
|
||||
getters: {
|
||||
@ -38,7 +43,13 @@ const store = createStore({
|
||||
let found = state.goalsPicked.find(g => g.id === goal.id);
|
||||
|
||||
return found === undefined ? [] : found.results;
|
||||
}
|
||||
},
|
||||
hasHandlingThirdParty(state) {
|
||||
return state.handlingThirdParty !== null;
|
||||
},
|
||||
hasThirdParties(state) {
|
||||
return state.thirdParties.length > 0;
|
||||
},
|
||||
},
|
||||
mutations: {
|
||||
setStartDate(state, date) {
|
||||
@ -94,15 +105,37 @@ const store = createStore({
|
||||
|
||||
found.results = found.results.filter(r => r.id !== result.id);
|
||||
},
|
||||
setPersonsPickedIds(state, ids) {
|
||||
console.log('persons ids', ids);
|
||||
state.personsPicked = state.personsReachables
|
||||
.filter(p => ids.includes(p.id))
|
||||
},
|
||||
setNote(state, note) {
|
||||
state.note = note;
|
||||
},
|
||||
setHandlingThirdParty(state, thirdParty) {
|
||||
state.handlingThirdParty = thirdParty;
|
||||
},
|
||||
addThirdParties(state, thirdParties) {
|
||||
console.log('addThirdParties', thirdParties);
|
||||
// filter to remove existing thirdparties
|
||||
let ids = state.thirdParties.map(t => t.id);
|
||||
let unexistings = thirdParties.filter(t => !ids.includes(t.id));
|
||||
console.log('unexisting third parties', unexistings);
|
||||
for (let i in unexistings) {
|
||||
state.thirdParties.push(unexistings[i]);
|
||||
}
|
||||
},
|
||||
removeThirdParty(state, thirdParty) {
|
||||
state.thirdParties = state.thirdParties
|
||||
.filter(t => t.id !== thirdParty.id);
|
||||
},
|
||||
addErrors(state, errors) {
|
||||
console.log('handling errors', errors);
|
||||
for (let i in errors) {
|
||||
state.push(errors[i]);
|
||||
}
|
||||
},
|
||||
setNote(state, note) {
|
||||
state.note = note;
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
getReachablesGoalsForAction({ getters, commit, dispatch }) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user