spt-crm-frontend/httpdocs/src/app/components/message/message.component.ts

import {Component, OnDestroy, OnInit} from '@angular/core';
import {MessageService} from '../../services/message.service';
import {Subscription} from 'rxjs';

@Component({
  selector: 'app-message',
  templateUrl: './message.component.html',
  styleUrls: ['./message.component.scss']
})

export class MessageComponent implements OnInit, OnDestroy {

    // Message display time in milliseconds
    static MESSAGE_DISPLAY_TIME = 2000;

    // Client Error codes
    static CLIENT_ERROR_DATA = 1;
    static CLIENT_ERROR_VALIDATION_FAILED = 2;


    private messageSub: Subscription;
    public showError: boolean;
    public showSuccess: boolean;
    public showInfo: boolean;
    public showClientError: boolean;
    public message: string;
    public optionalInfo: string;

    public errorMessages: string[];
    public successMessages: string[];
    public infoMessages: string[];
    public clientErrorMessages: string[];

    constructor(private messageService: MessageService) {
        // Init client error messages
        this.clientErrorMessages = [];
        this.clientErrorMessages[MessageComponent.CLIENT_ERROR_DATA] = 'Die Daten sind unvollständig oder fehlerhaft.';
        this.clientErrorMessages[MessageComponent.CLIENT_ERROR_VALIDATION_FAILED] = 'Die Daten sind nicht valide, kein Speichern möglich. Bitte überprüfen Sie Ihre Eingaben.';
    }

    ngOnInit() {
        this.messageSub = this.messageService.getMessage$().subscribe(
            data => {
                if (data !== null) {
                    if (data.error_code != 0) {
                        this.showErrorMessage(data.error_code, data.error_msg, data.optional_info);
                    } else if (data.success_code != 0) {
                        this.showSuccessMessage(data.success_code, data.success_msg);
                    } else if (data.info_code != 0) {
                        this.showInfoMessage(data.info_code, data.info_msg);
                    } else if (data.client_error_code != 0) {
                        this.showClientErrorMessage(data.client_error_code);
                    }
                }
            });

        this.showError = false;
        this.showSuccess = false;
        this.showInfo = false;
        this.showClientError = false;
        this.message = '';
        this.optionalInfo = null;
    }

    /**
     * Shows error message
     * @param {number} errorCode
     * @param {string} errorMsg
     * @param {string} optionalInfo
     */
    public showErrorMessage(errorCode: number, errorMsg: string, optionalInfo: string = null): void {
        this.showError = true;
        this.showSuccess = false;
        this.showInfo = false;
        this.showClientError = false;
        this.message = errorMsg;
        // Set optional info (if exists)
        this.optionalInfo = null !== optionalInfo ? optionalInfo : null;
    }

    /**
     * Shows success message
     * @param {number} successCode
     * @param {string} successMsg
     */
    public showSuccessMessage(successCode: number, successMsg: string): void {
        this.showSuccess = true;
        this.showError = false;
        this.showInfo = false;
        this.showClientError = false;
        const me: MessageComponent = this;
        this.message = successMsg;
        setTimeout(function() {
            me.closeComponent();
        }, MessageComponent.MESSAGE_DISPLAY_TIME);
    }

    /**
     * Shows info message
     * @param {number} infoCode
     * @param {string} infoMsg
     */
    public showInfoMessage(infoCode: number, infoMsg: string): void {
        this.showInfo = true;
        this.showSuccess = false;
        this.showError = false;
        this.showClientError = false;
        this.message = infoMsg;
    }

    /**
     * Shows client error message
     * @param {number} clientErrorCode
     */
    public showClientErrorMessage(clientErrorCode: number): void {
        this.showInfo = false;
        this.showSuccess = false;
        this.showError = false;
        this.showClientError = true;
        if (this.clientErrorMessages[clientErrorCode]) {
            this.message = this.clientErrorMessages[clientErrorCode];
        }
    }

    /**
     * Hides error- / success-message
     */
    public closeComponent(): void {
        this.showError = false;
        this.showSuccess = false;
        this.showInfo = false;
        this.showClientError = false;
        this.message = '';
    }

    ngOnDestroy(): void {
        if (this.messageSub !== null) {
            this.messageSub.unsubscribe();
        }
    }
}