Commit ba4f1f98 authored by David Foucher's avatar David Foucher

Merge branch 'beautify-rules' into 'vue-editor'

Fixing bugs

See merge request !26
parents 5b8924e8 c4e1a73d
Pipeline #2376 passed with stages
in 9 minutes and 21 seconds
...@@ -201,6 +201,19 @@ ...@@ -201,6 +201,19 @@
background-color : #384EAA; background-color : #384EAA;
color: white; color: white;
} }
.main-button:hover:disabled {
border: 1px solid #384EAA;
background-color : #BDBADE;
color: black;
}
.main-button-primary {
background-color : #384EAA;
color: white;
}
.main-button-primary:hover {
background-color : #0D0850;
color: white;
}
.loading-gif { .loading-gif {
padding-top: 8rem; padding-top: 8rem;
} }
......
...@@ -12,15 +12,16 @@ ...@@ -12,15 +12,16 @@
</div> </div>
</div> </div>
<div class="row mt-3"> <div class="row mt-3">
<div class="col-md-4"> <div class="col-md-4 col-sm-12">
<div id="chart-container"> <div id="chart-container">
<ModificationChart @on-receive="update" :values="modification_chart_datas.datasets" :labels="modification_chart_datas.labels"></ModificationChart> <ModificationChart @on-receive="update" :values="modification_chart_datas.datasets" :labels="modification_chart_datas.labels"></ModificationChart>
</div> </div>
</div> </div>
<div class="col-md-8"> <div v-if="!isLoading">
<div class="col-md-8 col-sm-12">
<div id="modification_list"> <div id="modification_list">
<div v-if="selected_rule"> <div v-if="selected_rule">
<h5> Modification(s) de la règle {{ selected_rule }} ({{ Object.keys(selected_modification_list).length }}) </h5> <h5> Modification(s) de la règle en cours de validation {{ selected_rule }} ({{ Object.keys(selected_modification_list).length }}) </h5>
<ul v-for="modification in selected_modification_list" :key="modification.id" class="dash"> <ul v-for="modification in selected_modification_list" :key="modification.id" class="dash">
<li> <li>
<a :href="'referentiel#'+selected_rule+'.rules#modified'"> {{ modification.title }} </a> <a :href="'referentiel#'+selected_rule+'.rules#modified'"> {{ modification.title }} </a>
...@@ -28,14 +29,20 @@ ...@@ -28,14 +29,20 @@
</ul> </ul>
</div> </div>
<div v-else> <div v-else>
<h5> Toutes les modifications ({{ Object.keys(modification_list).length }})</h5> <h5> Toutes les modifications en cours de validation ({{ Object.keys(modification_list).length }})</h5>
<ul v-for="modification in modification_list" :key="modification.id" class="dash"> <ul v-for="modification in modification_list" :key="modification.id" class="dash">
<li> {{ modification.title }} </li> <li>
<a :href="'referentiel#'+modification.file.split('/').pop().split('.')[0]+'.rules#modified'"> {{ modification.title }} - ({{ modification.file.split('/').pop().split('.')[0] }})</a>
</li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div v-else class="text-center loading-gif">
<img src="./../assets/images/loading.gif" alt="loading...">
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
...@@ -54,6 +61,7 @@ ...@@ -54,6 +61,7 @@
selected_modification_list: {}, selected_modification_list: {},
selected_rule: '', selected_rule: '',
test:0, test:0,
isLoading: true,
} }
}, },
beforeMount: function() { beforeMount: function() {
...@@ -65,9 +73,11 @@ ...@@ -65,9 +73,11 @@
.get('/source/modified') .get('/source/modified')
.then(response => { .then(response => {
this.modification_list = response.body; this.modification_list = response.body;
this.isLoading = false;
return true; return true;
}, response => { }, response => {
if(response.status == 500) this.modification_list = {}; if(response.status == 500) this.modification_list = {};
this.isLoading = false;
return false; return false;
}) })
}, },
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<div id="financement-create-financement" class="col-md-6 col-sm-12 col-xs-12 my-auto"> <div id="financement-create-financement" class="col-md-6 col-sm-12 col-xs-12 my-auto">
<div class="form-inline pull-right"> <div class="form-inline pull-right">
<div class="form-group mx-sm-3 mb-2"> <div class="form-group mx-sm-3 mb-2">
<input type="button" href="#" class="btn btn-outline-success form-control" value="Créer un financement" disabled /> <input type="button" href="#" class="btn main-button form-control" value="Créer un financement" disabled />
</div> </div>
</div> </div>
</div> </div>
......
...@@ -53,7 +53,8 @@ ...@@ -53,7 +53,8 @@
'tag-file-renamed': '<span class="d2h-tag d2h-moved d2h-moved-tag">RENOMMÉ</span>', 'tag-file-renamed': '<span class="d2h-tag d2h-moved d2h-moved-tag">RENOMMÉ</span>',
'tag-file-added': '<span class="d2h-tag d2h-added d2h-added-tag">AJOUTÉ</span>', 'tag-file-added': '<span class="d2h-tag d2h-added d2h-added-tag">AJOUTÉ</span>',
'file-summary-wrapper': '<div class="d2h-file-list-wrapper"><div class="d2h-file-list-header"><span class="d2h-file-list-title">Fichiers modifiés ({{filesNumber}})</span><a class="d2h-file-switch d2h-hide">cacher</a><a class="d2h-file-switch d2h-show">show</a></div><ol class="d2h-file-list">{{{files}}}</ol></div>', 'file-summary-wrapper': '<div class="d2h-file-list-wrapper"><div class="d2h-file-list-header"><span class="d2h-file-list-title">Fichiers modifiés ({{filesNumber}})</span><a class="d2h-file-switch d2h-hide">cacher</a><a class="d2h-file-switch d2h-show">show</a></div><ol class="d2h-file-list">{{{files}}}</ol></div>',
'generic-wrapper': '<div class="d2h-wrapper">{{{content}}}</div>' 'generic-wrapper': '<div class="d2h-wrapper">{{{content}}}</div>',
'file-summary-line':'<li class="d2h-file-list-line"><span class="d2h-file-name-wrapper">{{>fileIcon}}<a href="#'+this.modification.file.split('/').pop()+'" class="d2h-file-name">{{fileName}}</a><span class="d2h-file-stats"><span class="d2h-lines-added">{{addedLines}}</span><span class="d2h-lines-deleted">{{deletedLines}}</span></span></span></li>'
} }
}); });
}, },
......
...@@ -78,14 +78,14 @@ ...@@ -78,14 +78,14 @@
}, },
printRulePath: function () { printRulePath: function () {
var path = ""; var path = "";
var printpath = "("; var printpath = "";
if(this.windowLocationHash.split('#').length -1 > 1) { if(this.windowLocationHash.split('#').length -1 > 1) {
for(var i=1; i <= this.windowLocationHash.split('#').length -1; i++) { for(var i=1; i <= this.windowLocationHash.split('#').length -1; i++) {
if (this.windowLocationHash.split('#').pop() == 'modified') return ""; if (this.windowLocationHash.split('#').pop() == 'modified') return "";
path += "#"+ this.windowLocationHash.split('#')[i]; path += "#"+ this.windowLocationHash.split('#')[i];
if (i == this.windowLocationHash.split('#').length - 1) printpath += "<a href='"+ path + "'>" + this.windowLocationHash.split('#')[i] + "</a>" if (i == this.windowLocationHash.split('#').length - 1) printpath += "<a class='btn main-button' href='"+ path + "'>" + this.windowLocationHash.split('#')[i] + "</a>"
else printpath += "<a href='"+ path + "'>" + this.windowLocationHash.split('#')[i] + "</a> > "; else printpath += "<a class='btn main-button' href='"+ path + "'>" + this.windowLocationHash.split('#')[i] + "</a> <b>></b> ";
} return printpath+")"; } return printpath;
} else return ""; } else return "";
}, },
rulePath: function () { rulePath: function () {
......
...@@ -7,11 +7,16 @@ ...@@ -7,11 +7,16 @@
<h5> <h5>
<span style="vertical-align:-30%" >{{ displayedName }}</span> <span style="vertical-align:-30%" >{{ displayedName }}</span>
</h5> </h5>
<div v-if="this.modifiedHashFlag">
<a :href="'#'+name" v-if="this.modification_count" @click="displayList()" id="modification_link">Retour à la liste</a>
</div>
<div v-else>
<a :href="'#'+name+'#modified'" v-if="this.modification_count" @click="displayModification()" id="modification_link">({{ this.modification_count }} modification<span v-if="this.modification_count > 1">s</span> en cours)</a> <a :href="'#'+name+'#modified'" v-if="this.modification_count" @click="displayModification()" id="modification_link">({{ this.modification_count }} modification<span v-if="this.modification_count > 1">s</span> en cours)</a>
</div> </div>
</div>
<div class="col-md-6 col-sm-12 col-xs-12"> <div class="col-md-6 col-sm-12 col-xs-12">
<h4 v-if="isEditMode" class="pull-right"><em>Modification de la règle</em></h4> <h4 v-if="isEditMode" class="pull-right"><em>Modification de la règle</em></h4>
<input v-else v-b-modal.auth-modal type="button" class="main-button btn pull-right" value="Soumettre une modification"/> <input v-else v-b-modal.auth-modal type="button" class="main-button-primary btn pull-right" value="Soumettre une modification"/>
<!-- TODO: show gitlab link of modification if exists --> <!-- TODO: show gitlab link of modification if exists -->
</div> </div>
</div> </div>
...@@ -32,15 +37,15 @@ ...@@ -32,15 +37,15 @@
</ul> </ul>
</div> </div>
<div v-show="isEditMode"> <div v-show="isEditMode">
<div class="container">
<div class="row mb-3"> <div class="row mb-3">
<div class="col-md-6 pl-0"> <div class="col-md-6 pl-0">
<input @click="closeEdit" type="button" class="btn btn-outline-danger pull-left" value="Annuler"/> <input @click="closeEdit" type="button" class="btn btn-outline-danger pull-left" value="Annuler"/>
</div> </div>
<div class="col-md-6 pr-0"> <div class="col-md-6 pr-0">
<button v-b-modal.mail-modal class="btn btn-outline-success pull-right">Enregistrer</button> <button v-b-modal.mail-modal class="btn main-button-primary pull-right">Enregistrer</button>
</div> </div>
</div> </div>
<div class="container">
<div class="row mb-3"> <div class="row mb-3">
<label for="content"><u>Contenu de la règle</u></label> <label for="content"><u>Contenu de la règle</u></label>
<textarea-autosize id="content" v-model="content" class="rule-modification-text" :class="{editErrorClass: error_flags.notModified }"></textarea-autosize> <textarea-autosize id="content" v-model="content" class="rule-modification-text" :class="{editErrorClass: error_flags.notModified }"></textarea-autosize>
...@@ -51,7 +56,7 @@ ...@@ -51,7 +56,7 @@
<input @click="closeEdit" type="button" class="btn btn-outline-danger pull-left" value="Annuler"/> <input @click="closeEdit" type="button" class="btn btn-outline-danger pull-left" value="Annuler"/>
</div> </div>
<div class="col-md-6 pr-0"> <div class="col-md-6 pr-0">
<button v-b-modal.mail-modal class="btn btn-outline-success pull-right">Enregistrer</button> <button v-b-modal.mail-modal class="btn main-button-primary pull-right">Enregistrer</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -65,7 +70,7 @@ ...@@ -65,7 +70,7 @@
<span v-if="error_flags.noPass" class="text-danger font-weight-light">Ce champ est obligatoire<br></span> <span v-if="error_flags.noPass" class="text-danger font-weight-light">Ce champ est obligatoire<br></span>
<span v-if="!error_flags.noUser && !error_flags.noPass" class="font-weight-light">* Champs obligatoires<br></span> <span v-if="!error_flags.noUser && !error_flags.noPass" class="font-weight-light">* Champs obligatoires<br></span>
<template v-slot:modal-footer> <template v-slot:modal-footer>
<input @click="auth_to_edit" type="button" class="btn btn-outline-success pull-right" value="Suivant"/> <input @click="auth_to_edit" type="button" class="btn main-button-primary pull-right" value="Suivant"/>
</template> </template>
</b-modal> </b-modal>
...@@ -75,7 +80,7 @@ ...@@ -75,7 +80,7 @@
<span v-if="error_flags.noResume" class="text-danger font-weight-light">Ce champ est obligatoire</span> <span v-if="error_flags.noResume" class="text-danger font-weight-light">Ce champ est obligatoire</span>
<span v-if="!error_flags.noUser && !error_flags.noResume" class="font-weight-light">* Champ obligatoire</span> <span v-if="!error_flags.noUser && !error_flags.noResume" class="font-weight-light">* Champ obligatoire</span>
<template v-slot:modal-footer> <template v-slot:modal-footer>
<input @click="save" type="button" class="btn btn-outline-success pull-right" value="Enregistrer"/> <input @click="save" type="button" class="btn main-button-primary pull-right" value="Enregistrer"/>
</template> </template>
</b-modal> </b-modal>
...@@ -105,6 +110,8 @@ ...@@ -105,6 +110,8 @@
props: ['name', 'data', 'path', 'printRulePath', 'rulePath'], props: ['name', 'data', 'path', 'printRulePath', 'rulePath'],
data: function(){ data: function(){
return { return {
windowLocationHash: '',
modifiedHashFlag: decodeURI(window.location.hash).split('#').pop() == "modified",
isLoading: true, isLoading: true,
ruleData: this.data, ruleData: this.data,
modification_list: [], modification_list: [],
...@@ -126,11 +133,13 @@ ...@@ -126,11 +133,13 @@
}, },
} }
}, },
beforeMount: function() { created: function() {
this.loadInProgressModification(); this.loadInProgressModification();
if (decodeURI(window.location.hash).split('#').pop() == "modified") { this.updateLayout();
this.displayModification();
} window.addEventListener('popstate', () => {
this.updateLayout();
})
}, },
computed: { computed: {
displayedName: function () { displayedName: function () {
...@@ -147,6 +156,17 @@ ...@@ -147,6 +156,17 @@
}, },
}, },
methods: { methods: {
updateLayout: function() {
this.windowLocationHash = decodeURI(window.location.hash);
this.modifiedHashFlag = decodeURI(window.location.hash).split('#').pop() == "modified";
if (this.modifiedHashFlag) {
this.currentRuleName = decodeURI(window.location.hash).split('#')[1];
this.displayModification();
} else {
this.currentRuleName = decodeURI(window.location.hash).split('#').pop();
this.viewModification = false;
}
},
loadInProgressModification: function () { loadInProgressModification: function () {
this.$http this.$http
.get('/source/modified?branch='+encodeURIComponent(this.displayedName)) .get('/source/modified?branch='+encodeURIComponent(this.displayedName))
...@@ -210,7 +230,6 @@ ...@@ -210,7 +230,6 @@
}; };
}, },
save: function() { save: function() {
console.log('test');
this.ruleData = this.content this.ruleData = this.content
if (this.comment == '') { if (this.comment == '') {
this.error_flags.noResume = true; this.error_flags.noResume = true;
...@@ -302,7 +321,12 @@ ...@@ -302,7 +321,12 @@
return root; return root;
}, },
displayModification: function () { displayModification: function () {
this.viewModification = !this.viewModification; this.viewModification = true;
this.$parent.collapsed = true;
this.isEditMode = false;
},
displayList: function () {
this.viewModification = false;
this.$parent.collapsed = true; this.$parent.collapsed = true;
this.isEditMode = false; this.isEditMode = false;
} }
......
...@@ -2,6 +2,6 @@ module.exports = { ...@@ -2,6 +2,6 @@ module.exports = {
publicPath: "/0.7/explorer/", publicPath: "/0.7/explorer/",
assetsDir: "src/assets/", assetsDir: "src/assets/",
devServer: { devServer: {
proxy: 'https://trefle.beta.pole-emploi.fr/0.6/' proxy: 'https://trefle.beta.pole-emploi.fr/0.7/'
} }
} }
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment