File

src/app/components/dashboard/dashboard.component.ts

Implements

OnInit

Metadata

providers KiewitLoggingService KiewitAuthenticationService
selector app-dashboard
styleUrls dashboard.component.scss
templateUrl ./dashboard.component.html

Index

Properties
Methods

Constructor

constructor(loggingService: KiewitLoggingService, kiewitAuthentication: KiewitAuthenticationService, http: Http)
Parameters :
Name Type Optional Description
loggingService KiewitLoggingService
kiewitAuthentication KiewitAuthenticationService
http Http

Methods

AddCardClicked
AddCardClicked()
Returns : void
CardClicked
CardClicked(event: any)
Parameters :
Name Type Optional Description
event any
Returns : void
CardElipsisOptionClick
CardElipsisOptionClick(item: any)
Parameters :
Name Type Optional Description
item any
Returns : void
CardHeaderMenuIconClicked
CardHeaderMenuIconClicked(iconName: string)
Parameters :
Name Type Optional Description
iconName string
Returns : void
columnChooserClick
columnChooserClick()
Returns : void
columnchooserCloseClicked
columnchooserCloseClicked()
Returns : void
columnchooserSaveClicked
columnchooserSaveClicked(e: any)
Parameters :
Name Type Optional Description
e any
Returns : void
confirmationCloseClicked
confirmationCloseClicked()
Returns : void
confirmationNoClicked
confirmationNoClicked()
Returns : void
confirmationYesClicked
confirmationYesClicked()
Returns : void
getDistricts
getDistricts()
Returns : void
GetUser
getUser()
Returns : void
kiewitDropdownOnValueChanged
kiewitDropdownOnValueChanged()
Returns : void
kiewitTabStripClicked
kiewitTabStripClicked(tabData: )
Parameters :
Name Type Optional Description
tabData
Returns : void
logDebug
logDebug()
Returns : void
logError
logError()
Returns : void
logInfo
logInfo()
Returns : void
logTrace
logTrace()
Returns : void
logWarn
logWarn()
Returns : void
ngOnInit
ngOnInit()
Returns : void
openConfirmationClick
openConfirmationClick()
Returns : void

Properties

Private availablecolumnsconfig
availablecolumnsconfig: any
Type : any
columnchooserConfig
columnchooserConfig:
confirmationConfig
confirmationConfig:
Public data
data: any[]
Type : any[]
Public defaultItem
defaultItem: literal type
Type : literal type
Private filterable
filterable: boolean
Type : boolean
Default value : true
Public gridData
gridData: any[]
Type : any[]
Public gridData2
gridData2: any[]
Type : any[]
Public header
header: any
Type : any
Public kiewitCardData
kiewitCardData: KiewitCard[]
Type : KiewitCard[]
Public kiewitCardElipsisOptions
kiewitCardElipsisOptions: OptionsMenuItem[]
Type : OptionsMenuItem[]
Public kiewitCardHeaderMenu
kiewitCardHeaderMenu: HeaderMenuItem[]
Type : HeaderMenuItem[]
Public kiewitCardHighlighters
kiewitCardHighlighters: Highlighter[]
Type : Highlighter[]
Public kiewitDropdownConfig
kiewitDropdownConfig:
kiewitNumericTextboxConfig
kiewitNumericTextboxConfig:
kiewitNumericTextboxValue
kiewitNumericTextboxValue:
Default value : 25
Public listItems
listItems: Array<literal type>
Type : Array<literal type>
myadal
myadal:
Private opprotunitiesConfig
opprotunitiesConfig: any
Type : any
padding
padding: number
Type : number
Default value : 2
Private pageable
pageable: boolean
Type : boolean
Default value : true
Public pageSize
pageSize: number
Type : number
Default value : 10
Private selectablecolumnsconfig
selectablecolumnsconfig: any
Type : any
Public skip
skip: number
Type : number
Default value : 0
Public sort
sort: Array<SortDescriptor>
Type : Array<SortDescriptor>
Private sortable
sortable: boolean
Type : boolean
Default value : true
Public tabstripConfig
tabstripConfig: any
Type : any
Public value
value:
Public view
view: Observable<GridDataResult>
Type : Observable<GridDataResult>
import { Component, OnInit } from '@angular/core';
import { Http, RequestOptions, Headers } from '@angular/http';
import { environment } from '../../../environments/environment';
//import { HttpClient, RequestOptions, Headers } from '@angular/common/http';
import { KiewitCard, OptionsMenuItem, HeaderMenuItem, Highlighter } from '../../../lib/kiewit-card';
import { KiewitLoggingService } from '../../../lib/kiewit-logging/kiewit-logging.service';
import { IKiewitDropdown } from '../../../lib/kiewit-dropdown';
import { IKiewitNumericTextbox } from '../../../lib/kiewit-numerictextbox';
import { Observable } from 'rxjs/Rx';
import { KiewitAuthenticationService } from '../../../lib/kiewit-authentication/kiewit-authentication.service';

