pull/18/head
garrettmills
4 years ago
parent
1edd696bdb
commit
42f24914d5
@ -0,0 +1,33 @@
|
||||
import {ICellEditorAngularComp} from 'ag-grid-angular';
|
||||
import {AfterViewInit, Component, ViewChild} from '@angular/core';
|
||||
import {ICellEditorParams} from 'ag-grid-community';
|
||||
import {IonDatetime} from '@ionic/angular';
|
||||
|
||||
@Component({
|
||||
selector: 'cell-editor-select',
|
||||
template: `<ion-datetime #picker [displayFormat]="format" [(ngModel)]="value" style="padding: 0 0 0 5px;"></ion-datetime>`,
|
||||
})
|
||||
export class DatetimeEditorComponent implements ICellEditorAngularComp, AfterViewInit {
|
||||
public params: ICellEditorParams;
|
||||
public value: string;
|
||||
public format = 'YYYY-MM-DD h:mm a';
|
||||
@ViewChild('picker', {static: false}) picker: IonDatetime;
|
||||
|
||||
agInit(params: ICellEditorParams): void {
|
||||
this.params = params;
|
||||
this.value = this.params.value;
|
||||
// @ts-ignore
|
||||
if ( this.params.colDef.additionalData.format ) {
|
||||
// @ts-ignore
|
||||
this.format = this.params.colDef.additionalData.format;
|
||||
}
|
||||
}
|
||||
|
||||
getValue(): any {
|
||||
return this.value;
|
||||
}
|
||||
|
||||
ngAfterViewInit(): void {
|
||||
this.picker.open();
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,36 @@
|
||||
import {ICellEditorAngularComp} from 'ag-grid-angular';
|
||||
import {AfterViewInit, Component, ElementRef, ViewChild} from '@angular/core';
|
||||
import {ICellEditorParams} from 'ag-grid-community';
|
||||
import {IonSelect} from '@ionic/angular';
|
||||
|
||||
@Component({
|
||||
selector: 'cell-editor-multiselect',
|
||||
template: `
|
||||
<ion-select #select [(ngModel)]="value" style="padding: 0;"
|
||||
[interfaceOptions]="{header: params.colDef.headerName, cssClass: 'big-alert'}" multiple="true">
|
||||
<ion-select-option *ngFor="let option of options" [value]="option.value">{{ option.value }}</ion-select-option>
|
||||
</ion-select>
|
||||
`,
|
||||
})
|
||||
export class MultiSelectEditorComponent implements ICellEditorAngularComp, AfterViewInit {
|
||||
public params: ICellEditorParams;
|
||||
public value: string;
|
||||
|
||||
public options: Array<{value: string}> = [];
|
||||
@ViewChild('select', {static: false}) select: IonSelect;
|
||||
|
||||
agInit(params: ICellEditorParams): void {
|
||||
this.params = params;
|
||||
this.value = this.params.value;
|
||||
// @ts-ignore
|
||||
this.options = this.params.colDef.additionalData.options;
|
||||
}
|
||||
|
||||
getValue(): any {
|
||||
return this.value;
|
||||
}
|
||||
|
||||
ngAfterViewInit(): void {
|
||||
this.select.open();
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,37 @@
|
||||
import {ICellRendererAngularComp} from 'ag-grid-angular';
|
||||
import {Component} from '@angular/core';
|
||||
import {ICellRendererParams} from 'ag-grid-community';
|
||||
import * as moment from 'moment';
|
||||
|
||||
@Component({
|
||||
selector: 'editor-boolean-renderer',
|
||||
template: `{{ display }}`,
|
||||
})
|
||||
export class BooleanRendererComponent implements ICellRendererAngularComp {
|
||||
public params: ICellRendererParams;
|
||||
public emptyValue = '';
|
||||
public trueValue = 'True';
|
||||
public falseValue = 'False';
|
||||
|
||||
agInit(params: ICellRendererParams): void {
|
||||
this.params = params;
|
||||
// @ts-ignore
|
||||
const labelType = params.colDef.additionalData.labelType.split('_').map(x => x.charAt(0).toUpperCase() + x.slice(1));
|
||||
this.trueValue = labelType[0];
|
||||
this.falseValue = labelType[1];
|
||||
}
|
||||
|
||||
public get display() {
|
||||
if ( this.params.value === true ) {
|
||||
return this.trueValue;
|
||||
} else if ( this.params.value === false ) {
|
||||
return this.falseValue;
|
||||
} else {
|
||||
return this.emptyValue;
|
||||
}
|
||||
}
|
||||
|
||||
refresh(params: any): boolean {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,23 @@
|
||||
import {ICellRendererAngularComp} from 'ag-grid-angular';
|
||||
import {Component} from '@angular/core';
|
||||
import {ICellRendererParams} from 'ag-grid-community';
|
||||
import * as moment from 'moment';
|
||||
|
||||
@Component({
|
||||
selector: 'editor-currency-renderer',
|
||||
template: `{{ params.value | currency: code }}`,
|
||||
})
|
||||
export class CurrencyRendererComponent implements ICellRendererAngularComp {
|
||||
public params: ICellRendererParams;
|
||||
public code = 'USD';
|
||||
|
||||
agInit(params: ICellRendererParams): void {
|
||||
this.params = params;
|
||||
// @ts-ignore
|
||||
this.code = params.colDef.additionalData.currency;
|
||||
}
|
||||
|
||||
refresh(params: any): boolean {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,30 @@
|
||||
import {ICellRendererAngularComp} from 'ag-grid-angular';
|
||||
import {Component} from '@angular/core';
|
||||
import {ICellRendererParams} from 'ag-grid-community';
|
||||
import * as moment from 'moment';
|
||||
|
||||
@Component({
|
||||
selector: 'editor-datetime-renderer',
|
||||
template: `{{ display }}`,
|
||||
})
|
||||
export class DatetimeRendererComponent implements ICellRendererAngularComp {
|
||||
public params: ICellRendererParams;
|
||||
public format = 'YYYY-MM-DD h:mm a';
|
||||
|
||||
agInit(params: ICellRendererParams): void {
|
||||
this.params = params;
|
||||
// @ts-ignore
|
||||
this.format = params.colDef.additionalData.format;
|
||||
}
|
||||
|
||||
public get display() {
|
||||
if ( !this.params.value ) {
|
||||
return '';
|
||||
}
|
||||
return moment(this.params.value).format(this.format);
|
||||
}
|
||||
|
||||
refresh(params: any): boolean {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in new issue