import { Component, inject } from '@angular/core';
import { YelonFormModule, SFSchema } from '@yelon/form';
import type { SFQrCodeWidgetSchema } from '@yelon/form/widgets/qr-code';
import { NzMessageService } from 'ng-zorro-antd/message';
@Component({
  selector: 'form-qr-code-simple',
  template: `<sf [schema]="schema" (formSubmit)="submit($event)" />`,
  imports: [YelonFormModule]
})
export class FormQrCodeSimpleComponent {
  private readonly msg = inject(NzMessageService);
  schema: SFSchema = {
    properties: {
      base: {
        type: 'string',
        title: 'Base',
        default: 'https://ng.yunzainfo.com/',
        ui: {
          widget: 'qr-code',
          refresh: console.log
        } as SFQrCodeWidgetSchema
      },
      icon: {
        type: 'string',
        title: 'With Icon',
        default: 'https://ng.yunzainfo.com/',
        ui: {
          widget: 'qr-code',
          icon: 'https://ng.yunzainfo.com/assets/logo-color.svg',
          bordered: true
        } as SFQrCodeWidgetSchema
      },
      color: {
        type: 'string',
        title: 'Color',
        default: 'https://ng.yunzainfo.com/',
        ui: {
          widget: 'qr-code',
          color: '#f50'
        } as SFQrCodeWidgetSchema
      }
    }
  };
  submit(value: {}): void {
    this.msg.success(JSON.stringify(value));
  }
}