ptut-vhost/webpack/component/ue/manage.vue

<template>

	<div id='CONTAINER' class='list'>

		<div class='list container' data-anim-incoming='1' :data-anim-bounce='gstore.nav_anim.out?1:0'>

			<!-- <button @click='gstore.nav_out($router)'>Retour</button> -->

			<!-- FILTERS -->
			<section class='filter'>

				<div>Type</div>
				<div>enseignant</div>
				<div>volume horaire</div>
				<div>formations</div>

			</section>

			<!-- COURS -->
			<section class='cours'
				v-for='c in gstore.manage.cours'
				:data-id='c.idCours'>

				<div>Cours</div>
				<div :data-prof='c.idProf'>{{ c.idProf ? `${c.firstName} ${c.lastName}` : 'Aucun enseignant affecté' }}</div>
				<div>{{ c.volume }}</div>
				<div class='taglist'>
					<div v-for='f in c.formations' data-action>
					 	<span class='tag'>{{ gstore.form_by_id(f).labelForm || '???' }}</span>
						<span data-remove @click='gstore.rem_for(0, c.idCours, f)'></span>
					</div>

					<div data-action>
					 	<select class='tag'>
						 	<option value='-' disbabled selected>Ajouter</option>
						 	<option
							 	v-for='f in gstore.formations'
								v-show='c.formations.indexOf(f.idForm) < 0'
								:value='f.idForm'>{{ f.labelForm }}</option>
						 </select>
						<span class='pointer' data-create @click='gstore.add_for(0, c.idCours)'></span>
					</div>
				</div>

			</section>


			<!-- TD -->
			<section class='td'
				v-for='td in gstore.manage.td'
				:data-id='td.idTD'
				data-anim-incoming='1'
				:data-anim-bounce='gstore.nav_anim.out?1:0'>

				<div>TD</div>
				<div :data-prof='td.idProf'>{{ td.idProf ? `${td.firstName} ${td.lastName}` : 'Aucun enseignant affecté' }}</div>
				<div>{{ td.volume }}</div>
				<div class='taglist'>
					<div v-for='f in td.formations' data-action>
					 	<span class='tag'>{{ gstore.form_by_id(f).labelForm || '???' }}</span>
						<span data-remove @click='gstore.rem_for(1, td.idTD, f)'></span>
					</div>

					<div data-action>
					 	<select class='tag'>
						 	<option value='-' disbabled selected>Ajouter</option>
						 	<option
							 	v-for='f in gstore.formations'
								v-show='td.formations.indexOf(f.idForm) < 0'
								:value='f.idForm'>{{ f.labelForm }}</option>
						 </select>
						<span class='pointer' data-create @click='gstore.add_for(1, td.idTD)'></span>
					</div>
				</div>

			</section>


			<!-- TP -->
			<section class='tp'
				v-for='tp in gstore.manage.tp'
				:data-id='tp.idTP'
				data-anim-incoming='1'
				:data-anim-bounce='gstore.nav_anim.out?1:0'>

				<div>TP</div>
				<div :data-prof='tp.idProf'>{{ tp.idProf ? `${tp.firstName} ${tp.lastName}` : 'Aucun enseignant affecté' }}</div>
				<div>{{ tp.volume }}</div>
				<div class='taglist'>
					<div v-for='f in tp.formations' data-action>
					 	<span class='tag'>{{ gstore.form_by_id(f).labelForm || '???' }}</span>
						<span data-remove @click='gstore.rem_for(2, tp.idTP, f)'></span>
					</div>

					<div data-action>
					 	<select class='tag'>
						 	<option value='-' disbabled selected>Ajouter</option>
						 	<option
							 	v-for='f in gstore.formations'
								v-show='tp.formations.indexOf(f.idForm) < 0'
								:value='f.idForm'>{{ f.labelForm }}</option>
						 </select>
						<span class='pointer' data-create @click='gstore.add_for(2, tp.idTP)'></span>
					</div>
				</div>

			</section>
		</div>


	</div>

</template>




<script>

	export default {
		name: 'CONTAINER_VIEW',
		data(){
			return { gstore: gstore.get }
		},
		beforeMount(){
			gstore.get.manage_load(this.$route.params.code, this.$router);
		}
	}

</script>