84 lines
2.0 KiB
JavaScript
84 lines
2.0 KiB
JavaScript
import Step from 'new-dashboard/components/Onboarding/components/Step.vue';
|
|
import Header from 'new-dashboard/components/Onboarding/components/Header.vue';
|
|
import Footer from 'new-dashboard/components/Onboarding/components/Footer.vue';
|
|
import Modal from 'new-dashboard/components/Modal.vue';
|
|
|
|
import mixin from '../tutorials/mixin';
|
|
import template from './template.html';
|
|
import './style.scss';
|
|
|
|
const defaultComponentConfiguration = {
|
|
template,
|
|
components: {
|
|
Step,
|
|
Header,
|
|
Footer,
|
|
Modal
|
|
},
|
|
mixins: [mixin]
|
|
};
|
|
|
|
/**
|
|
* Onboarding Wizard Creation
|
|
*
|
|
* Function to create a new wizard from a defined steps
|
|
*
|
|
* @param {string} name - Name for the generated wizard.
|
|
* @param {array} steps - Wizard's steps definition.
|
|
*
|
|
* Each step within the array needs to follow this format:
|
|
* { stepName: <String>, component: <ComponentObject> }
|
|
*
|
|
* stepName: Name that the step takes in the wizard
|
|
* component: Vue component object definition for the Step
|
|
*/
|
|
|
|
export function createWizard (name = '', steps = {}, showFooter = true) {
|
|
const stepsLength = Object.keys(steps).length;
|
|
|
|
if (!steps || !stepsLength) {
|
|
throw new Error('Steps components are needed to generate a Wizard');
|
|
}
|
|
|
|
const wizardConfiguration = generateWizardConfiguration(name, steps, showFooter);
|
|
|
|
return {
|
|
...defaultComponentConfiguration,
|
|
...wizardConfiguration
|
|
};
|
|
}
|
|
|
|
function generateWizardConfiguration (name, steps, showFooter) {
|
|
// Generate Wizard configuration
|
|
const { components, stepNames } = parseSteps(steps);
|
|
|
|
const wizardComponents = {
|
|
...defaultComponentConfiguration.components,
|
|
...components
|
|
};
|
|
|
|
return {
|
|
name,
|
|
components: wizardComponents,
|
|
data () {
|
|
return {
|
|
wizardName: name,
|
|
stepNames,
|
|
showFooter
|
|
};
|
|
}
|
|
};
|
|
}
|
|
|
|
function parseSteps (steps) {
|
|
const components = {};
|
|
const stepNames = [];
|
|
|
|
Object.values(steps).forEach(component => {
|
|
components[component.name] = component;
|
|
stepNames.push(component.stepName);
|
|
});
|
|
|
|
return { components, stepNames };
|
|
}
|