import {
    GridComponent,
    GridDataResult
    //DataStateChangeEvent
} from '@progress/kendo-angular-grid';

import { SortDescriptor } from '@progress/kendo-data-query';
//import { KiewitAuthenticationService } from '../../../kiewit-authentication/kiewit-authentication.service';

@Component({
    selector: 'app-dashboard',
    templateUrl: './dashboard.component.html',
    styleUrls: ['./dashboard.component.scss'],
    providers: [KiewitLoggingService, KiewitAuthenticationService]
})
export class DashboardComponent implements OnInit {
    private availablecolumnsconfig: any;
    private selectablecolumnsconfig: any;
    constructor(private loggingService: KiewitLoggingService, private kiewitAuthentication: KiewitAuthenticationService, private http: Http) {
    }


    private opprotunitiesConfig: any;

    ngOnInit() {
        //this.opprotunitiesConfig = {
        //    availableColumns: [{ "title": "Tag 3" }, { "title": "ORS Area" }, { "title": "Opt EOJ Gain" }, { "title": "Pess EOJ Gain" }],
        //    selectedColumns: [{ "title": "Win" }, {"title": "Burn Off" }, {"title": "Opportunity Name" }, {"title": "Opportunity ID" }, {"title": "Tag 1" }, {"title": "Tag 2" }],
        //    isOpened: false
        //}
    }


    myadal = {
        tenant: 'GEORGE',
        clientId: 'c87f021f-b17e-454d-8303-0c2c07dfaf78'
    };

    public kiewitCardHeaderMenu: HeaderMenuItem[];
    //= [{
    //    HeaderMenuIcon: "fa fa-files-o",
    //    HeaderMenuToolTip: "copy",
    //    HeaderMenuIconHidden: false,
    //    HeaderMenuIconDisabled: false,
    //}
    //    //{
    //    //    "HeaderMenuIcon": "icon-send",
    //    //    "HeaderMenuToolTip": "email",
    //    //    "HeaderMenuIconHidden": false,
    //    //    "HeaderMenuIconDisabled": true
    //    //},
    //    //{
    //    //    "HeaderMenuIcon": "icon-send",
    //    //    "HeaderMenuToolTip": "email",
    //    //    "HeaderMenuIconHidden": false,
    //    //    "HeaderMenuIconDisabled": false
    //    //}
    //];

    public kiewitCardElipsisOptions: OptionsMenuItem[] = [{
        OptionsMenuItemIconToolTip: "",
        OptionsMenuItemIcon: "icon-print",
        OptionsMenuItemIconHidden: false,
        OptionsMenuItemIconDisabled: false,
        OptionsMenuItemIconTitle: "item1"
    },
    {
        OptionsMenuItemIconToolTip: "",
        OptionsMenuItemIcon: "icon-delete",
        //OptionsMenuItemIconHidden: false,
        //OptionsMenuItemIconDisabled: false,
        OptionsMenuItemIconTitle: "item1"
    },
    {
        OptionsMenuItemIconToolTip: "",
        OptionsMenuItemIcon: "icon-pass",
        //OptionsMenuItemIconHidden: false,
        //OptionsMenuItemIconDisabled: false,
        OptionsMenuItemIconTitle: "item1"
    },
    {
        OptionsMenuItemIconToolTip: "",
        OptionsMenuItemIcon: "icon-remove",
        //OptionsMenuItemIconHidden: false,
        //OptionsMenuItemIconDisabled: false,
        OptionsMenuItemIconTitle: "item1"
    }
    ];

