import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { finalize } from 'rxjs';
import { NotifyService } from 'abp-ng2-module';
import { BsModalRef } from 'ngx-bootstrap/modal';
import { AdminServiceServiceProxy, CategorySubDto, ResultDto } from '@shared/service-proxies/service-proxies';

@Component({
  selector: 'app-help2-subcat',
  templateUrl: './help2-subcat.component.html',
})
export class Help2SubcatComponent implements OnInit{
 
  constructor(
    private _adminService: AdminServiceServiceProxy,
    public bsModalRef: BsModalRef,
    public notify: NotifyService
  ) { }

  saving = false;
  data: CategorySubDto;
  Name: string;
  Description: string;
  Code: string;
  ImageUrl: string | undefined;
  CategoryTypeId: number | undefined;
  selectedMasterId: number;
  

  @Output() onSave = new EventEmitter<any>();

  ngOnInit(): void {
    if(!this.data.id) {
      this.data.name = this.Name;
      this.data.code = this.Code;
      this.data.description = this.Description;
      this.data.imageUrl = this.ImageUrl;
      this.data.categoryTypeId = this.CategoryTypeId;
      this.data.masterCategoryId = this.selectedMasterId
    }
  }

  save() {
    this.saving = true;
    this._adminService.setCategorySub(this.data)
      .pipe(
        finalize(() => {
          //finishedCallback();
        })
      )
      .subscribe((result: ResultDto) => {
        if (result.success) {
          this.notify.success("İşlem Başarılı");
          this.saving = false;
          this.bsModalRef.hide();
          this.onSave.emit();
        }
      },
        () => {
          this.saving = false;
        }
      );
  }
}
------------------------------
export class CategorySubDto implements ICategorySubDto {
    id: number;
    masterCategoryId: number | undefined;
    name: string | undefined;
    code: string | undefined;
    description: string | undefined;
    imageUrl: string | undefined;
    categoryTypeId: number | undefined;
    constructor(data?: ICategorySubDto) {
        if (data) {
            for (var property in data) {
                if (data.hasOwnProperty(property))
                    (<any>this)[property] = (<any>data)[property];
            }
        }
    }

    init(_data?: any) {
        if (_data) {
            this.id = _data["id"];
            this.masterCategoryId = _data["masterCategoryId"];
            this.name = _data["name"];
            this.code = _data["code"];
            this.description = _data["description"];
            this.imageUrl = _data["imageUrl"];
            this.categoryTypeId = _data["categoryTypeId"];
        }
    }

    static fromJS(data: any): CategorySubDto {
        data = typeof data === 'object' ? data : {};
        let result = new CategorySubDto();
        result.init(data);
        return result;
    }

    toJSON(data?: any) {
        data = typeof data === 'object' ? data : {};
        data["id"] = this.id;
        data["masterCategoryId"] = this.masterCategoryId;
        data["name"] = this.name;
        data["code"] = this.code;
        data["description"] = this.description;
        data["imageUrl"] = this.imageUrl;
        data["categoryTypeId"] = this.categoryTypeId;
        return data;
    }

    clone(): CategorySubDto {
        const json = this.toJSON();
        let result = new CategorySubDto();
        result.init(json);
        return result;
    }
}

export interface ICategorySubDto {
    id: number;
    masterCategoryId: number | undefined;
    name: string | undefined;
}
------------------------------

<form class="form-horizontal" autocomplete="off" #createdataModal="ngForm" (ngSubmit)="save()">
    <abp-modal-header title="Alt Kategori" (onCloseClick)="bsModalRef.hide()"></abp-modal-header>
    <div class="modal-body">
        <div class="form-group row required">
            <label class="col-md-3 col-form-label" for="name">
                Başlık
            </label>
            <div class="col-md-9">
                <input type="text" class="form-control" name="name" id="name" required maxlength="32"
                    [(ngModel)]="data.name" #nameModel="ngModel" #nameEl />
                <abp-validation-summary [control]="nameModel" [controlEl]="nameEl"></abp-validation-summary>
            </div>
        </div>
        <div class="form-group row required">
            <label class="col-md-3 col-form-label" for="surname">
                Ana Kategori
            </label>
            <div class="col-md-9">
                <input type="number" class="form-control" name="surname" id="surname" required maxlength="32"
                    [(ngModel)]="data.masterCategoryId" #surnameModel="ngModel" #surnameEl />
                <abp-validation-summary [control]="surnameModel" [controlEl]="surnameEl"></abp-validation-summary>
            </div>
        </div>
        <div class="form-group row required">
            <label class="col-md-3 col-form-label" for="name">
                Kod
            </label>
            <div class="col-md-9">
                <input type="text" class="form-control" name="name" id="name" required maxlength="32"
                    [(ngModel)]="data.code" #nameModel="ngModel" #nameEl />
                <abp-validation-summary [control]="nameModel" [controlEl]="nameEl"></abp-validation-summary>
            </div>
        </div>
        <div class="form-group row required">
            <label class="col-md-3 col-form-label" for="name">
                Açıklama
            </label>
            <div class="col-md-9">
                <input type="text" class="form-control" name="name" id="name" required maxlength="32"
                    [(ngModel)]="data.description" #nameModel="ngModel" #nameEl />
                <abp-validation-summary [control]="nameModel" [controlEl]="nameEl"></abp-validation-summary>
            </div>
        </div>
        <div class="form-group row required">
            <label class="col-md-3 col-form-label" for="name">
                Fotoğraf
            </label>
            <div class="col-md-9">
                <input type="text" class="form-control" name="name" id="name" required maxlength="32"
                    [(ngModel)]="data.imageUrl" #nameModel="ngModel" #nameEl />
                <abp-validation-summary [control]="nameModel" [controlEl]="nameEl"></abp-validation-summary>
            </div>
        </div>
        <div class="form-group row required">
            <label class="col-md-3 col-form-label" for="name">
                Kategori Tipi
            </label>
            <div class="col-md-9">
                <input type="text" class="form-control" name="name" id="name" required maxlength="32"
                    [(ngModel)]="data.categoryTypeId" #nameModel="ngModel" #nameEl />
                <abp-validation-summary [control]="nameModel" [controlEl]="nameEl"></abp-validation-summary>
            </div>
        </div>
    </div>
    <abp-modal-footer [cancelDisabled]="saving" [saveDisabled]="!createdataModal.form.valid || saving"
        (onCancelClick)="bsModalRef.hide()"></abp-modal-footer>
</form>

-------------------------