506 lines
13 KiB
Vue
506 lines
13 KiB
Vue
<template>
|
|
|
|
<div id='HEADER'>
|
|
|
|
<!-- Department management -->
|
|
<div class='departments' data-unblur-department>
|
|
|
|
<div class='current' data-unblur-department>
|
|
<span class='create' @click='!department.create?(department.newLabel="")+(department.create=true):d_create()'></span>
|
|
<span class='remove' @click='d_remove()'></span>
|
|
<input v-if='department.create' type='text' placeholder='Nouveau nom' v-model='department.newLabel' size=''>
|
|
<span v-if='!department.create' @click='department.dialog=!department.dialog' data-unblur-department>{{ get_dcurrent().label }}</span>
|
|
</div>
|
|
|
|
<div class='department-dialog' v-show='department.dialog' data-unblur-department>
|
|
<span v-for='d in department.list' v-show='d.id!=department.current' @click='d_switch(d.id)' data-unblur-department>{{ d.label }}</span>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Version management -->
|
|
<div class='versions' data-unblur-version>
|
|
|
|
<div class='current' :data-id='get_vcurrent().id' data-unblur-version>
|
|
<span class='remove' @click='v_remove()'></span>
|
|
<span class='edit' @click='!version.edit?(version.newName="")+(version.edit=true):v_edit()'></span>
|
|
<input v-if='version.edit' type='text' :placeholder='get_vcurrent().name' v-model='version.newName' size=''>
|
|
<span v-if='!version.edit' @click='version.dialog=!version.dialog' data-unblur-version>{{ get_vcurrent().name }}</span>
|
|
</div>
|
|
|
|
<div class='version-dialog' v-show='version.dialog' data-unblur-version>
|
|
<span v-for='v in version.list' @click='v_switch(v.id)' v-show='v.id!=version.current' :data-id='v.id' data-unblur-version> {{ v.name }} </span>
|
|
<span @click='v_create()' data-unblur-version data-id='-1'>Créer</span>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Export all -->
|
|
<div class='global-export'>
|
|
<div class='current export' @click='global_export()'>
|
|
<span class='export'></span>
|
|
exporter
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
export default {
|
|
name: 'HEADER',
|
|
data(){
|
|
return {
|
|
gstore: gstore.get,
|
|
is_connected: _SERVER.session.connected,
|
|
|
|
department: {
|
|
dialog: false,
|
|
current: _SERVER.session.department_id,
|
|
list: _SERVER.session.departments,
|
|
create: false,
|
|
newLabel: ''
|
|
},
|
|
|
|
version: {
|
|
dialog: false,
|
|
current: -1,
|
|
list: [],
|
|
edit: false,
|
|
newName: ''
|
|
}
|
|
};
|
|
},
|
|
methods: {
|
|
|
|
/* (1) Get current department data
|
|
---------------------------------------------------------*/
|
|
get_dcurrent(id){
|
|
|
|
// use @current, if invalid argument @id
|
|
( isNaN(id) ) && ( id = this.department.current );
|
|
|
|
// search in @list where id is @current
|
|
for( var d in this.department.list )
|
|
if( this.department.list[d].id == id )
|
|
return this.department.list[d];
|
|
|
|
return { id: -2, name: null };
|
|
|
|
},
|
|
|
|
/* (2) Get current version data
|
|
---------------------------------------------------------*/
|
|
get_vcurrent(id){
|
|
|
|
// use @version.current, if invalid argument @id
|
|
( isNaN(id) ) && ( id = this.version.current );
|
|
|
|
// search in @ist where id is @id
|
|
for( var v in this.version.list )
|
|
if( this.version.list[v].id == id )
|
|
return this.version.list[v];
|
|
|
|
return { id: -2, name: '-' };
|
|
|
|
},
|
|
|
|
/* (3) Switch to other department
|
|
---------------------------------------------------------*/
|
|
d_switch(id){
|
|
|
|
// 1. De-activate dialogs
|
|
this.department.dialog = false;
|
|
this.version.dialog = false;
|
|
|
|
// 2. Do nothing if no change
|
|
if( this.department.current == id )
|
|
return;
|
|
|
|
// 3. Ask for department change
|
|
api.call(`PUT department/${id}`, {}, function(rs){
|
|
|
|
// 1. error -> do nothing
|
|
if( rs.error !== 0 || rs.switched !== true )
|
|
return;
|
|
|
|
// 2. Update GUI
|
|
this.department.current = id;
|
|
|
|
// 3. Reload page if needed
|
|
setTimeout(() => { document.location = ''; }, 200);
|
|
|
|
}.bind(this));
|
|
|
|
},
|
|
|
|
/* (4) Switch to other version
|
|
---------------------------------------------------------*/
|
|
v_switch(id){
|
|
|
|
// 1. De-activate dialogs
|
|
this.department.dialog = false;
|
|
this.version.dialog = false;
|
|
|
|
// 2. Do nothing if no change
|
|
if( this.version.current == id )
|
|
return;
|
|
|
|
// 3. Ask for department change
|
|
api.call(`GET department/version/switch/${id}`, {}, function(rs){
|
|
|
|
// 1. error -> do nothing
|
|
if( rs.error !== 0 )
|
|
return;
|
|
|
|
// 2. Update GUI
|
|
this.version.current = id;
|
|
|
|
// 3. Reload page if needed
|
|
setTimeout(() => { document.location = ''; }, 200);
|
|
|
|
}.bind(this));
|
|
|
|
},
|
|
|
|
/* (5) Create a new empty department
|
|
---------------------------------------------------------*/
|
|
d_create(){
|
|
|
|
// 1. De-activate dialogs
|
|
this.department.dialog = false;
|
|
this.version.dialog = false;
|
|
|
|
// get current department
|
|
var cur = this.get_dcurrent();
|
|
if( cur.id < 0 || this.department.newLabel.length < 1 ){
|
|
this.department.create = false;
|
|
return;
|
|
}
|
|
|
|
var newlabel = this.department.newLabel;
|
|
|
|
// 2. Popup confirm
|
|
(new Promise( (resolve, reject) => {
|
|
|
|
popup.ask({
|
|
title: 'Confirmation de création de département',
|
|
content: `Le nouveau département <b>${newlabel}</b> va être créé; il ne contiendra aucune donnée, il permet de gérer plusieurs départements ne partageant pas les mêmes UEs, enseignants, formations, etc<br><br>Voulez-vous créer un nouveau département vide ?`,
|
|
action: 'Créer',
|
|
type: 'valid'
|
|
}, (popup_rs) => { popup_rs && resolve() });
|
|
|
|
// 3. On popup confirm
|
|
})).then( () => {
|
|
|
|
// Call API to create a new department
|
|
api.call(`POST department/`, {name:newlabel}, function(rs){
|
|
|
|
// 1. error -> popup
|
|
if( rs.error !== 0 || !rs.hasOwnProperty('created_id') ){
|
|
|
|
return popup.ask({
|
|
title: 'Erreur ('+rs.error+')',
|
|
content: 'La création de département a échoué.',
|
|
action: 'OK',
|
|
type: 'neutral'
|
|
}, () => {});
|
|
|
|
}
|
|
|
|
// 3. Update GUI
|
|
this.department.list.push( { id: parseInt(rs.created_id), name: newlabel } );
|
|
|
|
}.bind(this));
|
|
|
|
});
|
|
|
|
},
|
|
|
|
/* (5) Create a new version from now
|
|
---------------------------------------------------------*/
|
|
v_create(){
|
|
|
|
// 1. De-activate dialogs
|
|
this.department.dialog = false;
|
|
this.version.dialog = false;
|
|
|
|
// 2. Popup confirm
|
|
(new Promise( (resolve, reject) => {
|
|
|
|
popup.ask({
|
|
title: 'Confirmation de création de version',
|
|
content: `Une sauvegarde (ou version) va être crée à partir de l'état actuel des données de tout le département<br><br>Voulez-vous créer cette sauvegarde ?`,
|
|
action: 'Créer',
|
|
type: 'valid'
|
|
}, (popup_rs) => { popup_rs && resolve() });
|
|
|
|
// 3. On popup confirm
|
|
})).then( () => {
|
|
|
|
let newVersionName = `${this.get_vcurrent().name}*`;
|
|
// Call API to create a new version
|
|
api.call(`POST department/version/`, {label:newVersionName}, function(rs){
|
|
|
|
// 1. error -> popup
|
|
if( rs.error !== 0 || !rs.hasOwnProperty('created_id') ){
|
|
|
|
return popup.ask({
|
|
title: 'Erreur ('+rs.error+')',
|
|
content: 'La création de version à échoué.',
|
|
action: 'OK',
|
|
type: 'neutral'
|
|
}, () => {});
|
|
|
|
}
|
|
|
|
// 3. Update GUI
|
|
this.version.list.push( { id: parseInt(rs.created_id), name: newVersionName } );
|
|
|
|
}.bind(this));
|
|
|
|
});
|
|
|
|
},
|
|
|
|
/* (6) Rename a version
|
|
---------------------------------------------------------*/
|
|
v_edit(){
|
|
|
|
// get current version
|
|
var cur = this.get_vcurrent();
|
|
if( cur.id < 0 || this.version.newName.length < 1 ){
|
|
this.version.edit = false;
|
|
return;
|
|
}
|
|
|
|
var newname = this.version.newName;
|
|
|
|
// 2. Popup confirm
|
|
(new Promise( (resolve, reject) => {
|
|
|
|
popup.ask({
|
|
title: 'Confirmation de modification de version',
|
|
content: `La version <b>${cur.name}</b> va être renommée en <b>${newname}</b><br><br>Voulez-vous valider cette modification ?`,
|
|
action: 'Valider',
|
|
type: 'search'
|
|
}, (popup_rs) => { popup_rs && resolve() });
|
|
|
|
// 3. On popup confirm
|
|
})).then( () => {
|
|
|
|
// Call API to create a new version
|
|
api.call(`PUT department/version/${cur.id}`, {label:newname}, function(rs){
|
|
|
|
// 1. error -> popup
|
|
if( rs.error !== 0 || !rs.hasOwnProperty('updated') ){
|
|
|
|
return popup.ask({
|
|
title: 'Erreur ('+rs.error+')',
|
|
content: 'La modification a échoué.',
|
|
action: 'OK',
|
|
type: 'neutral'
|
|
}, () => {});
|
|
|
|
}
|
|
|
|
// 3. Update GUI
|
|
cur.name = newname;
|
|
|
|
}.bind(this));
|
|
|
|
}).finally( () => {
|
|
this.version.edit = false;
|
|
})
|
|
|
|
},
|
|
|
|
/* (7) Remove a department
|
|
---------------------------------------------------------*/
|
|
d_remove(){
|
|
|
|
// get current department
|
|
var cur = this.get_dcurrent();
|
|
if( cur.id < 0 )
|
|
return;
|
|
|
|
// if last department -> forbid
|
|
if( this.department.list.length < 2 ){
|
|
return popup.ask({
|
|
title: 'Dernier départment',
|
|
content: `Le département <b>${cur.label}</b> ne peut être supprimé car il est le dernier disponible`,
|
|
action: 'OK',
|
|
type: 'invalid'
|
|
});
|
|
}
|
|
|
|
// 2. Popup confirm
|
|
(new Promise( (resolve, reject) => {
|
|
|
|
popup.ask({
|
|
title: 'Confirmation de suppression',
|
|
content: `Le département <b>${cur.label}</b> va être supprimé. Toutes les données seront perdues de manière définitive</b><br><br>Voulez-vous supprimer ce département ?`,
|
|
action: 'Supprimer',
|
|
type: 'invalid'
|
|
}, (popup_rs) => { popup_rs && resolve() });
|
|
|
|
// 3. On popup confirm
|
|
})).then( () => {
|
|
|
|
// Call API to delete the current department
|
|
api.call(`DELETE department/${cur.id}`, {}, function(rs){
|
|
|
|
// 1. error -> popup
|
|
if( rs.error !== 0 || !rs.hasOwnProperty('deleted') ){
|
|
|
|
return popup.ask({
|
|
title: 'Erreur ('+rs.error+')',
|
|
content: 'La suppression a échoué.',
|
|
action: 'OK',
|
|
type: 'neutral'
|
|
}, () => {});
|
|
|
|
}
|
|
|
|
// 3. Reload page
|
|
document.location = '';
|
|
|
|
}.bind(this));
|
|
|
|
});
|
|
|
|
},
|
|
|
|
/* (7) Remove a version
|
|
---------------------------------------------------------*/
|
|
v_remove(){
|
|
|
|
// get current version
|
|
var cur = this.get_vcurrent();
|
|
if( cur.id < 0 )
|
|
return;
|
|
|
|
// if last version -> forbid
|
|
if( this.version.list.length < 2 ){
|
|
return popup.ask({
|
|
title: 'Dernière version',
|
|
content: `La version <b>${cur.name}</b> ne peut être supprimée car il ne reste aucune autre version pour ce département`,
|
|
action: 'OK',
|
|
type: 'invalid'
|
|
});
|
|
}
|
|
|
|
// 2. Popup confirm
|
|
(new Promise( (resolve, reject) => {
|
|
|
|
popup.ask({
|
|
title: 'Confirmation de suppression',
|
|
content: `La version <b>${cur.name}</b> va être supprimée. Toutes les données seront perdues de manière définitive</b><br><br>Voulez-vous supprimer cette version ?`,
|
|
action: 'Supprimer',
|
|
type: 'invalid'
|
|
}, (popup_rs) => { popup_rs && resolve() });
|
|
|
|
// 3. On popup confirm
|
|
})).then( () => {
|
|
|
|
// Call API to create a new version
|
|
api.call(`DELETE department/version/${cur.id}`, {}, function(rs){
|
|
|
|
// 1. error -> popup
|
|
if( rs.error !== 0 || !rs.hasOwnProperty('deleted') ){
|
|
|
|
return popup.ask({
|
|
title: 'Erreur ('+rs.error+')',
|
|
content: 'La suppression a échoué.',
|
|
action: 'OK',
|
|
type: 'neutral'
|
|
}, () => {});
|
|
|
|
}
|
|
|
|
// 3. Reload page
|
|
document.location = '';
|
|
|
|
}.bind(this));
|
|
|
|
});
|
|
|
|
},
|
|
|
|
|
|
/* (x) Exports all data about this department's version
|
|
---------------------------------------------------------*/
|
|
global_export(){
|
|
|
|
api.call(`GET department/export`, {}, function(rs){
|
|
|
|
// 1. error -> popup
|
|
if( rs.error !== 0 || !rs.hasOwnProperty('link') ){
|
|
|
|
return popup.ask({
|
|
title: 'Erreur ('+rs.error+')',
|
|
content: 'L\'export a échoué.',
|
|
action: 'OK',
|
|
type: 'neutral'
|
|
}, () => {});
|
|
|
|
}
|
|
|
|
// 2. Launch download
|
|
document.location = rs.link;
|
|
|
|
}.bind(this));
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
beforeMount(){
|
|
|
|
/* (1) Try to fetch versions from API */
|
|
api.call('GET department/version', {}, function(rs){
|
|
|
|
// 1. Manage error
|
|
if( rs.error !== 0 || !rs.hasOwnProperty('versions') )
|
|
return;
|
|
|
|
// 2. Init version list
|
|
this.version.list = [];
|
|
|
|
// 3. Store versions
|
|
for( var ver of rs.versions ){
|
|
|
|
// if current version -> set @version.current
|
|
if( _SERVER.session.version.current === ver.iddatabase )
|
|
this.version.current = ver.iddatabase
|
|
|
|
// add version to list
|
|
this.version.list.push( { id: ver.iddatabase, name: ver.label, new_name: ver.label } );
|
|
|
|
}
|
|
|
|
this.version
|
|
|
|
}.bind(this) );
|
|
|
|
|
|
|
|
/* (2) Set onblur to hide department lists */
|
|
window.onblur.link('header.department', (e) => {
|
|
|
|
// only hide not [data-unblur-department] elements
|
|
if( e.target.getAttribute('data-unblur-department') === null )
|
|
this.department.dialog = false;
|
|
|
|
// only hide not [data-unblur-version] elements
|
|
if( e.target.getAttribute('data-unblur-version') === null )
|
|
this.version.dialog = false;
|
|
|
|
});
|
|
|
|
}
|
|
}
|
|
</script> |