Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

adding show/edit links (prepare modal) + save button

Browse Source
This commit is contained in:
Mathieu Jaumotte 2021-04-28 13:59:37 +02:00
parent 4bb3eadf91
commit 94e494361f
6 changed files with 64 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/api/accompanyingCourse.js
View File

@ -4,7 +4,7 @@ const
accompanying_period_id = () => window.accompanyingCourseId
;
// 1. chill_person_accompanying_course_api_show
// 1. chill_person_accompanying_course_api_show (GET)
let getAccompanyingCourse = (accompanying_period_id) => {
const url = `/${locale}/person/api/1.0/accompanying-course/${accompanying_period_id}/show.${format}`;
return fetch(url)
@ -12,15 +12,19 @@ let getAccompanyingCourse = (accompanying_period_id) => {
};
// 2. chill_person_accompanying_course_api_add_participation (POST)
let getParticipations = (accompanying_period_id) => {
let postParticipation = (accompanying_period_id, participation) => {
const url = `/${locale}/person/api/1.0/accompanying-course/${accompanying_period_id}/participation.${format}`
return fetch(url)
return fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json;charset=utf-8'
},
body: JSON.stringify(participation)
})
.then(response => response.json());
};
export { getAccompanyingCourse, getParticipations };
export { getAccompanyingCourse, postParticipation };
/// TODO
// * cfr. promise.all() pour plusieurs promesses

18
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonItem.vue
View File

@ -11,14 +11,16 @@
<td>
<ul class="record_actions">
<li>
<button class="sc-button bt-show"
<a class="sc-button bt-show" target="_blank"
:href="url.show"
:title="$t('action.show')">
</button>
</a>
</li>
<li>
<button class="sc-button bt-update"
<a class="sc-button bt-update" target="_blank"
:href="url.edit"
:title="$t('action.edit')">
</button>
</a>
</li>
<li>
<button class="sc-button bt-delete"
@ -35,6 +37,14 @@
export default {
name: 'PersonItem',
props: ['participation'],
data() {
return {
url: {
show: '/fr/person/' + this.participation.person.id + '/general',
edit: '/fr/person/' + this.participation.person.id + '/general/edit'
}
}
},
emits: ['remove']
}
</script>

10
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonsAssociated.vue
View File

@ -27,9 +27,13 @@
{{ $t('persons_associated.addPerson') }}
</button>
</li>
<li>
<button class="sc-button orange" @click="savePersons">
{{ $t('action.save') }}
</button>
</li>
</ul>
</div>
</template>
<script>
@ -49,6 +53,7 @@ export default {
}),
methods: {
addPerson() {
console.log('[wip] opening add persons modal');
this.$store.commit('addParticipation', {
id: SimpsonId++,
person: { firstName: "Lisa", lastName: "Simpson", id: SimpsonId },
@ -58,6 +63,9 @@ export default {
},
removePerson(item) {
this.$store.commit('removeParticipation', item)
},
savePersons() {
console.log('[wip] saving persons');
}
}
}

5
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/index.js
View File

@ -1,11 +1,11 @@
import { createApp } from 'vue'
import { createI18n } from 'vue-i18n'
import { datetimeFormats, messages } from './js/i18n'
import createStore from './store'
import { getDataPromise, postDataPromise } from './store'
import App from './App.vue';
createStore.then(store => {
getDataPromise.then(store => {
//console.log('store in create_store', store);
console.log('store accompanyingCourse', store.state.accompanying_course);
@ -24,4 +24,5 @@ createStore.then(store => {
.use(i18n)
.component('app', App)
.mount('#accompanying-course');
});

1
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/js/i18n.js
View File

@ -30,6 +30,7 @@ const messages = {
create: "Créer",
remove: "Enlever",
delete: "Supprimer",
save: "Enregistrer",
}
}
};

35
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/store/index.js
View File

@ -1,12 +1,14 @@
import 'es6-promise/auto';
import { createStore } from 'vuex';
import { getAccompanyingCourse, getParticipations } from '../api/accompanyingCourse';
import { getAccompanyingCourse, postParticipation } from '../api/accompanyingCourse';
const debug = process.env.NODE_ENV !== 'production';
let promise = getAccompanyingCourse(window.accompanyingCourseId)
const id = window.accompanyingCourseId;
let getDataPromise = getAccompanyingCourse(id)
.then(accompanying_course => new Promise((resolve, reject) => {
let store = createStore({
const store = createStore({
strict: debug,
state: {
accompanying_course: accompanying_course
@ -15,19 +17,36 @@ let promise = getAccompanyingCourse(window.accompanyingCourseId)
},
mutations: {
removeParticipation(state, item) {
console.log('remove item', item.id);
state.accompanying_course.participations = state.accompanying_course.participations.filter(participation => participation !== item)
//console.log('remove item', item.id);
state.accompanying_course.participations = state.accompanying_course.participations.filter(
participation => participation !== item
)
},
addParticipation(state, item) {
console.log('add new item');
//console.log('add new item');
state.accompanying_course.participations.push(item)
}
},
actions: {
}
});
//console.log('store', store);
console.log('store object', store.state.accompanying_course.id);
resolve(store);
}));
let postDataPromise = postParticipation(id)
.then(participation => new Promise((resolve, reject) => {
// get store
// use store.actions to post (async way)
console.log(store);
resolve(store);
}));
export default promise;
/*
let allPromises = Promise.all([getDataPromise, postDataPromise])
.then((values) => {
console.log('all promises values', values);
});
*/
export { getDataPromise };