Commit 41319c43 authored by Lucas Détré's avatar Lucas Détré

displaying rules on réferentiel page

parent 66762597
......@@ -4,191 +4,85 @@
<div v-if="!this.isLoading">
<div id="ref-header-row">
<div class="container">
<div class="row mb-4">
<div id="ref-count-financements" class="col-md-6 col-sm-12 col-xs-12">
<span id="ref-count-financements-number" class="ref-results-count-number ref-count-financements-text">{{ this.countFinancements }}</span>
<span class="ref-count-financements-text" v-if="this.countFinancements < 2">&nbsp;financement</span>
<span class="ref-count-financements-text" v-else>&nbsp;financements</span>
</div>
<div id="ref-create-financement" class="col-md-6 col-sm-12 col-xs-12 my-auto">
<div class="form-inline pull-right">
<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 />
</div>
</div>
</div>
</div>
<div class="row">
<div id="ref-last-update" class="col-md-12">
Dernière mise à jour le __ à __
<div class="col-md-4">
<br>
<RulesMenu title="Règles régionales" namespace="région"></RulesMenu>
<RulesMenu title="Règles nationales" namespace="règles nationales"></RulesMenu>
<RulesMenu title="Règles des organismes paritaires" namespace="organisme paritaire"></RulesMenu>
<RulesMenu title="Règles de rémunérations" namespace="rémunération"></RulesMenu>
<RulesMenu title="Règles de normalisation" namespace="normalisation"></RulesMenu>
</div>
</div>
</div>
</div>
<hr class="ref-horizontal-separator">
<div id="ref-filter-row" class="container">
<label for="financement-filter-select">Filtrer par</label>
<select id="financement-filter-select" class="form-control" name="financement-filter-select" :change="filtreSelect(selectedFilter)" v-model="selectedFilter">
<option value="" selected>Tous les financements</option>
<optgroup label="Champ d'action">
<option value="national">Financements nationaux</option>
<option value="région">Financements régionaux</option>
</optgroup>
<optgroup label="Public visé">
<option value="DE">Demandeurs d'Emploi</option>
<option value="salarié">Salariés</option>
<option value="TH">Travailleurs Handicapés</option>
<option value="jeune">Personnes Niv inférieur au Bac</option>
</optgroup>
</select>
</div>
<hr class="ref-horizontal-separator">
<div id="ref-result-row" class="container">
<div class="row">
<div id="ref-search-financement" class="col-md-6 col-sm-12 col-xs-12 my-auto">
<span v-if="this.countFinancements < 2" class="ref-results-count">
Résultat (<span class="ref-results-count-number">{{ this.countResultats }}</span>)
</span>
<span v-else class="ref-results-count">
Résultats (<span class="ref-results-count-number">{{ this.countResultats }}</span>)
</span>
</div>
<div id="ref-search-financement" class="col-md-6 col-sm-12 col-xs-12 my-auto">
<div class="form-inline pull-right">
<div class="form-group mx-sm-3 mb-2">
<input class="form-control" id="financement-search-field" name="financement-search" placeholder="Rechercher" v-model="search">
<div class="col-md-8">
<div v-if="this.show">
<br>
<h4> {{ this.ruleToShow.name }}</h4>
<br>
<pre>{{ this.ruleToShow.data }}</pre>
</div>
<div v-else>
<br>
<h4>Sélectionnez une règle.</h4>
<br>
</div>
</div>
</div>
</div>
<div id="ref-results-list">
<ul id="ul-ref-results-list">
<li v-for="financement in this.filteredFinancements" :key="financement.id" class="mt-4 row">
<span class="col-md-3 col-sm-12">
<strong class="ref-fields">{{ financement.intitule }}</strong>
</span>
<span class="col-md-8 col-sm-11">
<span v-for="tag in financement.tags" :key="tag.id" class="ref-results-tags" >
<button class="btn btn-outline-info" href="#" v-on:click="filtreTag(tag); currentTagFilter = tag" :class="{currentTagFilter:tag == currentTagFilter}">
{{ tag }}
</button>
</span>
</span>
<span class="col-md-1 col-sm-1 pull-right">
<button href="https://framagit.org/ybon/trefle/tree/master/trefle/config/financements.yml" target="_blank" class="text-dark btn btn-outline-light" disabled>
<i class="icon" style="vertical-align: baseline;">edit</i>
</button>
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
<div v-else class="text-center">
<img src="./../assets/images/loading.gif" align="center" alt="loading...">
</div>
</div>
</div>
</template>
<script>
import RulesMenu from './RulesMenu.vue'
export default {
name: 'Referentiel',
components: {
RulesMenu
},
methods: {
load: function () {
this.$http.get(process.env.VUE_APP_TREFLE_URL+process.env.VUE_APP_API_VERSION+'/explore/financements').then(response => {
this.financements = response.body;
this.$http.get(process.env.VUE_APP_TREFLE_URL+process.env.VUE_APP_API_VERSION+'/explore/rules').then(response => {
this.rules = response.body;
this.isLoading = false;
}).created;
}
},
computed: {
show: function () {
return (this.windowLocationHash !== '')
},
filterable: function (intitule,tags) {
//replace all accents characters in the search string by their non-accented equivalent
return intitule.concat(tags.join("")).normalize('NFD').replace(/[\u0300-\u036f]/g, "");
},
filtreTag: function (tag) {
this.search = tag;