Commit 549192fc authored by David Foucher's avatar David Foucher

Add filter to scenorio page WIP

parent 502280cc
Pipeline #2059 failed with stage
in 1 minute and 7 seconds
......@@ -1396,9 +1396,9 @@
"dev": true
},
"serialize-javascript": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-2.1.0.tgz",
"integrity": "sha512-a/mxFfU00QT88umAJQsNWOnUKckhNCqOl028N48e7wFmo2/EHpTo9Wso+iJJCMrQnmFvcjto5RJdAHEvVhcyUQ==",
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-2.1.2.tgz",
"integrity": "sha512-rs9OggEUF0V4jUSecXazOYsLfu7OGK2qIn3c7IPBiffz32XniEp/TX9Xmc9LQfK2nQ2QKHvZ2oygKUGU0lG4jQ==",
"dev": true
},
"slash": {
......@@ -3298,9 +3298,9 @@
"dev": true
},
"serialize-javascript": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-2.1.0.tgz",
"integrity": "sha512-a/mxFfU00QT88umAJQsNWOnUKckhNCqOl028N48e7wFmo2/EHpTo9Wso+iJJCMrQnmFvcjto5RJdAHEvVhcyUQ==",
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-2.1.2.tgz",
"integrity": "sha512-rs9OggEUF0V4jUSecXazOYsLfu7OGK2qIn3c7IPBiffz32XniEp/TX9Xmc9LQfK2nQ2QKHvZ2oygKUGU0lG4jQ==",
"dev": true
},
"slash": {
......
This diff is collapsed.
......@@ -4,27 +4,27 @@
<div class="row">
<div class="col-md-6">
<ul>
<li v-for="filter in this.filters" :key="filter.id">
<a href="#" :title="filter">
<li v-for="filter in filterList" :key="filter.id">
<a href="#" :class="{selected: filters[filter].selected}" :title="filter" @click="selectToggle(filters[filter])">
{{ filter }}
</a>
</li>
</ul>
<div v-if="this.selected_filters.length && this.active.length">
<div v-if="nbSelected">
<ul>
<li v-for="active in this.active" :key="active.id">
<li v-for="scenario in activeScenario" :key="scenario.id">
<h4>
{{ active.name }}
<a :href="'https://framagit.org/ybon/trefle/tree/master/'+active.filename+'#L'+active.line" target=_blank>
{{ scenario.name }}
<a :href="'https://framagit.org/ybon/trefle/tree/master/'+scenario.filename+'#L'+scenario.line" target=_blank>
<i class=icon>edit</i>
</a>
</h4>
</h4>
</li>
</ul>
</div>
</div>
<div class="col-md-6">
<div v-if="!this.selected_filters.length">
<div v-if="!nbSelected">
<p>Sélectionner au moins une catégorie dans le menu.</p>
</div>
</div>
......@@ -41,13 +41,14 @@
active: [],
selected_filters: [],
filters: [],
toggled: ""
toggled: "",
}
},
methods: {
load: function () {
this.$http.get('/explore/scenarios').then(response => {
this.scenarios = response.body
this.selected_filters = decodeURIComponent(this.$route.params.filters).split(',')
if(this.filters) {
this.active = []
}
......@@ -55,17 +56,73 @@
scenario = this.scenarios[i]
if (scenario.tags.length>0) {
for (var k = 0; k < scenario.tags.length; k++) {
if (this.filters.indexOf(scenario.tags[k]) === -1) this.filters.push(scenario.tags[k])
if (this.filters.indexOf(scenario.tags[k]) === -1)
{
var isSelected=(this.selected_filters.indexOf(scenario.tags[k]) > -1)
this.filters.push({tag:scenario.tags[k], selected:isSelected})
}
}
}
this.active.push(scenario)
}
this.filters.sort((a, b) => a.localeCompare(b))
this.filters.sort((a, b) => a.tag.localeCompare(b.tag))
this.filters = this.filters.reduce(function(filters, item){ filters[item.tag]=item; return filters }, {})
}).created;
},
selectToggle: function(item){
item.selected = !item.selected
this.$router.append('test')
}
},
created: function () {
this.load();
},
computed: {
activeScenario: function(){
var activeScenario = []
var scenarios = this.scenarios
this.filterList.forEach(function(tag){
scenarios.forEach(function(scenario){
var idx = scenario.tags.indexOf(tag)
if(idx > -1 && !(idx in activeScenario)){
activeScenario[idx]=scenario
}
})
})
return activeScenario
},
filterList: function(){
var filterList = []
var scenarios = this.scenarios
Object.values(this.filters).forEach(function(filter){
if(filter.selected){
scenarios.forEach(function(scenario){
if(scenario.tags.indexOf(filter.tag) > -1){
scenario.tags.forEach(function(tag){
if(filterList.indexOf(tag) === -1){
filterList.push(tag)
}
})
}
})
}
});
if(filterList.length === 0) filterList = Object.keys(this.filters)
filterList.sort((a, b) => a.localeCompare(b))
return filterList
},
selectedItem: function(){
var itemList = Object.values(this.filters).reduce(function(selected, item){ if(item.selected && selected.indexOf(item.tag) === -1) selected.push(item); return selected }, []);
if(itemList.length === 0)
itemList = this.filters
return itemList;
},
nbSelected: function(){
return Object.values(this.selectedItem).reduce(function(cnt, item){ if(item.selected) cnt=cnt+1; return cnt},0);
}
//active: function(){
// return Object.values(this.filters).reduce(function(cnt, item){ if(item.selected) cnt=cnt+1; return cnt},0);
//}
}
}
</script>
......@@ -21,15 +21,15 @@ const routes = [
{ path: '/referentiel', name: 'referentiel', component: Referentiel },
{ path: '/financements', name: 'financements', component: Financements },