import {
    ChangeDetectionStrategy,
    ChangeDetectorRef,
    Component,
    EventEmitter,
    OnInit,
    Output,
    ViewChild
} from '@angular/core';
import {ICustomerMeeting} from '../../../../model/entities/customer-meeting';
import {CustomerMeetingEditComponent} from '../customer-meeting-edit/customer-meeting-edit.component';
import {Factory} from '../../../../factory/factory';
import {ICustomer} from '../../../../model/entities/customer';
import {Utils} from '../../../../utils/utils';
import {IUser} from '../../../../model/entities/user';
import {AppService} from '../../../../services/app.service';
import {IMeetingType} from '../../../../model/entities/meeting-type';
import {IConfig} from '../../../../model/virtual/config';
import {NgForm} from '@angular/forms';
// import {ScrollToService} from '@nicky-lenaers/ngx-scroll-to';
import {CustomerService} from '../../../../services/customer.service';
import {MeetingService} from '../../../../services/meeting.service';
import {FormComponent} from '../../../../components/form-component';
import {Const} from '../../../../utils/const';

@Component({
    selector: 'app-customer-meeting-detail',
    templateUrl: './customer-meeting-detail.component.html',
    styleUrls: ['./customer-meeting-detail.component.scss'],
    // NOTE: We need manual change detection in this component
    changeDetection: ChangeDetectionStrategy.OnPush,
})

export class CustomerMeetingDetailComponent extends FormComponent implements OnInit {

    @Output() editMeeting: EventEmitter<ICustomerMeeting> = new EventEmitter<ICustomerMeeting>();
    @Output() deleteMeeting: EventEmitter<number> = new EventEmitter<number>();
    @Output() editMeetingReport: EventEmitter<any> = new EventEmitter<any>();
    @ViewChild('customerMeetingDetailEdit', { static: true }) customerMeetingDetailEdit: CustomerMeetingEditComponent;
    @ViewChild('customerMeetingReportForm', { static: true }) customerMeetingReportForm: NgForm;

    public customer: ICustomer;
    public customerMeeting: ICustomerMeeting;
    public isEditMode: boolean;
    public creator: IUser;
    public owner: IUser;
    public participants: IUser[];
    public meetingType: IMeetingType;
    public date: string;
    public timeStart: string;
    public timeEnd: string;
    public config: IConfig;
    public reportFormVisible: boolean;
    public reportOld: string;
    public hasEditRights: boolean;
    public hasReportRights: boolean;

    constructor(public appService: AppService, private customerService: CustomerService, private meetingService: MeetingService, /*protected scrollToService: ScrollToService,*/ private ref: ChangeDetectorRef) {
        super(/*scrollToService*/);
    }

    ngOnInit() {
        this.hasEditRights = this.appService.userHasRole(Const.USER_ROLE_ADMIN);
        this.hasReportRights = this.appService.userHasRole(Const.USER_ROLE_ADMIN);
        this.config = this.appService.getConfig();
        this.customer = Factory.getEmptyCustomer();
        this.customerMeeting = Factory.getEmptyCustomerMeeting();
        this.creator = Factory.getEmptyUser();
        this.owner = Factory.getEmptyUser();
        this.participants = [];
        this.meetingType = Factory.getEmptyMeetingType();
        this.date = '';
        this.timeStart = '';
        this.timeEnd = '';
        this.reportFormVisible = false;
        this.reportOld = '';
    }

    /**
     * Set data
     */
    public setData(customer: ICustomer, customerMeeting: ICustomerMeeting): void {
        this.customer = customer;
        this.customerMeeting = customerMeeting;
        this.hasEditRights =
            this.appService.userHasRole(Const.USER_ROLE_ADMIN) ||
            this.appService.getAppUser().id === customerMeeting.creation_user_id ||
            this.appService.getAppUser().id === customerMeeting.owner_user_id;
        this.hasReportRights =
            this.appService.userHasRole(Const.USER_ROLE_ADMIN) ||
            this.appService.getAppUser().id === customerMeeting.owner_user_id;
        this.setMeetingData();
    }

    /**
     * Updates data
     */
    public updateData(customer: ICustomer): void {
        this.customer = customer;
        if (null !== this.customerMeeting.id){
            this.customer.v_customer_meetings.forEach(item => {
                if (item.id === this.customerMeeting.id) {
                    this.customerMeeting = item;
                }
            });
            this.setMeetingData();
        }
    }

    /**
     * Sets variables for meeting
     */
    public setMeetingData(): void {
        this.errorMsg = '';
        this.reportFormVisible = false;
        this.reportOld = this.customerMeeting.report;
        this.creator = this.appService.getConfig().vc_user_by_id[this.customerMeeting.creation_user_id];
        this.owner = this.appService.getConfig().vc_user_by_id[this.customerMeeting.owner_user_id];
        this.participants = [];
        this.customerMeeting.v_participants.forEach(item => {
            this.participants.push(this.appService.getConfig().vc_user_by_id[item.participant_user_id]);
        });
        this.meetingType = this.appService.getConfig().vc_meeting_types_by_id[this.customerMeeting.meeting_type_id];
        this.date = Utils.getDateTimeToDisplay(this.customerMeeting.start_date);
        this.timeStart = Utils.getDateTimeToDisplay(this.customerMeeting.start_date, false, true);
        this.timeEnd = Utils.getDateTimeToDisplay(this.customerMeeting.end_date, false, true);
        this.isEditMode = false;
        this.resetFormValidation();
        // NOTE: We need manual change detection in this component
        this.ref.detectChanges();
    }

    /**
     * Edit meeting entry
     */
    public editEntry(): void {
        this.isEditMode = true;
        this.customerMeetingDetailEdit.setData(this.customer, Utils.deepClone(this.customerMeeting) as ICustomerMeeting);
    }

    /**
     * Edits meeting entry
     */
    public editCustomerMeetingFunction(customerMeeting: ICustomerMeeting): void {
        this.editMeeting.emit(customerMeeting);
    }

    /**
     * Delete meeting entry
     */
    public deleteEntry(): void {
        const confirmAction = confirm('Wollen Sie diesen Eintrag wirklich löschen?');
        if (confirmAction === true) {
            this.deleteMeeting.emit(this.customerMeeting.id);
        }
    }

    /**
     * Check if edit report after meeting has started
     */
    public editReport(): void {
        this.meetingService.apiCheckCustomerMeetingReport(this.customerMeeting.id).subscribe(
            data => {
                this.reportFormVisible = data.result_data as boolean;
                // NOTE: We need manual change detection in this component
                this.ref.detectChanges();
                // todo this.scrollUp('customer-meeting-edit-report');
            },
            error => {
            }
        );
    }

    /**
     * Resets Form Validation
     */
    public resetFormValidation(): void {
        if (this.reportFormVisible) {
            this.customerMeetingReportForm.form.markAsUntouched();
        }
    }

    /**
     * Saves customer meeting report
     */
    public onFormSubmit({value, valid}: { value: any, valid: boolean }): void {
        this.errorMsg = 'Bitte beheben Sie alle Fehler.';
        if (valid) {
            this.editMeetingReport.emit({
                id: this.customerMeeting.id,
                report: this.customerMeeting.report
            });
            this.errorMsg = '';
        } else {
            // todo this.scrollUp('customer-meeting-edit-report');
        }
    }

}