• Home
• io.vertigo
• vertigo-ui
• 2.1.0
• source code
• v-facets.js

×

Project download

Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance.
Project price only 1 $

You can buy this project and download/modify it how often you want.

io.vertigo.ui.static.js.v-components.v-facets.js Maven / Gradle / Ivy

Vue.component('v-facets', {
  template: '
'
 + '	
'
 + '		
'
 + '			{{facetLabelByCode(selectedFacet)}}: {{facetValueLabelByCode(selectedFacet, selectedFacetValue)}}'
 + '			'
 + '		
'
 + '	
'
 + '	'
 + '		{{facet.label}}'
 + '	  		'
 + ' 				'
 + ' 					'
 + ' 				'
 + '	  			{{value.label}} {{value.count}}'
 + '	  		'
 + '			{{$q.lang.vui.facets.showAll}}'
 + '			{{$q.lang.vui.facets.showLess}}'
 + '	'
 + '
'
  ,
  props: {
    facets: Array,
    selectedFacets: Object,
    contextKey: String,
    maxValues: {
    	type : Number,
    	default : 5
    }
  },
  computed: {
  },
  data : function() {
	  return {
		  expandedFacets:[]
	  }
  },
  methods: {
	  facetByCode : function (facetCode) {
		  return this.facets.filter(function (facet) {
			  return facet.code === facetCode;
		  })[0];
	  },
	  facetLabelByCode : function (facetCode) {
		  return this.facetByCode(facetCode).label;
	  },
	  facetValueLabelByCode : function (facetCode, facetValueCode) {
		  return this.facetByCode(facetCode).values.filter(function (facetValue) {
			  return facetValue.code === facetValueCode;
		  })[0].label;
	  },
	  isAnyFacetValueSelected : function() {
		  for(var facetCode in this.selectedFacets) {
			  if(this.selectedFacets[facetCode].length > 0) {
				  return true;
			  }
		  } 
		  return false;
	  },
	  isFacetValueSelected : function (facetCode, facetValueCode){
		  return this.selectedFacets[facetCode].includes(facetValueCode);
	  },
	  isFacetSelected : function (facetCode){
		  return this.selectedFacets[facetCode].length > 0;
	  },
	  facetValueLabel : function (label, count){
		  return label + ' (' + count + ')';
	  },
	  expandFacet : function (facetCode){
		  if (!this.isFacetExpanded(facetCode)) {
			  this.$data.expandedFacets.push(facetCode);
		  }
	  },
	  reduceFacet : function (facetCode){
		  if (this.isFacetExpanded(facetCode)) {
			  this.$data.expandedFacets.splice( this.$data.expandedFacets.indexOf(facetCode), 1);
		  }
	  },
	  isFacetExpanded : function (facetCode){
		 return this.$data.expandedFacets.includes(facetCode);
	  },
	  visibleFacets : function (facetCode, facetValues){
		  if (!this.isFacetExpanded(facetCode)) {
			  return  facetValues.slice(0, this.maxValues);
		  }
		  return facetValues;
	  }
  }
})