Commit b7157950 authored by Lucas Détré's avatar Lucas Détré

beautifying rule and rule menu display

parent 1da30af5
Pipeline #2164 passed with stage
in 1 minute and 19 seconds
......@@ -3,20 +3,24 @@
<div id="referentiel-main-div">
<div v-if="!this.isLoading">
<div id="referentiel-main-row">
<div class="container">
<div class="container ml-5 mr-5">
<div class="row">
<div class="col-md-4">
<h2 class="mb-5">MENU</h2>
<RulesMenu title="Règles régionales" namespace="région" class="rules-menu" @click="this.forceRerender()"></RulesMenu>
<RulesMenu title="Règles nationales" namespace="règles nationales" class="rules-menu"></RulesMenu>
<RulesMenu title="Règles des organismes paritaires" namespace="organisme paritaire" class="rules-menu"></RulesMenu>
<RulesMenu title="Règles de rémunérations" namespace="rémunération" class="rules-menu"></RulesMenu>
<RulesMenu title="Règles de normalisation" namespace="normalisation" class="rules-menu"></RulesMenu>
</div>
<div class="col-md-1">
<hr class="referentiel-vertical-separator">
<div class="col-md-4 col-sm-12 col-xs-12">
<div class="row">
<div class="col-md-11 col-sm-11 col-xs-11">
<h2 class="mb-5">MENU</h2>
<RulesMenu title="Règles régionales" namespace="région" class="rules-menu" @click="this.forceRerender()"></RulesMenu>
<RulesMenu title="Règles nationales" namespace="règles nationales" class="rules-menu"></RulesMenu>
<RulesMenu title="Règles des organismes paritaires" namespace="organisme paritaire" class="rules-menu"></RulesMenu>
<RulesMenu title="Règles de rémunérations" namespace="rémunération" class="rules-menu"></RulesMenu>
<RulesMenu title="Règles de normalisation" namespace="normalisation" class="rules-menu"></RulesMenu>
</div>
<div class="col-md-1 col-sm-1 col-xs-1">
<hr class="referentiel-vertical-separator">
</div>
</div>
</div>
<div class="col-md-7">
<div class="col-md-8 col-sm-12 col-xs-12">
<div v-if="this.show">
<Rule :data="this.currentRuleContent" :name="this.currentRuleName" :key="this.rerenderKey"></Rule>
</div>
......@@ -58,6 +62,7 @@
return (this.windowLocationHash !== '')
},
currentRuleContent: function() {
this.forceRerender();
if(this.windowLocationHash !== '') return this.rules[this.currentRuleName]['data'];
else return null;
},
......
<template>
<div id="Rule">
<div class="container mb-5">
<div class="mb-5">
<div class="row">
<div class="col-md-6 col-sm-12 col-xs-12">
<h4>{{ this.name }}</h4>
<h4>
<span>{{ this.name }}</span>
</h4>
</div>
<div class="col-md-6 col-sm-12 col-xs-12 my-auto">
<div v-show="!isEditMode" class="form-inline pull-right">
<div class="form-group mx-sm-3">
<input @click="edit" type="button" class="btn btn-outline-success form-control" value="Soumettre une modification"/>
<!-- TODO: show gitlab link of modification if exists -->
</div>
</div>
<div class="col-md-6 col-sm-12 col-xs-12">
<h4 v-show="isEditMode" class="pull-right"><em>Édition de la règle</em></h4>
<input v-show="!isEditMode" @click="edit" type="button" class="btn btn-outline-success pull-right" value="Soumettre une modification"/>
<!-- TODO: show gitlab link of modification if exists -->
</div>
</div>
</div>
......@@ -23,18 +22,22 @@
</div>
<div v-show="isEditMode">
<!-- rule-editor ref="editor" :rawRule="ruleToEdit"></rule-editor -->
<label for="comment" class="mb-2"><u>Résumé de la modification</u></label>
<textarea v-model="comment"></textarea>
<label for="content"><u>Contenu de la règle</u></label>
<textarea v-model="content" class="mb-2"></textarea>
<div class="form-inline pull-left">
<div class="form-group mx-sm-3 mb-2">
<input @click="closeEdit" type="button" class="btn btn-outline-danger form-control" value="Annuler"/>
<div class="container">
<div class="row mb-3">
<label for="comment" class="mb-2"><u>Résumé de la modification</u></label>
<textarea v-model="comment"></textarea>
</div>
</div>
<div class="form-inline pull-right">
<div class="form-group mx-sm-3 mb-2">
<input @click="save" type="button" class="btn btn-outline-success form-control" value="Enregistrer"/>
<div class="row mb-3">
<label for="content"><u>Contenu de la règle</u></label>
<textarea v-model="content" class="mb-3"></textarea>
</div>
<div class="row mb-3">
<div class="col-md-6 pl-0">
<input @click="closeEdit" type="button" class="btn btn-outline-danger pull-left" value="Annuler"/>
</div>
<div class="col-md-6 pr-0">
<input @click="save" type="button" class="btn btn-outline-success pull-right" value="Enregistrer"/>
</div>
</div>
</div>
</div>
......
<template>
<li>
<div
:class="{bold: isFolder}"
@dblclick="makeFolder">
{{ item.name }}
<span v-if="isFolder" @click="toggle">[{{ isOpen ? '-' : '+' }}]</span>
<div :class="{bold: isFolder}" @dblclick="makeFolder">
<div v-if="isFolder" @click="toggle">
<span>{{ item.name }}</span>
<span class="btn btn-outline-info pull-right" style="width:5%"><strong>{{ isOpen ? '-' : '+' }}</strong></span>
</div>
<span v-else v-html="transform(item.name)"></span>
</div>
<hr class="">
<ul v-show="isOpen" v-if="isFolder">
<tree-item
<TreeItem
class="item"
v-for="(child, index) in item.children"
:key="index"
:item="child"
@make-folder="$emit('make-folder', $event)"
@add-item="$emit('add-item', $event)"
></tree-item>
></TreeItem>
<!-- li class="add" @click="$emit('add-item', item)">+</li -->
</ul>
</li>
......@@ -42,7 +43,22 @@ export default {
this.$emit('make-folder', this.item)
this.isOpen = true
}
}
},
transform: function(data) {
return data.replace(/Si /g, '<span class="text-muted font-weight-light">Si </span>')
.replace(/Soit /g, '<span class="text-muted font-weight-light">Soit </span>')
.replace(/Quand /g, '<span class="text-muted font-weight-light">Quand </span>')
.replace(/Scénario: /g, '<span class="text-muted font-weight-light">Scénario: </span>')
.replace(/Ou /g, '<span class="text-muted font-weight-light">Ou </span>')
.replace(/, ou /g, '<span class="text-muted font-weight-light">, ou </span>')
.replace(/Et /g, '<span class="text-muted font-weight-light">Et </span>')
.replace(/, et /g, '<span class="text-muted font-weight-light">, et </span>')
.replace(/Alors /g, '<span class="text-muted font-weight-light">Alors </span>')
.replace(/(#.+)/g, "<em class=\"comment\">$1</em>")
.replace(/appliquer les règles «([^»]+?)(.rules)?»/g, 'appliquer les règles « <a href="#$1.rules" class="btn btn-outline-info" title="Ouvrir les règles" style="display:inline-block">$1</a> »')
.replace(/(«.+»)/g, "<span class=\"string\">$1</span>")
.replace(/,([^ ])/g, ", $1");
},
},
computed: {
isFolder: function() {
......
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