/// import {PanelCtrl} from 'app/plugins/sdk'; import {contextSrv} from 'app/core/core'; class GettingStartedPanelCtrl extends PanelCtrl { static templateUrl = 'public/app/plugins/panel/gettingstarted/module.html'; checksDone: boolean; stepIndex: number; steps: any; /** @ngInject **/ constructor($scope, $injector, private backendSrv, datasourceSrv, private $q) { super($scope, $injector); this.stepIndex = 0; this.steps = []; this.steps.push({ title: 'Install Grafana', icon: 'icon-gf icon-gf-check', href: 'http://docs.grafana.org/', target: '_blank', note: 'Review the installation docs', check: () => $q.when(true), }); this.steps.push({ title: 'Create your first data source', cta: 'Add data source', icon: 'icon-gf icon-gf-datasources', href: 'datasources/new?gettingstarted', check: () => { return $q.when( datasourceSrv.getMetricSources().filter(item => { return item.meta.builtIn !== true; }).length > 0 ); } }); this.steps.push({ title: 'Create your first dashboard', cta: 'New dashboard', icon: 'icon-gf icon-gf-dashboard', href: 'dashboard/new?gettingstarted', check: () => { return this.backendSrv.search({limit: 1}).then(result => { return result.length > 0; }); } }); this.steps.push({ title: 'Invite your team', cta: 'Add Users', icon: 'icon-gf icon-gf-users', href: 'org/users?gettingstarted', check: () => { return this.backendSrv.get('/api/org/users').then(res => { return res.length > 1; }); } }); this.steps.push({ title: 'Install apps & plugins', cta: 'Explore plugin repository', icon: 'icon-gf icon-gf-apps', href: 'https://grafana.com/plugins?utm_source=grafana_getting_started', check: () => { return this.backendSrv.get('/api/plugins', {embedded: 0, core: 0}).then(plugins => { return plugins.length > 0; }); } }); } $onInit() { this.stepIndex = -1; return this.nextStep().then(res => { this.checksDone = true; }); } nextStep() { if (this.stepIndex === this.steps.length - 1) { return this.$q.when(); } this.stepIndex += 1; var currentStep = this.steps[this.stepIndex]; return currentStep.check().then(passed => { if (passed) { currentStep.cssClass = 'completed'; return this.nextStep(); } currentStep.cssClass = 'active'; return this.$q.when(); }); } dismiss() { this.dashboard.removePanel(this.panel, false); this.backendSrv.request({ method: 'PUT', url: '/api/user/helpflags/1', showSuccessAlert: false, }).then(res => { contextSrv.user.helpFlags1 = res.helpFlags1; }); } } export {GettingStartedPanelCtrl, GettingStartedPanelCtrl as PanelCtrl};