</ng-container>
<button type="button" class="btn btn-info"
- [disabled]="fmEditForm.invalid" *ngIf="mode != 'view'"
+ [disabled]="fmEditForm.invalid || fieldIsInvalid()" *ngIf="mode != 'view'"
(click)="save()" i18n>Save</button>
</div>
</ng-template>
// from the default set of form inputs.
customTemplate?: CustomFieldTemplate;
+ // This will disable the save button if any field has this set to false. It
+ // can be used along with a customTemplate to show an error message for non-valid input
+ isDataValid?: boolean;
+
// help text to display via a popover
helpText?: StringComponent;
}
);
}
+ fieldIsInvalid() {
+ let inv = false;
+ for (const f in this.fieldOptions) {
+ if (this.fieldOptions[f].isDataValid === false) {
+ inv = true;
+ break;
+ }
+ }
+ return inv;
+ }
+
remove() {
this.confirmDel.open().subscribe(confirmed => {
if (!confirmed) { return; }
End Survey Now
</button>
</div>
- <eg-fm-record-editor displayMode="inline"
+ <eg-fm-record-editor
+ #editDialog
+ displayMode="inline"
hiddenFieldsList="id"
datetimeFieldsList="start_date,end_date"
idlClass="asv"
mode="update"
+ fieldOrder="description,start_date,end_date"
+ [fieldOptions]="{end_date:{customTemplate:{template:endDateTemplate}},
+ start_date:{customTemplate:{template:startDateTemplate},
+ isDataValid:!illegalEndDate}}"
[record]="surveyObj">
</eg-fm-record-editor>
+
+ <ng-template #startDateTemplate let-field="field" let-record="record">
+ <eg-datetime-select
+ initialIso="{{record['start_date'](startDate)}}"
+ (onChangeAsIso)="setStartDate($event)">
+ </eg-datetime-select>
+ </ng-template>
+
+ <ng-template #endDateTemplate let-field="field" let-record="record">
+ <eg-datetime-select
+ initialIso="{{record['end_date'](endDate)}}"
+ (onChangeAsIso)="setEndDate($event)">
+ </eg-datetime-select>
+ <div *ngIf="illegalEndDate" class="mt-3 alert alert-danger" i18n>
+ End date must be after start date.
+ </div>
+ </ng-template>
+
</div>
</ng-template>
</ngb-tab>
newAnswerArray: object[];
newQuestionText: string;
surveyTab: string;
+ illegalEndDate = false;
+ startDate: string;
+ endDate: string;
@ViewChild('editDialog', { static: true }) editDialog: FmRecordEditorComponent;
).subscribe(res => {
this.surveyObj = res;
this.buildLocalArray(res);
+ this.startDate = this.surveyObj.start_date();
+ this.endDate = this.surveyObj.end_date();
+ this.checkForValidDates();
return res;
});
}
}
return false;
}
+
+ setEndDate(event): any {
+ this.endDate = event;
+ this.checkForValidDates();
+ }
+
+ setStartDate(event): any {
+ this.startDate = event;
+ this.checkForValidDates();
+ }
+
+ checkForValidDates(): any {
+ const d1: any = new Date(this.startDate);
+ const d2: any = new Date(this.endDate);
+ if (d1 - d2 >= 0) {
+ this.illegalEndDate = true;
+ } else {
+ this.illegalEndDate = false;
+ }
+ }
+
}
</eg-grid>
<eg-fm-record-editor
+ #editDialog
datetimeFieldsList="start_date,end_date"
hiddenFieldsList="id"
- #editDialog
+ fieldOrder="description,start_date,end_date"
+ [fieldOptions]="{end_date:{customTemplate:{template:endDateTemplate}},
+ start_date:{customTemplate:{template:startDateTemplate},
+ isDataValid:!illegalEndDate}}"
idlClass="asv">
</eg-fm-record-editor>
+<ng-template #startDateTemplate let-field="field" let-record="record">
+ <eg-datetime-select
+ initialIso="{{record['start_date'](startDate)}}"
+ (onChangeAsIso)="setStartDate($event)">
+ </eg-datetime-select>
+</ng-template>
+
+<ng-template #endDateTemplate let-field="field" let-record="record">
+ <eg-datetime-select
+ initialIso="{{record['end_date'](endDate)}}"
+ (onChangeAsIso)="setEndDate($event)">
+ </eg-datetime-select>
+ <div *ngIf="illegalEndDate" class="mt-3 alert alert-danger" i18n>
+ End date must be after start date.
+ </div>
+</ng-template>
+
<eg-string #createString i18n-text text="New Survey Added"></eg-string>
<eg-string #createErrString i18n-text text="Failed to Create New Survey">
</eg-string>
import {GridComponent} from '@eg/share/grid/grid.component';
import {GridDataSource} from '@eg/share/grid/grid';
import {Router} from '@angular/router';
-import {IdlObject} from '@eg/core/idl.service';
+import {IdlService, IdlObject} from '@eg/core/idl.service';
import {PcrudService} from '@eg/core/pcrud.service';
import {FmRecordEditorComponent} from '@eg/share/fm-editor/fm-editor.component';
import {StringComponent} from '@eg/share/string/string.component';
export class SurveyComponent implements OnInit {
gridDataSource: GridDataSource;
+ illegalEndDate: boolean;
+ startDate: string;
+ endDate: string;
@ViewChild('editDialog', { static: true }) editDialog: FmRecordEditorComponent;
@ViewChild('grid', { static: true }) grid: GridComponent;
@ViewChild('endSurveySuccessString', { static: true }) endSurveySuccessString: StringComponent;
@Input() sortField: string;
- @Input() idlClass = 'asv';
- @Input() dialogSize: 'sm' | 'lg' = 'lg';
constructor(
private auth: AuthService,
private net: NetService,
private pcrud: PcrudService,
private toast: ToastService,
- private router: Router
+ private router: Router,
+ private idl: IdlService,
) {
this.gridDataSource = new GridDataSource();
}
const orderBy: any = {};
if (sort.length) {
// Sort specified from grid
- orderBy[this.idlClass] = sort[0].name + ' ' + sort[0].dir;
+ orderBy['asv'] = sort[0].name + ' ' + sort[0].dir;
} else if (this.sortField) {
// Default sort field
- orderBy[this.idlClass] = this.sortField;
+ orderBy['asv'] = this.sortField;
}
const searchOps = {
createNew = () => {
this.editDialog.mode = 'create';
this.editDialog.datetimeFields = 'start_date,end_date';
- this.editDialog.open({size: this.dialogSize}).subscribe(
+ const today = new Date();
+ const d1 = new Date(today);
+ const d2 = new Date(today);
+ d1.setDate(today.getDate() + 1); // default start is in 1 day
+ d2.setDate(today.getDate() + 30); // default end is in 30 days
+ this.startDate = d1.toISOString();
+ this.endDate = d2.toISOString();
+ this.editDialog.open({size: 'lg'}).subscribe(
ok => {
this.createString.current()
.then(str => this.toast.success(str));
}
);
}
+
+ setEndDate(event): any {
+ this.endDate = event;
+ this.checkForValidDates();
+ }
+
+ setStartDate(event): any {
+ this.startDate = event;
+ this.checkForValidDates();
+ }
+
+ checkForValidDates(): any {
+ const d1: any = new Date(this.startDate);
+ const d2: any = new Date(this.endDate);
+ if (d1 - d2 >= 0) {
+ this.illegalEndDate = true;
+ } else {
+ this.illegalEndDate = false;
+ }
+ }
+
}
projects / working / Evergreen.git / commitdiff