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

Go to download
Show more of this group Show more artifacts with this name
Show all versions of vertigo-ui Show documentation
There is a newer version: 4.2.0
Vue.component('v-extensions-store', {
	template : 
''
+'	'
+'		'
+'			'
+'				'
+'			'
+'			'
+'				{{extension.label}}
'
+'				{{extension.description}}'
+'			'
+'		'
+'	'
+''
	,
	props : {
		activeSkills : { type: Array, required : true }
	},
	data: function() {
	    return {
	        extensions: [],
	    }
	},
	created: function() {
		var availableExtensions = [
				{name : "vertigo-audit", label : "Audit", description:"Trace every single aspect of your app through exhaustive logging capabilities.", color:"#F7578C", icon : "fas fa-clipboard-list", enabled : false },
				{name : "vertigo-dashboard", label : "Dashboard", description:"Monitor you system to make sure your app meets the customer requirements.", color:"#742774", icon : "fas fa-chart-line", enabled : false },
				{name : "vertigo-geo", label : "Geo", description:"Enhance your data by enabling geographic functions and tools." , icon : "fas fa-globe", color:"#0E2947", enabled : false },
				{name : "vertigo-ledger", label : "Ledger", description:"Use a blockchain to enforce secure transactions in your app !" , icon : "fas fa-link", color:"#00AC5C", enabled : false },
				{name : "vertigo-orchestra", label : "Orchestra", description:"Manage jobs and monitor their status with this powerfull control tower.", color:"#FC636B", icon : "fas fa-tasks", enabled : false },
				{name : "vertigo-quarto", label : "Quarto", description:"Generate slick documents and reports using the Quarto template engine.", color:"#0747A6", icon : "fas fa-file-invoice", enabled : false },
				{name : "vertigo-social", label : "Social", description:"Ensure real time communication and collaboration between your app users.", color:"#FF3366", icon : "far fa-comments", enabled : false },
				{name : "vertigo-stella", label : "Stella", description:"Enable multi-node task dispatching for your app and assign specific tasks to each node.", color:"#0066FF", icon : "fas fa-network-wired", enabled : false }
		];
		
    	availableExtensions.forEach(function (availableExtension) {
    		availableExtension.enabled = this.$props.activeSkills.indexOf(availableExtension.name) > -1 ;
    	}.bind(this));

    	this.extensions = availableExtensions;
	},
	methods :  {
		getIconStyle : function (color) {
			return 'border: 3px solid '+ color+'; background-color: '+color+'; color: white; padding: 5px; width: 70px; height: 70px;';
		}
	}
})