<div class="Prompt">
    <at-modal ng-if="vm.promptDataClone">
        <at-tab-group>
            <at-tab ng-if="vm.steps.inventory.tab" state="vm.steps.inventory.tab">{{:: vm.strings.get('prompt.INVENTORY') }}</at-tab>
            <at-tab ng-if="vm.steps.credential.tab" state="vm.steps.credential.tab">{{:: vm.strings.get('prompt.CREDENTIAL') }}</at-tab>
            <at-tab ng-if="vm.steps.other_prompts.tab" state="vm.steps.other_prompts.tab">{{:: vm.strings.get('prompt.OTHER_PROMPTS') }}</at-tab>
            <at-tab ng-if="vm.steps.survey.tab" state="vm.steps.survey.tab">{{:: vm.strings.get('prompt.SURVEY') }}</at-tab>
            <at-tab state="vm.steps.preview.tab">{{:: vm.strings.get('prompt.PREVIEW') }}</at-tab>
        </at-tab-group>
        <div class="Prompt-step">
            <div ng-if="vm.steps.inventory.includeStep" ng-show="vm.steps.inventory.tab._active">
                <prompt-inventory prompt-data="vm.promptDataClone"></prompt-inventory>
            </div>
            <div ng-if="vm.steps.credential.includeStep" ng-show="vm.steps.credential.tab._active">
                <prompt-credential
                    prompt-data="vm.promptDataClone"
                    credential-passwords-form="vm.forms.credentialPasswords"
                    prevent-creds-with-passwords="vm.preventCredsWithPasswords">
                </prompt-credential>
            </div>
            <div ng-if="vm.steps.other_prompts.includeStep" ng-show="vm.steps.other_prompts.tab._active">
                <prompt-other-prompts prompt-data="vm.promptDataClone" other-prompts-form="vm.forms.otherPrompts" is-active-step="vm.steps.other_prompts.tab._active"></prompt-other-prompts>
            </div>
            <div ng-if="vm.steps.survey.includeStep" ng-show="vm.steps.survey.tab._active">
                <prompt-survey prompt-data="vm.promptDataClone" survey-form="vm.forms.survey"></prompt-survey>
            </div>
            <div ng-if="vm.steps.preview.tab._active">
                <prompt-preview prompt-data="vm.promptDataClone"></prompt-preview>
            </div>
        </div>
        <div class="Prompt-footer">
            <button class="Prompt-defaultButton" ng-click="vm.cancel()">{{:: vm.strings.get('CANCEL') }}</button>
            <button class="Prompt-actionButton" ng-show="vm.steps.inventory.tab._active" ng-click="vm.next(vm.steps.inventory.tab)" ng-disabled="!vm.vm.promptDataClone.prompts.inventory.value.id">{{:: vm.strings.get('NEXT') }}</button>
            <button class="Prompt-actionButton"
                ng-show="vm.steps.credential.tab._active"
                ng-click="vm.next(vm.steps.credential.tab)"
                ng-disabled="(preventCredsWithPasswords && (vm.promptDataClone.prompts.credentials.passwords.ssh || vm.promptDataClone.prompts.credentials.passwords.become || vm.promptDataClone.prompts.credentials.passwords.ssh_key_unlock || (vm.promptDataClone.prompts.credentials.passwords.vault && vm.promptDataClone.prompts.credentials.passwords.vault.length > 0))) ||
                 !vm.forms.credentialPasswords.$valid ||
                 (vm.promptData.credentialTypeMissing && vm.promptData.credentialTypeMissing.length > 0)">{{:: vm.strings.get('NEXT') }}</button>
            <button class="Prompt-actionButton" ng-show="vm.steps.other_prompts.tab._active" ng-click="vm.next(vm.steps.other_prompts.tab)" ng-disabled="!vm.forms.otherPrompts.$valid">{{:: vm.strings.get('NEXT') }}</button>
            <button class="Prompt-actionButton" ng-show="vm.steps.survey.tab._active" ng-click="vm.next(vm.steps.survey.tab)" ng-disabled="!vm.forms.survey.$valid">{{:: vm.strings.get('NEXT') }}</button>
            <button class="Prompt-actionButton" ng-show="vm.steps.preview.tab._active" ng-click="vm.finish()" ng-bind="vm.actionText" ng-disabled="vm.actionButtonClicked"></button>
        </div>
    </at-modal>
</div>
