mgislib v0.0.1

MgisLib

This library was generated with Angular CLI version 15.0.0.

Code scaffolding

Run ng generate component component-name --project mgis-lib to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module --project mgis-lib.

Note: Don't forget to add --project mgis-lib or else it will be added to the default project in your angular.json file.

Build

Run ng build mgis-lib to build the project. The build artifacts will be stored in the dist/ directory.

Publishing

After building your library with ng build mgis-lib, go to the dist folder cd dist/mgis-lib and run npm publish.

Running unit tests

Run ng test mgis-lib to execute the unit tests via Karma.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.

Installation - mgis-lib data table

npm i "path"

module file :

import { MgisDatatableModule} from 'mgis-lib';
imports: [MgisDatatableModule]

selector :

 <mgis-datatable></mgis-datatable>

in html file :

 <mgis-datatable
    oncopy="return false" onpaste="return false" oncut="return false" onselectstart="return false"
    *ngIf="showDataTable==true"
    [tableData]="tableData" 
    [tableName]="tablename"
    [editable]="editable"
    [pagination] = "paginationType"
    [pageSize] = "itemPerPage"
    [totalDataLength]="datatableTotalCount"
    [columnHide]="columnHide"
    [rowSelection]="rowSelection"
    [rowZoomButton]="rowZoomButton"
    [rowDeleteButton]="rowDeleteButton"
    [filterHeadersList]="filterHeadersList"
    [showMoreData]="showMoreData"
    [tableStyleClass] = "tableStyleClass"
    [showPageSizeOptions]="showPageSizeOptions"
    [pageSizeOptions]="pageSizeOptions"
    [showFirstLastButtons]="showFirstLastButtons"
    (selectEventFromTable)="eventFromTable($event)"
    (paginationEventFromTable)="paginationEventFromTable($event)"
    (buttonClickEvent)="eventButtonClick($event)"
    (EditVlaues)="EditVlaues($event)"
    (scrollEventForData)="scrollEventForData($event)"
    (zoomOrDeleteEvent)="zoomOrDeleteEvent($event)"
    [sorting] = "sorting"
    >                
    <strong class="table-header">Edit header</strong>
    <strong class="table-foot">Edit footer</strong> 
    <div class="table-foot">
        <span>Showing </span>{{ rangeData }}<span>of </span>{{ datatableTotalCount }}
    </div> 
</mgis-datatable>
           

in .ts file :

export class AppComponent implements OnInit{
    tableData :any;
    tablename: any;
    editable: boolean=false;
    paginationType:any
    itemPerPage:any;
    datatableTotalCount:any;
    columnHide: any
    rowSelection: boolean = false;
    columnBasedSearch: boolean=false;
    rowDeleteButton:boolean=true
    rowZoomButton:any=true
    filterHeadersList:any
    sorting : boolean =false
    ngOnInit() {
        this.tableData=[]
        this.tableData = [
        {id:"1", o_d: "112RKM7VNGOIU->SBCZ", key: '112RKM7VNGOIU->SBCZ', vrid: "112RKM7VN", date_time: '448130.748726852', latitude: '15.3403122222222', longitude: '73.9279777777777', truck: 'THIRTY_TWO_FOOT_TRUCK', testupdate: '112RKM7VNGOIU->SBCZTHIRTY_TWO_FOOT_TRUCK' },
        {id:"2", o_d: "112RKM7VNGOIU->SBCZ", key: '112RKM7VNGOIU->SBCZ', vrid: "112RKM7VN", date_time: '448130.748726852', latitude: '15.3403122222222', longitude: '73.9279777777777', truck: 'THIRTY_TWO_FOOT_TRUCK', testupdate: '112RKM7VNGOIU->SBCZTHIRTY_TWO_FOOT_TRUCK' }
        ];
        this.filterHeadersList=[]
        this.filterHeadersList=["o_d","key","vrid","date_time","latitude","longitude","truck","testupdate"]
        this.tablename=""
        this.editable=true
        this.paginationType="click";
        this.itemPerPage=10
        this.datatableTotalCount=200
        this.rowSelection=true
        this.columnBasedSearch=false
        this.rowZoomButton=true
        this.rowDeleteButton=false
        this.sorting = true
        }
        eventFromTable(event:any){
            console.log(event)
        }
        paginationEventFromTable(event:any){
            console.log(event)
        }
        eventButtonClick(event:any){
            console.log(event)
        }
        EditVlaues(event:any){
            console.log(event)
        }
        zoomOrDeleteEvent(event:any){
            console.log(event)
        }
    }
}

• Properties

• Events

• Secvice

  1: get All Selected values

  2: get all Edit values

  In .ts File

    import { DatatableService } from 'mgislib';

    constructor(private datatableService:DatatableService)

    this.datatableService.getSelectedValues()

    this.datatableService.getEditValues()