    public kiewitCardHighlighters: Highlighter[] = [{
        Highlighter: "22m",
        //HighlighterFont: "Roboto",
        //HighlighterFontSize: "28px",
        HighlighterDescription: "Net Gain",
        //HighlighterDescriptionFont: "Roboto",
        //HighlighterDescriptionFontSize: "12px"
    },
        //{
        //    "Highlighter": "50m",
        //    "HighlighterFont": "Roboto",
        //    "HighlighterFontSize": "28px",
        //    "HighlighterDescription": "Revenue",
        //    "HighlighterDescriptionFont": "Roboto",
        //    "HighlighterDescriptionFontSize": "12px"
        //    }
    ];

    public kiewitCardData: KiewitCard[] = [{
        CardId: 1,
        HeaderMenuItems: this.kiewitCardHeaderMenu,
        Title: "Project1Project1Project1Project1Project1Project1Project1",
        TagIsOfficialPlan: true,
        TitleDescription1: "Last Saved 06/05/2017",
        Highlighters: this.kiewitCardHighlighters,
        OptionsMenuItems: this.kiewitCardElipsisOptions
    },
    {
        CardId: 2,
        HeaderMenuItems: this.kiewitCardHeaderMenu,
        Title: "Project1Project1",
        TagIsOfficialPlan: true,
        TitleDescription1: "Last Saved 06/05/2017",
        Highlighters: this.kiewitCardHighlighters,
        OptionsMenuItems: this.kiewitCardElipsisOptions
    },
    {
        CardId: 2,
        HeaderMenuItems: this.kiewitCardHeaderMenu,
        Title: "Project1Project1",
        TagIsOfficialPlan: true,
        TitleDescription1: "Last Saved 06/05/2017",
        Highlighters: this.kiewitCardHighlighters,
        OptionsMenuItems: this.kiewitCardElipsisOptions
    },
    {
        CardId: 2,
        HeaderMenuItems: this.kiewitCardHeaderMenu,
        Title: "Project1Project1",
        TagIsOfficialPlan: true,
        TitleDescription1: "Last Saved 06/05/2017",
        Highlighters: this.kiewitCardHighlighters,
        OptionsMenuItems: this.kiewitCardElipsisOptions
    }];

    public defaultItem: { text: string, value: number } = { text: "Select item...", value: null };

    public listItems: Array<{ text: string, value: number }> = [
        { text: "Small", value: 1 },
        { text: "Medium", value: 2 },
        { text: "Large", value: 3 }
    ];

    public value = { text: "Medium", value: 2 };

    public kiewitDropdownConfig = {
        data: [
            { text: "Small", value: 1 },
            { text: "Medium", value: 2 },
            { text: "Large", value: 3 }
        ],
        textField: "text",
        valueField: "value",
        //defaultItem: this.defaultItem,
        disabled: true
    };

    //---------grid starts-------------------//

    private pageable: boolean = true;
    private sortable: boolean = true;
    private filterable: boolean = true;
    public view: Observable<GridDataResult>;
    public sort: Array<SortDescriptor> = [];
    public pageSize: number = 10;
    public skip: number = 0;

