mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
rename and cleaning
This commit is contained in:
parent
928e0e1eed
commit
b0fc4e190f
@ -1,20 +0,0 @@
|
||||
|
||||
import Vue from 'vue';
|
||||
|
||||
const AccompanyingCourseComponent = {
|
||||
data() {
|
||||
return {
|
||||
id: 7,
|
||||
persons_associated: []
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
let app = Vue.CreateApp({
|
||||
delimiters: ['${', '}']
|
||||
})
|
||||
.component(AccompanyingCourseComponent)
|
||||
;
|
||||
|
||||
|
||||
app.mount('#app');
|
@ -1,105 +1,88 @@
|
||||
<template>
|
||||
<div id="kkk">
|
||||
<h3>Usagers concernés</h3>
|
||||
<dl>
|
||||
<dt>id</dt>
|
||||
<dd>{{ course.id }}</dd>
|
||||
<dt>opening_date</dt>
|
||||
<dd>{{ course.opening_date }}</dd>
|
||||
<dt>closing_date</dt>
|
||||
<dd>{{ course.closing_date }}</dd>
|
||||
<dt>remarkzzzzz</dt>
|
||||
<dd>{{ course.remark }}</dd>
|
||||
<dt>closing_motive</dt>
|
||||
<dd>{{ course.closing_motive }}</dd>
|
||||
</dl>
|
||||
<label>{{counter}} usagers concernés</label>
|
||||
<table class="rounded">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="chill-orange">firstname</th>
|
||||
<th class="chill-orange">lastname</th>
|
||||
<th class="chill-orange">startdate</th>
|
||||
<th class="chill-orange">enddate</th>
|
||||
<th class="chill-orange">actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="person in course.persons">
|
||||
<td>{{ person.firstname }}</td>
|
||||
<td>{{ person.lastname }}</td>
|
||||
<td>{{ person.startdate }}</td>
|
||||
<td>{{ person.enddate }}</td>
|
||||
<td>
|
||||
<ul class="record_actions">
|
||||
<li><a class="sc-button bt-show"></a></li>
|
||||
<li><a class="sc-button bt-update"></a></li>
|
||||
<li><a class="sc-button bt-delete"></a></li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<button class="sc-button bt-create" @click="addPerson">Add Person</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Usagers concernés</h3>
|
||||
<dl>
|
||||
<dt>id</dt>
|
||||
<dd>{{ accompanying_course.id }}</dd>
|
||||
<dt>opening_date</dt>
|
||||
<dd>{{ accompanying_course.opening_date }}</dd>
|
||||
<dt>closing_date</dt>
|
||||
<dd>{{ accompanying_course.closing_date }}</dd>
|
||||
<dt>remark</dt>
|
||||
<dd>{{ accompanying_course.remark }}</dd>
|
||||
<dt>closing_motive</dt>
|
||||
<dd>{{ accompanying_course.closing_motive }}</dd>
|
||||
</dl>
|
||||
<label>{{counter}} usagers concernés</label>
|
||||
<table class="rounded">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="chill-orange">firstname</th>
|
||||
<th class="chill-orange">lastname</th>
|
||||
<th class="chill-orange">startdate</th>
|
||||
<th class="chill-orange">enddate</th>
|
||||
<th class="chill-orange">actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="person in accompanying_course.persons">
|
||||
<td>{{ person.firstname }}</td>
|
||||
<td>{{ person.lastname }}</td>
|
||||
<td>{{ person.startdate }}</td>
|
||||
<td>{{ person.enddate }}</td>
|
||||
<td>
|
||||
<ul class="record_actions">
|
||||
<li><a class="sc-button bt-show"></a></li>
|
||||
<li><a class="sc-button bt-update"></a></li>
|
||||
<li><a class="sc-button bt-delete"></a></li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<button class="sc-button bt-create" @click="addPerson">Add Person</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createApp } from 'vue';
|
||||
|
||||
const App = {
|
||||
name: 'AppAccompanyingCourse',
|
||||
//delimiters: ['${', '}'], works only for template "in browser", not for template in vue files
|
||||
data() {
|
||||
return { course:
|
||||
{
|
||||
id: 50,
|
||||
opening_date: null,
|
||||
closing_date: null,
|
||||
remark: 'bim',
|
||||
closing_motive: 'bam',
|
||||
counter: 0,
|
||||
persons: []
|
||||
}
|
||||
};
|
||||
export default {
|
||||
name: 'AccompanyingCourse',
|
||||
data() {
|
||||
return {
|
||||
accompanying_course: {}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
accompanyingCourseId() {
|
||||
return window.accompanyingCourseId;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addPerson() {
|
||||
this.accompanying_course.persons.push({
|
||||
"firstname": "Lisa",
|
||||
"lastname": "Simpson",
|
||||
"startdate": "1975-09-15",
|
||||
"enddate": "2021-04-20"
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
courseId() {
|
||||
return window.courseId;
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
console.log('mounted');
|
||||
console.log(this.data);
|
||||
console.log(this.courseId);
|
||||
await this.getCourse();
|
||||
console.log(this.data);
|
||||
console.log('mounted stop');
|
||||
},
|
||||
methods: {
|
||||
async getCourse() {
|
||||
console.log('get course start');
|
||||
console.log(this);
|
||||
courseId = this.courseId;
|
||||
let data_;
|
||||
return fetch(`/fr/api/parcours/${courseId}/show`)
|
||||
async getAccompanyingCourse() {
|
||||
let data_;
|
||||
return fetch(`/fr/api/parcours/${accompanyingCourseId}/show`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
console.log(data);
|
||||
console.log(this);
|
||||
this.$data.course = data;
|
||||
console.log(this.data);
|
||||
console.log('get course finish');
|
||||
});
|
||||
}
|
||||
this.$data.accompanying_course = data;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
export default App;
|
||||
},
|
||||
async mounted() {
|
||||
await this.getAccompanyingCourse();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style scoped></style>
|
||||
|
@ -1,34 +0,0 @@
|
||||
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);
|
||||
});
|
||||
}
|
||||
};
|
@ -1,34 +1 @@
|
||||
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);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -2,8 +2,8 @@ import AccompanyingCourseComponent from './AccompanyingCourse.vue';
|
||||
import { createApp } from 'vue';
|
||||
|
||||
const app = createApp({
|
||||
name: 'AccCourseGlobal',
|
||||
template: '<div class="abcde"><accompanying-course></accompanying-course></div>',
|
||||
name: 'AppGlobal',
|
||||
template: '<div class="vue-component"><accompanying-course></accompanying-course></div>',
|
||||
})
|
||||
.component('accompanying-course', AccompanyingCourseComponent)
|
||||
.mount('#app');
|
||||
|
@ -6,16 +6,14 @@
|
||||
|
||||
{% block content %}
|
||||
|
||||
<h1>{{ block('title') }}</h1>
|
||||
<h1>{{ block('title') }}</h1>
|
||||
|
||||
<div id="app"></div>
|
||||
|
||||
<script type="text/javascript">
|
||||
window.courseId = {{ accompanyingCourse.id|e('js') }};
|
||||
console.log(window.courseId);
|
||||
</script>
|
||||
|
||||
|
||||
<div id="app"></div>
|
||||
|
||||
{{ encore_entry_script_tags('accompanying_course') }}
|
||||
{{ encore_entry_script_tags('accompanying_course') }}
|
||||
|
||||
<script type="text/javascript">
|
||||
window.accompanyingCourseId = {{ accompanyingCourse.id|e('js') }};
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
Loading…
x
Reference in New Issue
Block a user