import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { RouterExtensions } from '@nativescript/angular';
import { EventData, TextField } from '@nativescript/core';
import { action } from '@nativescript/core/ui/dialogs';
import { Select, Store } from '@ngxs/store';
import { FeedbackType } from 'nativescript-feedback';
import { Observable } from 'rxjs';
import { withLatestFrom } from 'rxjs/operators';
import { feedbackMessage } from '~/pages/material/utils/feedback-messages';
import { MeetingDateAllResult } from '../../entities/output/meetingDateAllResult';
import { SexTypes } from '../../entities/sexTypes';
import { InsertAdvertisingCategory } from '../../state-mgmt/advertising-category.actions';
import { AdvertisingCategoryState } from '../../state-mgmt/advertising-category.state';
import { LoadMeetingDateAll } from '../../state-mgmt/advertising.actions';
import { AdvertisingState } from '../../state-mgmt/advertising.state';

@Component({
    selector: 'AdvertisingCategoryNew',
    moduleId: module.id,
    templateUrl: './advertising-category-new.component.html',
    styleUrls: ['./_advertising-category-new.component.scss']
})

export class AdvertisingCategoryNewComponent implements OnInit {
    @Select(AdvertisingState.getMeetingDateAll) meetingDateAll$: Observable<MeetingDateAllResult[]>;
    @Select(AdvertisingCategoryState.isLoading) isLoading$: Observable<boolean>;

    sex: { sex, id } = null;
    meetingDates: MeetingDateAllResult[] = [];
    selectedMeeting: MeetingDateAllResult = null;

    @ViewChild('ageFrom', {static: false}) ageFrom: ElementRef;
    @ViewChild('ageTo', {static: false}) ageTo: ElementRef;
    @ViewChild('note', {static: false}) note: ElementRef;

    constructor(
        private store: Store,
        private routerExtensions: RouterExtensions
     ) {}

    ngOnInit(): void {
        this.store.dispatch(new LoadMeetingDateAll())
            .pipe(withLatestFrom(this.meetingDateAll$))
            .subscribe(([_, output]) => {
                const noMeetingOption = new MeetingDateAllResult();
                noMeetingOption.ID = undefined;
                noMeetingOption.DisplayName = 'Žádná';
                this.meetingDates = [noMeetingOption].concat(output);
            }, err => {
                console.log(err);
                feedbackMessage(FeedbackType.Error, 'Načítání dat', `Při načítání dat došlo k chybě. Zkontrolujte prosím vaše internetové připojení.`);
                this.routerExtensions.back();
            });
    }

    onSexSelect(args: EventData) {
        const options = {
            message: 'Zvolte pohlaví',
            cancelButtonText: 'Zrušit',
            actions: SexTypes.sexTypes.map(obj => obj.sex)
        };

        action(options).then((result) => {
            this.sex = SexTypes.sexTypes.find(obj => obj.sex === result);
            (<TextField>args.object).text = this.sex.sex;
        });
    }

    onMeetingSelect(args: EventData) {
        const options = {
            message: 'Zvolte termín schůzky',
            cancelButtonText: 'Zrušit',
            actions: this.meetingDates.map(obj => obj.DisplayName)
        };

        action(options).then((result) => {
            this.selectedMeeting = this.meetingDates.find(obj => obj.DisplayName === result);
            (<TextField>args.object).text = this.selectedMeeting.DisplayName;
        });
    }

    onSaveTap() {
        if (this.ageFrom.nativeElement.text === '' ||
            this.ageTo.nativeElement.text === '') {
            feedbackMessage(FeedbackType.Error, 'Přidání náborové kategorie', `Vyplňte údaje o věku.`);

            return;
        }

        if (this.sex === null) {
            feedbackMessage(FeedbackType.Error, 'Přidání náborové kategorie', `Vyplňte pohlaví.`);

            return;
        }

        if (this.selectedMeeting === null) {
            feedbackMessage(FeedbackType.Error, 'Přidání náborové kategorie', `Vyplňte termín schůzky.`);

            return;
        }

        const ageFromNumber = parseInt(this.ageFrom.nativeElement.text, 10);
        const ageToNumber = parseInt(this.ageTo.nativeElement.text, 10);
        if (ageFromNumber > ageToNumber) {
            feedbackMessage(FeedbackType.Error, 'Přidání náborové kategorie', `Věk od nemůže být menší než věk do.`);

            return;
        }

        this.store.dispatch(new InsertAdvertisingCategory(
            ageFromNumber,
            ageToNumber,
            this.sex.id,
            this.sex.sex,
            this.note.nativeElement.text,
            this.selectedMeeting.ID))
            .subscribe(() => {
                feedbackMessage(FeedbackType.Success, 'Ukládání náborové kategorie', 'Náborová kategorie byla úspěšně uložena');
                this.routerExtensions.back();
            }, err => {
                console.log(err);
                feedbackMessage(FeedbackType.Error, 'Ukládání náborové kategorie', `Při ukládání náborové kategorie došlo k chybě. Zkontrolujte prosím vaše internetové připojení.`);
            });
    }

    onBackButton(): void {
        this.routerExtensions.back();
    }

    get saveIcon() {
        return String.fromCharCode(0xf0c7);
    }
}