    public header: any = {
        "isExpandRowVisible": false,
        "HiddenHeaderRow": [
            [{
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "<input type='text' class='percentage' decimal-places='3' name='name' value='20%'  style='margin-left: 18px;'>"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL2"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "Col33"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL4"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL5"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL6"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL7"
            }],
            [{
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": `<span class='up-arrow'></span>
                         <div class='expandline' style='height: 56px;margin-top: -52px;'>&nbsp;</div>
                         <input type='text' class='percentage' decimal-places='3' name='name' value='20%'  style='margin-left: 18px;'>`
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL2"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "Col33"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL4"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL5"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL6"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL7"
            }]
        ]
    };

    public gridData: any[] = [{
        "ProductID": 3,
        "ProductName": "Aniseed Syrup",
        "SupplierID": 1,
        "CategoryID": 2,
        "QuantityPerUnit": "12 - 550 ml bottles",
        "UnitPrice": 10.0000,
        "UnitsInStock": 13,
        "UnitsOnOrder": 70,
        "ReorderLevel": 25,
        "Discontinued": false,
        "Category": {
            "CategoryID": 2,
            "CategoryName": "Condiments",
            "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
        },
        "isExpandRowVisible": true,
        "HiddenRow": [[
            {
                "colSpan": 1,
                "class": "expandRowCell",
                "rightMarginWidth": 1,
                "data": "COL1"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL2"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "<input type='text' class='percentage' decimal-places='3' name='name' value='20%'  style='margin-left: 18px;'>"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL4"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL5"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL6"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL7"
            }
        ],
        [
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL1"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL2"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": `<span class='up-arrow'></span>
                        <div class='expandline' style='height: 50px;margin-top: -45px;'>&nbsp;</div>
                        <input type='text' class='percentage' decimal-places='3' name='name' value='20%'  style='margin-left: 18px;'>`
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL4"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL5"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL6"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL7"
            }
        ]
        ]
    },
    {
        "ProductID": 3,
        "ProductName": "Aniseed Syrup",
        "SupplierID": 1,
        "CategoryID": 2,
        "QuantityPerUnit": "12 - 550 ml bottles",
        "UnitPrice": 10.0000,
        "UnitsInStock": 13,
        "UnitsOnOrder": 70,
        "ReorderLevel": 25,
        "Discontinued": false,
        "Category": {
            "CategoryID": 2,
            "CategoryName": "Condiments",
            "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
        },
        "isExpandRowVisible": false,
        "HiddenRow": [[
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL1"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL2"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": `<span class='up-arrow'></span>
                         <div class='expandline' style='height: 25px;'>&nbsp;</div>
                         <input type='text' class='percentage' decimal-places='3' name='name' value='20%'  style='margin-left: 18px;'>`
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL4"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL5"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL6"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL7"
            }
        ]
        ]
    },
    {
        "ProductID": 3,
        "ProductName": "Aniseed Syrup",
        "SupplierID": 1,
        "CategoryID": 2,
        "QuantityPerUnit": "12 - 550 ml bottles",
        "UnitPrice": 10.0000,
        "UnitsInStock": 13,
        "UnitsOnOrder": 70,
        "ReorderLevel": 25,
        "Discontinued": false,
        "Category": {
            "CategoryID": 2,
            "CategoryName": "Condiments",
            "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
        },
        "isExpandRowVisible": false,
        "HiddenRow": [[
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL1"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": "COL2"
            },
            {
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": `<span class='up-arrow'></span>
                         <div class='expandline' style='height: 25px;'>&nbsp;</div>
                         <input type='text' class='percentage' decimal-places='3' name='name' value='20%'  style='margin-left: 18px;'>`
            }
        ]
        ]
    }
    ];

    public gridData2: any[] = [{
        "ProductID": 3,
        "ProductName": "Aniseed Syrup",
        "SupplierID": 1,
        "CategoryID": 2,
        "QuantityPerUnit": "12 - 550 ml bottles",
        "UnitPrice": 10.0000,
        "UnitsInStock": 13,
        "UnitsOnOrder": 70,
        "ReorderLevel": 25,
        "Discontinued": false,
        "Category": {
            "CategoryID": 2,
            "CategoryName": "Condiments",
            "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
        },
        "isExpandRowVisible": true,
        "HiddenRow": [
            [{
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": ""
            },
            {
                "colSpan": 6,
                "class": "",
                "rightMarginWidth": 0,
                "data": `< span class='up-arrow' style="margin-top: 34px;" > </span><div class='expandline' style='height: 48px;margin-top:-11px;'>&nbsp;</div>
                <table style="margin-left: 18px;">
                <tr>
                <td>test < /td>
                < td > test < /td>
                < td > test < /td>
                < td > test < /td>
                < /tr>
                < tr >
                <td>test < /td>
                < td > test < /td>
                < td > test < /td>
                < td > test < /td>
                < /tr>
                < /table>`
            }
            ],
        ]
    },
    {
        "ProductID": 3,
        "ProductName": "Aniseed Syrup",
        "SupplierID": 1,
        "CategoryID": 2,
        "QuantityPerUnit": "12 - 550 ml bottles",
        "UnitPrice": 10.0000,
        "UnitsInStock": 13,
        "UnitsOnOrder": 70,
        "ReorderLevel": 25,
        "Discontinued": false,
        "Category": {
            "CategoryID": 2,
            "CategoryName": "Condiments",
            "Description": "Sweet and savory sauces, relishes, spreads, and seasonings"
        },
        "isExpandRowVisible": false,
        "HiddenRow": [
            [{
                "colSpan": 1,
                "class": "",
                "rightMarginWidth": 1,
                "data": ""
            },
            {
                "colSpan": 6,
                "class": "",
                "rightMarginWidth": 0,
                "data": `<span class='up-arrow' style="margin-top: 34px;"></span><div class='expandline' style='height: 48px;margin-top:-11px;'>&nbsp;</div>
                         <table style="margin-left: 18px;">
                          <tr>
                            <td>test</td>
                            <td>test</td>
                            <td>test</td>
                            <td>test</td>
                          </tr>
                          <tr>
                            <td>test</td>
                            <td>test</td>
                            <td>test</td>
                            <td>test</td>
                          </tr>
                        </table>`
            }
            ],
        ]
    }

    ];
    //---------grid ends-------------------//
    logTrace() {
        this.loggingService.Trace('BPT-App1', 'Test_Method', 'TRACE logging messsage.');
    }

    logDebug() {
        this.loggingService.Debug('BPT-App2', 'Test_Method', 'DEBUG logging messsage.');
    }

    logWarn() {
        this.loggingService.Warn('BPT-App3', 'Test_Method', 'WARN logging messsage.');
    }

    logInfo() {
        this.loggingService.Info('BPT-App4', 'Test_Method', 'INFO logging messsage.');
    }

    logError() {
        this.loggingService.Error('BPT-App5', 'Test_Method', 'ERROR logging messsage.');
    }

    kiewitDropdownOnValueChanged() {
        alert("kiewitDropdownOnValueChanged");
    }

    AddCardClicked() {
        alert("kiewitAddCardClicked");
    }
    CardClicked(event: any) {
        alert("CardClicked");
        console.log(event);
    }
    CardElipsisOptionClick(item: any) {
        alert("CardElipsisOptionClicked" + item);
    }
    CardHeaderMenuIconClicked(iconName: string) {
        alert("CardHeaderMenuIconClicked" + iconName);
    }

    confirmationConfig = {
        isOpened: false,
        title: "Titile goes here?",
        yesCaption: "Yes-Caption",
        noCaption: "No-Caption"
    }

    openConfirmationClick() {
        this.confirmationConfig.isOpened = true;
    }
    columnchooserConfig = {
        isOpened: false,
        isIconsDisabled: false
    }

    confirmationCloseClicked() {
        alert("confirmationCloseClicked");
    }

    confirmationYesClicked() {
        alert("confirmationYesClicked");
    }

    confirmationNoClicked() {
        alert("confirmationNoClicked");
    }

    padding: number = 2;
    public data: any[] = [{
        "Id": 1,
        "Title": "Opportunities",
        "SliderWidth": 180,
        "SliderLeftMargin": 0,
        "Selected": true
    },
    {
        "Id": 2,
        "Title": 'Pending/New Work "Plugs"',
        "SliderWidth": 180,
        "SliderLeftMargin": 180 * 1,
        "Selected": false
    },
    {
        "Id": 3,
        "Title": "ORS Project tags & Financial Plans",
        "SliderWidth": 180,
        "SliderLeftMargin": 180 * 2,
        "Selected": false
    },
    {
        "Id": 4,
        "Title": "ORS Off-JOb Financial Plans",
        "SliderWidth": 180,
        "SliderLeftMargin": 180 * 3,
        "Selected": false
    },
    {
        "Id": 5,
        "Title": "Other Factors",
        "SliderWidth": 180,
        "SliderLeftMargin": 180 * 4,
        "Selected": false
    }
    ];

    public tabstripConfig: any = {
        "data": this.data
    };

    kiewitTabStripClicked(tabData) {
        //alert(tabData.Title);
    }

    getDistricts() {
        let oauthToken = this.kiewitAuthentication.getToken();
        console.log(this.kiewitAuthentication.getUser());
        let myHeaders = new Headers();
        // myHeaders.append('Authorization', `Bearer ${oauthToken}`);
        let options = new RequestOptions({ headers: myHeaders });

        this.http.get(environment.kcsServiceUrl + 'Districts?$orderby=DISTRICT_DS', options).subscribe(data => {
            console.log(data);
        });
    }

    GetUser() {
        let oauthToken = this.kiewitAuthentication.getToken();
        let myHeaders = new Headers();
        myHeaders.append('Authorization', 'Bearer ${oauthToken}');
        let options = new RequestOptions({ headers: myHeaders });

        this.http.get('https://login.microsoftonline.com/common/oauth2/authorize?client_id=' + environment.clientId + '&resource=https://graph.microsoft.com&response_type=token&redirect_uri=' + window.location.origin + '&scope=User.ReadBasic.All', options).subscribe(data => {
            console.log(data);
        });
    }

    kiewitNumericTextboxConfig = {
        spinners: false,
        decimals: 4,
        format: "#.## \\%",
        value: 20
    }

    kiewitNumericTextboxValue = 25;

   columnchooserCloseClicked() {

    }

    columnChooserClick() {
        this.opprotunitiesConfig = {
            availableColumns: [{ "title": "Tag 3" }, { "title": "ORS Area" }, { "title": "Opt EOJ Gain" }, { "title": "Pess EOJ Gain" }],
            selectedColumns: [{ "title": "Win" }, { "title": "Burn Off" }, { "title": "Opportunity Name" }, { "title": "Opportunity ID" }, { "title": "Tag 1" }, { "title": "Tag 2" }],
            isOpened: true
        }
   }
    columnchooserSaveClicked(e:any) {
    }
}
<div class="kcs-dashboard">
  <div class="kcs-dashboard-header">
  <kiewit-tabstrip [config]="tabstripConfig" (kcsTabStripClick)="kiewitTabStripClicked($event)"></kiewit-tabstrip></div>
  <div class="kcs-dashboard-content">
    <h2>Welcome!</h2>
    <h4> UI Documentation</h4>
    <!--<div>
      <a href="~/documentation/index.html" target="_blank">Kiewit Central UI Documentation</a>
    </div>-->
    <h4>Cards Control</h4>
  <div class="kiewit-card-controls">
    <kiewit-card [cardList]="kiewitCardData" (kcsAddCardClick)="AddCardClicked()" (kcsCardClick)="CardClicked($event)" (kcsElipsisOptionClick)="CardElipsisOptionClick($event)" (kcsCardHeaderMenuIconClick)="CardHeaderMenuIconClicked($event)"></kiewit-card>
  </div>
    <h4>Numeric Textbox Control</h4>
    <kiewit-numerictextbox [config]="kiewitNumericTextboxConfig"
                 [(kcsNgModel)]="kiewitNumericTextboxValue" width="10px"></kiewit-numerictextbox>
    <kiewit-numerictextbox-grid [config]="kiewitNumericTextboxConfig"></kiewit-numerictextbox-grid>
    <input type="text" [(ngModel)]="kiewitNumericTextboxValue" />

    <h4>Dropdown Control</h4>
    <kiewit-dropdown [config]="kiewitDropdownConfig"
                     (kcsValueChange)="kiewitDropdownOnValueChanged()"
                     [(kcsNgModel)]="value"></kiewit-dropdown>
    <!--<kendo-dropdownlist  id="ddlDistrict" [data]="districtItems"
                             [textField]="'DISTRICT_DS'"
                             [valueField]="'DISTRICT_ID'"
                             (valueChange)="onDistrictChange($event)"
                             [(ngModel)]="selectedDistrictValue"
                             [defaultItem]="defaultItemDistrict"
                             class="district-dropdown">
      <ng-template kendoDropDownListItemTemplate let-dataItem>
        <span title="{{ dataItem.DISTRICT_DS }}">{{ dataItem.DISTRICT_DS }}</span>
      </ng-template>
    </kendo-dropdownlist>-->
    <h4>Column Chooser</h4>
    <kiewit-columnchooser [config]="opprotunitiesConfig"
                          (kcsColumnChooserClick)="columnChooserClick()"
                          (kcsColumnChooserClose)="columnchooserCloseClicked()"
                          (kcsColumnChooserSaveClick)="columnchooserSaveClicked($event)">
    </kiewit-columnchooser>

    <h4>Get User Info</h4>
    <kiewit-button value="Get user info" (click)="getUser()"></kiewit-button>
   
    <h4>Get Districts Info</h4>
    <kiewit-button value="Get districts from secured service" (click)="getDistricts()"></kiewit-button>
    <br/>

    <h4>Logging test</h4>
    <div>
      <input type="button" value="Log Trace" (click)="logTrace()" />
      <input type="button" value="Log Debug" (click)="logDebug()" />
      <input type="button" value="Log Warn" (click)="logWarn()" />
      <input type="button" value="Log Error" (click)="logError()" />
      <input type="button" value="Log Info" (click)="logInfo()" />
    </div>
    <h4>Confirmation Box</h4>
    <input type="button" value="Open Confirmation" (click)="openConfirmationClick()" />
    <kiewit-confirmation [config]="confirmationConfig"
                         (kcsClose)="confirmationCloseClicked()"
                         (kcsYes)="confirmationYesClicked()"
                         (kcsNo)="confirmationNoClicked()">
    </kiewit-confirmation>

    <br />
    <br />

    <h4>Grid Control with Column Chooser</h4>
    <div>
      <kiewit-columnchooser [config]="columnchooserConfig" (kcsColumnChooserClick)="columnChooserClick()"></kiewit-columnchooser>
      <kendo-grid id="demoGrid" [data]="gridData"
                  [pageSize]="pageSize"
                  [skip]="skip"
                  [sortable]="true"
                  [sort]="sort"
                  [pageable]="true">
        <!--(dataStateChange)="dataStateChange($event)"-->
        <kendo-grid-column field="ProductID" title="ID">
          <ng-template kendoGridHeaderTemplate>
            <span style="line-height: 34px;"> Discontinued </span> <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
          </ng-template>
        </kendo-grid-column>
        <kendo-grid-column field="ProductName" title="Name">
          <ng-template kendoGridHeaderTemplate>
            <span style="line-height: 34px;"> Project Name </span> <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
            <ng-template kendoGridFilterCellTemplate>
              <span class="icon-filter-column"></span>
            </ng-template>
          </ng-template>
        </kendo-grid-column>
        <!--expand grid column start-->
        <kendo-grid-column title="Burn Off">
          <ng-template kendoGridCellTemplate let-dataItem>
            <kiewit-grid-row-action [dataitem]="dataItem"></kiewit-grid-row-action>
          </ng-template>
        </kendo-grid-column>
        <!--expand grid column end-->
        <kendo-grid-column field="Category.CategoryName" title="Category">
          <ng-template kendoGridHeaderTemplate>
            <span style="line-height: 34px;"> Category Name </span> <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
          </ng-template>
        </kendo-grid-column>
        <kendo-grid-column field="UnitPrice" title="Price">
          <ng-template kendoGridHeaderTemplate>
            <span style="line-height: 34px;"> Unit Price </span> <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
          </ng-template>
        </kendo-grid-column>
        <kendo-grid-column field="UnitsInStock" title="In stock">
          <ng-template kendoGridHeaderTemplate>
            <span style="line-height: 34px;"> Units In Stock </span> <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
          </ng-template>
        </kendo-grid-column>

        <kendo-grid-column field="Discontinued" title="Discontinued">
          <ng-template kendoGridHeaderTemplate>
            <span style="line-height: 34px;"> Discontinued </span> <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
          </ng-template>
          <ng-template kendoGridCellTemplate let-dataItem>
            <input type="checkbox" [checked]="dataItem.Discontinued" disabled/>
          </ng-template>
        </kendo-grid-column>

        <!--<kiewit-grid [gridData]="gridData"></kiewit-grid>-->

      </kendo-grid>
    </div>

    <kendo-grid id="demoGrid1" [data]="gridData2"
                [pageSize]="pageSize"
                [skip]="skip"
                [sortable]="true"
                [sort]="sort"
                [pageable]="true">
                <!--(dataStateChange)="dataStateChange($event)">-->
      <kendo-grid-column field="ProductID" title="ID">
        <ng-template kendoGridHeaderTemplate>
          <kiewit-grid-row-action [dataitem]="header"></kiewit-grid-row-action> <span style="line-height:34px;"> Discontinued </span>  <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
        </ng-template>
      </kendo-grid-column>
      <kendo-grid-column field="ProductName" title="Name">
        <ng-template kendoGridHeaderTemplate>
          <span style="line-height:34px;"> Project Name </span>  <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
          <ng-template kendoGridFilterCellTemplate>
            <span class="icon-filter-column"></span>
          </ng-template>
        </ng-template>
        <ng-template kendoGridCellTemplate let-dataItem>
          <kiewit-grid-row-action [dataitem]="dataItem"></kiewit-grid-row-action><span style='margin-left: 18px;'>{{dataItem.ProductName}}</span>
        </ng-template>
      </kendo-grid-column>
      <!--expand grid column start-->
      <kendo-grid-column title="Burn Off">
        
      </kendo-grid-column>
      <!--expand grid column end-->
      <kendo-grid-column field="Category.CategoryName" title="Category">
        <ng-template kendoGridHeaderTemplate>
          <span style="line-height:34px;"> Category Name </span>  <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
        </ng-template>
      </kendo-grid-column>
      <kendo-grid-column field="UnitPrice" title="Price">
        <ng-template kendoGridHeaderTemplate>
          <span style="line-height:34px;"> Unit Price </span>  <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
        </ng-template>
      </kendo-grid-column>
      <kendo-grid-column field="UnitsInStock" title="In stock">
        <ng-template kendoGridHeaderTemplate>
          <span style="line-height:34px;"> Units In Stock </span>  <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
        </ng-template>
      </kendo-grid-column>

      <kendo-grid-column field="Discontinued" title="Discontinued">
        <ng-template kendoGridHeaderTemplate>
          <span style="line-height:34px;"> Discontinued </span>  <i class="kiewit-icon icon-filter-column pull-right k-kcs-filter-color"></i>
        </ng-template>
        <ng-template kendoGridCellTemplate let-dataItem>
          <input type="checkbox" [checked]="dataItem.Discontinued" disabled />
        </ng-template>
      </kendo-grid-column>

      <!--<kiewit-grid [gridData]="gridData"></kiewit-grid>-->

    </kendo-grid>
    <!--<kiewit-authentication [config]="myadal"></kiewit-authentication>-->
  </div>
</div>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""