import { Component, inject } from '@angular/core';
import { OnboardingService } from '@yelon/abc/onboarding';
import { _HttpClient } from '@yelon/theme';
import { NzButtonModule } from 'ng-zorro-antd/button';
@Component({
selector: 'components-onboarding-multiple-pages',
template: `
<div class="mb-md pb-md border-bottom-1">
<button class="test2-1" nz-button nzType="primary">First Button</button>
<button class="test2-3" nz-button nzType="dashed">Third Button</button>
</div>
<button nz-button (click)="start()">Start</button>
`,
standalone: true,
imports: [NzButtonModule]
})
export class ComponentsOnboardingMultiplePagesComponent {
private readonly srv = inject(OnboardingService);
start(): void {
this.srv.start({
items: [
{
selectors: '.test2-1',
content: 'The user guidance is to help users better understand and use the product',
next: `Go to home`,
width: 300,
url: '/components/onboarding'
},
{
selectors: '.page-banner__slogan',
content:
'ng-yunzai is an MIT-licensed open source project. In order to achieve better and sustainable development of the project, we expect to gain more backers. You can support us in any of the following ways, Or purchasing our <a href="https://e.ng.yunzainfo.com/" target="_blank">business theme</a>',
width: 300,
url: '/',
before: 200
},
{
selectors: '.test2-3',
title: 'Test3',
content: 'The user guidance is to help users better understand and use the product',
url: '/components/onboarding'
}
]
});
}
}