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

139 lines
5.9 KiB
Vue

<template>
<div id='CONTAINER' class='card'>
<div class='card container'>
<input class='card instant-search neutral' type='text' @keyup='gstore.is_handler($event)' placeholder='Recherche instantannée' id='ue_view_instant_search'>
<button class='card toggle valid' :data-active='gstore.create_card?1:0' @click='gstore.create_card=!gstore.create_card' title='Créer une UE'>+</button>
<section class='valid' data-create='' v-show='gstore.create_card'>
<select v-model='gstore.create_form' class='category'>
<option selected='selected' disabled='disabled' value='-'>Formation par défaut</option>
<option value='-1'>Aucune formation par défaut</option>
<option v-for='form in gstore.formations' :value='form.idForm'>{{ form.labelForm }}</option>
</select>
<h1>
<input type='text' placeholder='Libellé' v-model='gstore.create_label'>
<span data-visible='1'>(<input type='text' placeholder='code' v-model='gstore.create_code'>)</span>
</h1>
<div :class="gstore.create_err.length > 0 ? 'sub warning' : 'sub'" :data-valid='gstore.create_err_valid?1:0'>{{ gstore.create_err }}</div>
<div class='footer'>
<span class='course'><input type='text' placeholder='???' v-model='gstore.create_vol.c'><span>Cours</span></span>
<hr>
<span class='td'><input type='text' placeholder='???' v-model='gstore.create_vol.td'><span>TD</span></span>
<hr>
<span class='tp'><input type='text' placeholder='???' v-model='gstore.create_vol.tp'><span>TP</span></span>
</div>
<div class='footer'>
<button class='valid' @click='gstore.ic_handler()'>Créer l'UE</button>
</div>
</section>
<section v-if='gstore.ues.length <= 0'>Aucune UE trouvée</section>
<section v-for='(ue, pi) in gstore.ues'
:class="gstore.edit_i==pi ? 'search' : ''"
:data-id='ue.code'
:data-anim-outgoing='gstore.open_anim.fade < 0 ? 0 : 1'
:data-label='ue.label'>
<!-- if VIEW MODE -->
<div class='goo-menu' v-show='gstore.edit_i!=pi'>
<div class='enabled' :data-enabled='ue.code' :data-active='ue.disabled?0:1' title='UE activée' @click="gstore.ia_handler(pi)"></div>
<div class='remove' :data-remove='ue.code' title='Supprimer' @click="gstore.ir_handler(ue.code)"></div>
<div class='edit' :data-edit='ue.code' title='Modifier' @click="gstore.ie_toggle(pi)"></div>
</div>
<!-- if VIEW MODE -->
<span v-show='gstore.edit_i!=pi' class='category'>{{ ue.labelForm || 'Aucune formation par défaut' }}</span>
<!-- if EDIT MODE -->
<select v-show='gstore.edit_i==pi' v-model='gstore.edit_form' class='category'>
<option selected='selected' disabled='disabled' value='-'>Formation par défaut</option>
<option value='-1'>Aucune formation par défaut</option>
<option v-for='form in gstore.formations' :value='form.idForm'>{{ form.labelForm }}</option>
</select>
<!-- endif -->
<!-- if VIEW MODE -->
<h1 v-show='gstore.edit_i!=pi'>{{ ue.label }}<span :data-visible='1'>({{ ue.code }})</span></h1>
<!-- if EDIT MODE -->
<h1 v-show='gstore.edit_i==pi' :class="ue.required ? 'warning' : ''">
<input type='text' placeholder='Libellé' v-model='gstore.edit_label'>
<span :data-visible='1'>({{ ue.code }})</span>
<!-- <span data-visible='1'>(<input type='text' placeholder='code' v-model='gstore.edit_code'>)</span> -->
</h1>
<!-- endif -->
<!-- if VIEW MODE -->
<div v-show='gstore.edit_i!=pi' :class="ue.required ? 'sub warning' : 'sub'">{{ ue.required ? 'UE obligatoire' : 'UE optionnelle' }}</div>
<div v-show='gstore.edit_i!=pi' class='sub'><strong>{{ ue.volumeCours + ue.volumeTD + ue.volumeTP }}h</strong> totales</div>
<div v-show='gstore.edit_i!=pi' class='taglist'>
<span v-for='form_id in ue.formations' :class="!!gstore.form_by_id(form_id).isInternal ? 'search' : ''">{{ gstore.form_by_id(form_id).labelForm }}</span>
<span class='search'>M2 INFO (S1)</span>
<span>LPRO</span>
</div>
<!-- if EDIT MODE -->
<div v-show='gstore.edit_i==pi' :class="gstore.edit_err.length > 0 ? 'sub warning' : 'sub'" :data-valid='gstore.edit_err_valid?1:0'>{{ gstore.edit_err }}</div>
<!-- endif -->
<div class='footer'>
<!-- if VIEW MODE -->
<span v-show='gstore.edit_i!=pi' :class="(ue.volumeCours == 0) ? 'course' : 'course active'">{{ ue.volumeCours }}h <span>Cours</span></span>
<hr v-show='gstore.edit_i!=pi'>
<span v-show='gstore.edit_i!=pi' :class="(ue.volumeTD == 0) ? 'td' : 'td active'">{{ ue.volumeTD }}h <span>TD</span></span>
<hr v-show='gstore.edit_i!=pi'>
<span v-show='gstore.edit_i!=pi' :class="(ue.volumeTP == 0) ? 'tp' : 'tp active'">{{ ue.volumeTP }}h <span>TP</span></span>
<!-- if EDIT MODE -->
<span v-show='gstore.edit_i==pi' class='course'><input type='text' placeholder='???' v-model='gstore.edit_vol.c'><span>Cours</span></span>
<hr v-show='gstore.edit_i==pi'>
<span v-show='gstore.edit_i==pi' class='td'><input type='text' placeholder='???' v-model='gstore.edit_vol.td'><span>TD</span></span>
<hr v-show='gstore.edit_i==pi'>
<span v-show='gstore.edit_i==pi' class='tp'><input type='text' placeholder='???' v-model='gstore.edit_vol.tp'><span>TP</span></span>
<!-- endif -->
</div>
<!-- if VIEW MODE -->
<div class='footer' v-show='gstore.edit_i!=pi'>
<button class='neutral' @click='gstore.nav_in($router, pi)'>Configurer</button>
</div>
<!-- if EDIT MODE -->
<div class='footer' v-show='gstore.edit_i==pi'>
<button class='search' @click='gstore.ie_handler(pi)'>Modifier l'UE</button>
<button class='grey' @click='gstore.ie_toggle(-1)'>Annuler</button>
</div>
<!-- endif -->
</section>
</div>
</div>
</template>
<script>
export default {
name: 'CONTAINER_VIEW',
data(){
return { gstore: gstore.get }
}
}
</script>s