import { Component, Injector } from '@angular/core';
import {
    ColumnSettings, INbpTableOptions,
    isRowModel, ITabItem, NbpBaseComponent,
    NbpCalendarPattern, NbpCalendarPosition, NbpComboMultiComponent,
    NbpDataSource, NbpStyle, NbpTableSelectionType, NgbDateStruct,
    RowAction, RowDataExpander, RowModel,
    NbpComboComponent
} from '@isp/xdce-widget';

@Component({
    selector: 'showcase1',
    templateUrl: './showcase1.component.html',
    styleUrls: ['./showcase1.component.scss']
})
export class Showcase1Component extends NbpBaseComponent {

    public _nbpStyle = NbpStyle;

    //
    // TABBAR
    items: Array<ITabItem<void>> = [
        { icon: '', title: 'Calls', content: 'Calls' },
        { icon: '', title: 'Messages', content: 'Messages' }
    ];
    currentSelectedIndex: number = 0;

    longText: string = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam porta enim sapien. Etiam interdum ullamcorper ullamcorper. Ut malesuada orci ac sapien tempor dignissim. Phasellus congue libero sit amet ex euismod pulvinar. Duis dolor tellus, convallis id odio vitae, iaculis feugiat lectus. Integer tempor ex ac justo dictum, at vehicula dui malesuada. Praesent eu turpis eros. Aliquam vel metus ac tellus eleifend iaculis. Nam venenatis eget sapien eget euismod. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc sagittis fermentum scelerisque. Sed luctus ut mi et molestie. Nullam ultricies, nisl aliquam rhoncus cursus, magna libero accumsan neque, id bibendum lorem mauris vitae libero. Proin sodales felis placerat mi venenatis gravida. Nam eu metus velit. Morbi in sapien ut urna vulputate sollicitudin. Nulla dictum eleifend enim, at hendrerit velit feugiat ac. Cras gravida a augue ut fermentum. Integer sagittis velit ut viverra scelerisque. Pellentesque sed magna at lectus interdum vehicula id vitae diam. Integer sed placerat nisi, non maximus eros. ";
    //

    //
    // INPUT TEXT
    errorMessageInput: string = 'Il campo da inserire non è valido';
    labelInput4: string = 'Importo';
    currency: string = 'currency';
    importoprovaR: string;
    //

    // CALENDAR GENERIC
    _nbpCalendarPosition = NbpCalendarPosition;
    _nbpCalendarPattern = NbpCalendarPattern;
    calendarModel: NgbDateStruct = null;

    startDate: NgbDateStruct = { year: 2023, month: 3, day: 15 };
    endDate: NgbDateStruct = { year: 2023, month: 8, day: 15 };
    //

    //
    // COMBO
    comboValues = [
        "First item",
        "Second item",
        "Third item",
        "Fourth item",
        "Fifth item",
        "Sixth item"
    ];
    comboDatasource = new NbpDataSource<string>(this.comboValues);
    comboSelectedValue = null;
    //

    values = [
        "First item",
        "Second item",
        "Third item",
        "Fourth item",
        "Fifth item",
        "Sixth item"
    ];

    comboMultiVisible = true;

    datasource = new NbpDataSource<string>(this.values);

    selectedValues: Array<string> = [];

    //
    // TEXTAREA
    lunghezzamax = 30;
    lunghezzamin = 10;
    required = 'required';
    contenutoEmpty = 'contenutoEmpty';

    //
    // CARD
    cardTitle = 'Lorem ipsum ';
    cardSubtitle = 'Lorem ipsum dolor sit amet';
    cardDescr = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. ' +
        'Pellentesque facilisis quam in odio tincidunt bibendum vel vitae leo. ' +
        'Sed est risus, semper eu egestas sed, vulputate luctus neque. ' +
        'Pellentesque facilisis quam in odio tincidunt bibendum vel vitae leo. ' +
        'Sed est risus, semper eu egestas sed, vulputate luctus neque. Praesent vestibulum tinciodation.';
    //

    //
    // TABLE data
    tableSelectionType: NbpTableSelectionType = NbpTableSelectionType.NONE;
    tableOptions: INbpTableOptions = { sortable: true };
    tableRows = [ //
        { 'headerField': "", 'headerField2': "test" },
        { 'headerField': "test1", 'headerField2': "test1" },
        { 'headerField': "test2", 'headerField2': "test2" },
        { 'headerField': "test3", 'headerField2': "test3" },
        { 'headerField': "test4", 'headerField2': "test4" },
        { 'headerField': "test5", 'headerField2': "test5" },
        { 'headerField': "test6", 'headerField2': "test6" },
        { 'headerField': "test7", 'headerField2': "test7" },
        { 'headerField': "test8", 'headerField2': "test8" } //
    ];
    tableDs: NbpDataSource<any> = new NbpDataSource<any>(this.tableRows);
    //


