From 28e4b2abafb1a310be77d9a60d034e91c2ae184f Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Fri, 23 Apr 2021 12:58:46 +0200 Subject: [PATCH] test vue app --- .../ChillMainBundle/chill.webpack.config.js | 2 +- .../AccompanyingCourseController.php | 11 +- .../public/js/AccompanyingCourse.vue | 3 - .../public/js/components/PersonsAssociated.js | 34 +++++ .../js/components/PersonsAssociated.vue | 118 +++++------------- .../Resources/public/js}/index.js | 4 +- .../views/AccompanyingCourse/show.html.twig | 61 ++++++++- .../ChillPersonBundle/chill.webpack.config.js | 2 + 8 files changed, 132 insertions(+), 103 deletions(-) create mode 100644 src/Bundle/ChillPersonBundle/Resources/public/js/components/PersonsAssociated.js rename src/Bundle/{ChillMainBundle/Resources/public/modules/vue => ChillPersonBundle/Resources/public/js}/index.js (52%) diff --git a/src/Bundle/ChillMainBundle/chill.webpack.config.js b/src/Bundle/ChillMainBundle/chill.webpack.config.js index 540900853..6187b31ea 100644 --- a/src/Bundle/ChillMainBundle/chill.webpack.config.js +++ b/src/Bundle/ChillMainBundle/chill.webpack.config.js @@ -56,7 +56,7 @@ module.exports = function(encore, entries) // Chill2 new assets encore.addEntry('forkawesome', __dirname + '/Resources/public/modules/forkawesome/index.js'); encore.addEntry('bootstrap', __dirname + '/Resources/public/modules/bootstrap/index.js'); - encore.addEntry('vuejs', __dirname + '/Resources/public/modules/vue/index.js'); + //encore.addEntry('vuejs', __dirname + '/Resources/public/modules/vue/index.js'); // CKEditor5 buildCKEditor(encore); diff --git a/src/Bundle/ChillPersonBundle/Controller/AccompanyingCourseController.php b/src/Bundle/ChillPersonBundle/Controller/AccompanyingCourseController.php index dd4ba8f2d..6933ca7bb 100644 --- a/src/Bundle/ChillPersonBundle/Controller/AccompanyingCourseController.php +++ b/src/Bundle/ChillPersonBundle/Controller/AccompanyingCourseController.php @@ -96,23 +96,16 @@ class AccompanyingCourseController extends Controller $data = [ 'id' => $accompanyingCourse->getId(), 'remark' => $accompanyingCourse->getRemark(), - 'closing_motive' => $accompanyingCourse->getClosingMotive()->getName()['fr'], + 'closing_motive' => $accompanyingCourse->getClosingMotive() ? $accompanyingCourse->getClosingMotive()->getName()['fr'] : null, 'opening_date' => ($accompanyingCourse->getOpeningDate()) ? $accompanyingCourse->getOpeningDate()->format('Y-m-d') : null, 'closing_date' => ($accompanyingCourse->getClosingDate()) ? $accompanyingCourse->getClosingDate()->format('Y-m-d') : null, 'persons' => $persons ]; - $normalizer = [new ObjectNormalizer()]; - $encoder = [new JsonEncoder()]; - - $serializer = new Serializer($normalizer, $encoder); - $serialized = $serializer->serialize($data,'json', []); - + $serialized = \json_encode($data); $response = new Response($serialized); $response->headers->set('Content-Type', 'application/json'); return $response; } } - - diff --git a/src/Bundle/ChillPersonBundle/Resources/public/js/AccompanyingCourse.vue b/src/Bundle/ChillPersonBundle/Resources/public/js/AccompanyingCourse.vue index fbc7747db..1f8a7ba03 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/js/AccompanyingCourse.vue +++ b/src/Bundle/ChillPersonBundle/Resources/public/js/AccompanyingCourse.vue @@ -14,6 +14,3 @@ } } - - diff --git a/src/Bundle/ChillPersonBundle/Resources/public/js/components/PersonsAssociated.js b/src/Bundle/ChillPersonBundle/Resources/public/js/components/PersonsAssociated.js new file mode 100644 index 000000000..ca0f4ab8a --- /dev/null +++ b/src/Bundle/ChillPersonBundle/Resources/public/js/components/PersonsAssociated.js @@ -0,0 +1,34 @@ +import Vue from 'vue' +import VueResource from 'vue-resource' + +Vue.use(VueResource); + +export default { + template: '#vue-usagers', + delimiters: ['${', '}'], + data () { + return { + persons_associated: [] + }; + }, + http: { + root: 'http://localhost:8001/fr/api' + }, + methods: { + addPerson(){ + this.persons_associated.persons.push({"firstname": "Lisa", "lastname": "Simpson", "startdate": "1975-09-15", "enddate": "2021-04-20" }) + } + }, + computed: { + counter() { + return this.persons_associated.persons.length; + } + }, + created() { + this.$resource('parcours/861/show').get().then((response) => { + this.persons_associated = response.data + }, (response) => { + console.log('erreur', response); + }); + } +}; diff --git a/src/Bundle/ChillPersonBundle/Resources/public/js/components/PersonsAssociated.vue b/src/Bundle/ChillPersonBundle/Resources/public/js/components/PersonsAssociated.vue index d2c29b82e..8954fdf53 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/js/components/PersonsAssociated.vue +++ b/src/Bundle/ChillPersonBundle/Resources/public/js/components/PersonsAssociated.vue @@ -1,88 +1,34 @@ - + import Vue from 'vue' + import VueResource from 'vue-resource' - - - + Vue.use(VueResource) + export default { + template: '#vue-usagers', + delimiters: ['${', '}'], + data () { + return { + persons_associated: [] + } + }, + http: { + root: 'http://localhost:8001/fr/api' + }, + methods: { + addPerson(){ + this.persons_associated.persons.push({"firstname": "Lisa", "lastname": "Simpson", "startdate": "1975-09-15", "enddate": "2021-04-20" }) + } + }, + computed: { + counter() { + return this.persons_associated.persons.length + } + }, + created() { + this.$resource('parcours/861/show').get().then((response) => { + this.persons_associated = response.data + }, (response) => { + console.log('erreur', response); + }) + } + } diff --git a/src/Bundle/ChillMainBundle/Resources/public/modules/vue/index.js b/src/Bundle/ChillPersonBundle/Resources/public/js/index.js similarity index 52% rename from src/Bundle/ChillMainBundle/Resources/public/modules/vue/index.js rename to src/Bundle/ChillPersonBundle/Resources/public/js/index.js index f631d1d0b..8602629a2 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/modules/vue/index.js +++ b/src/Bundle/ChillPersonBundle/Resources/public/js/index.js @@ -1,7 +1,7 @@ import Vue from 'vue' -import App from 'ChillPersonAssets/js/AccompanyingCourse.vue' +import App from './AccompanyingCourse.vue' new Vue({ el: '#app', render: h => h(App) -}) +}); diff --git a/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourse/show.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourse/show.html.twig index 08c3b2b40..cd9d8f84f 100644 --- a/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourse/show.html.twig +++ b/src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourse/show.html.twig @@ -25,7 +25,64 @@ usagers: {% verbatim %}{% endverbatim %} #} -
- {{ encore_entry_script_tags('vuejs') }} +
+ + + + + + {{ encore_entry_script_tags('accompanying_course') }} {% endblock %} diff --git a/src/Bundle/ChillPersonBundle/chill.webpack.config.js b/src/Bundle/ChillPersonBundle/chill.webpack.config.js index b1957108f..69be65e92 100644 --- a/src/Bundle/ChillPersonBundle/chill.webpack.config.js +++ b/src/Bundle/ChillPersonBundle/chill.webpack.config.js @@ -7,4 +7,6 @@ module.exports = function(encore, entries) encore.addAliases({ ChillPersonAssets: __dirname + '/Resources/public' }); + + encore.addEntry('accompanying_course', __dirname + '/Resources/public/js/index.js'); };