    //
    table2Columns : Array<ColumnSettings> = [
        { field: 'brand', header: 'Brand', width: '25%', sortable: true },
        { field: 'year', header: 'Year', width: '25%', sortable: true },
        { field: 'color', header: 'Color', width: '25%', sortable: true },
        { field: 'vin', header: 'VIN', width: '25%', sortable: true },
    ];
    table2Rows = [
        [
            {
                id: '0', brand: "Citroën", year: 2012,
                color: "Sono il colore molto lungo Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat", vin: "dsad231ff",
                child: [
                    {
                        id: '00', brand: "00 aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla", year: 2012,
                        color: "Sono il colore molto lungo Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat",
                        vin: "dsad231ff"
                    },
                    { id: '01', brand: "01", year: 2012, color: "Orange", vin: "dsad231ff"},
                    {id: '01', brand: "01", year: 2012, color: "Orange", vin: "dsad231ff", child: [
                        {id: '010', brand: "010", year: 2012, color: "Orange", vin: "dsad231ff", status: {checked: false, disabled: false, hideCheckbox: false}},
                        {id: '011', brand: "011", year: 2012, color: "Orange", vin: "dsad231ff"},
                        {id: '012', brand: "012", year: 2012, color: "Orange", vin: "dsad231ff"} 
                    ]}
                ]
            },
            {
                id: '1', brand: "Audi", year: 2011, color: "Black", vin: "gwregre345", child: [
                    { id: '10', brand: "10", year: 2012, color: "Orange", vin: "dsad231ff" },
                    { id: '11', brand: "11", year: 2012, color: "Orange", vin: "dsad231ff" },
                    { id: '12', brand: "12", year: 2012, color: "Orange", vin: "dsad231ff" }
                ]
            },
            { id: '13', brand: "Renault", year: 2005, color: "Gray", vin: "h354htr" },
            { id: '14', brand: "BMW", year: 2003, color: "Blue", vin: "j6w54qgh" },
            { id: '15', brand: "Mercedes", year: 1995, color: "Orange", vin: "hrtwy34" }
        ],
        [
            { id: '10', brand: "Cadillac", year: 2012, color: "Orange", vin: "dsad231ff" },
            { id: '11', brand: "Chery", year: 2011, color: "Black", vin: "gwregre345" },
            { id: '12', brand: "Chevrolet", year: 2005, color: "Gray", vin: "h354htr" },
            { id: '13', brand: "Chrysler", year: 2003, color: "Blue", vin: "j6w54qgh" }
        ],
        [
            { id: '20', brand: "Maybach", year: 2012, color: "Orange", vin: "dsad231ff" },
            { id: '21', brand: "Maybach", year: 2011, color: "Black", vin: "gwregre345" },
            { id: '22', brand: "Maserati", year: 2005, color: "Gray", vin: "h354htr" },
            { id: '23', brand: "Pagani", year: 2003, color: "Blue", vin: "j6w54qgh" },
            { id: '24', brand: "Opel", year: 1995, color: "Orange", vin: "hrtwy34" }
        ]
    ];
    table2Data: NbpDataSource<any> = new NbpDataSource<any>();
    table2RowExpander = new RowExpanderTreeExpandedTest();
    //

    //
    // TABLE 3
    multi: NbpTableSelectionType = NbpTableSelectionType.MULTI;

    simpleOptions: INbpTableOptions = { sortable: true };

    oggetti = [{ 'headerField': "", 'headerField2': "test" },
    { 'headerField': "test1", 'headerField2': "test1" },
    { 'headerField': "test2", 'headerField2': "test2" },
    { 'headerField': "test3", 'headerField2': "test3" },
    { 'headerField': "test4", 'headerField2': "test4" }];

    campiStandardData: NbpDataSource<any>;
    //

    constructor(injector: Injector) {
        super(injector);
        // table2
        this.setDataRowExpander(this.table2Rows[0], 0);
        this.campiStandardData = new NbpDataSource<any>(this.oggetti);
    }

    setDataRowExpander(array: Array<any>, pageNumber?: number, sortField?: string[], pageSize?: number): void {
        array = array.map(convertPageToRowModel);
        this.table2Data.setData(array, pageNumber, sortField, pageSize);
    }
}

export class RowExpanderTreeExpandedTest implements RowDataExpander {
    startExpanded = false;
    getChild(data: RowModel): RowModel[] {
        NbpComboMultiComponent
        return data.body.child ? (<RowModel[]>data.body.child)
            : null
    }
}


export function convertPageToRowModel(body: any): RowModel {
    let actionRow: RowAction[] = [
        {
            actionName: 'delete',
            icon: '',
            label: 'DELETE'
        },
        {
            actionName: 'edit',
            icon: '',
            label: 'EDIT'
        },
        {
            actionName: 'download',
            icon: '',
            label: 'DOWNLOAD'
        }
    ]
    if (isRowModel(body)) {
        return body;
    }
    if (body && body.child && body.child.length) {
        body.child = body.child.map(convertPageToRowModel)
    }
    let checked = !!body.status && body.status.checked;
    let disabled = !!body.status && body.status.disabled;
    let hideCheckbox = !!body.status && body.status.hideCheckbox;
    let highlight = !!body.status && body.status.highlight;
    let customHighlight = !!body.status && body.status.customHighlight;
    let highlightText = !!body.status && body.status.highlightText;
    let data = { ...body };
    delete data.status;
    return new RowModel(body.id, data, checked, disabled, hideCheckbox, null, actionRow, highlight, customHighlight, highlightText);
}