Format date fields without patch form

src/app/products/charges/create-charge/create-charge.component.ts

@@ -2,11 +2,11 @@
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Create charge component.
@@ -43,14 +43,14 @@ export class CreateChargeComponent implements OnInit {
    * @param {ProductsService} productsService Products Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
-   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {Dates} dateUtils Date Utils to format date.
    * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private productsService: ProductsService,
               private route: ActivatedRoute,
               private router: Router,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private settingsService: SettingsService) {
     this.route.data.subscribe((data: { chargesTemplate: any }) => {
       this.chargesTemplateData = data.chargesTemplate;
@@ -214,26 +214,30 @@ export class CreateChargeComponent implements OnInit {
    * if successful redirects to charges.
    */
   submit() {
+    const chargeFormData = this.chargeForm.value;
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevFeeOnMonthDay: Date = this.chargeForm.value.feeOnMonthDay;
     const monthDayFormat = 'dd MMM';
-    this.chargeForm.patchValue({
-      feeOnMonthDay: this.datePipe.transform(prevFeeOnMonthDay, monthDayFormat)
-    });
-    const charge = this.chargeForm.getRawValue();
-    // TODO: Update once language and date settings are setup
-    charge.locale = this.settingsService.language.code;
-    charge.monthDayFormat = monthDayFormat;
-    delete charge.addFeeFrequency;
-    if (!charge.taxGroupId) {
-      delete charge.taxGroupId;
+    if (chargeFormData.feeOnMonthDay instanceof Date) {
+      chargeFormData.feeOnMonthDay = this.dateUtils.formatDate(prevFeeOnMonthDay, monthDayFormat);
     }
-    if (!charge.minCap) {
-      delete charge.minCap;
+    const data = {
+      ...chargeFormData,
+      monthDayFormat,
+      locale
+    };
+    delete data.addFeeFrequency;
+    if (!data.taxGroupId) {
+      delete data.taxGroupId;
     }
-    if (!charge.maxCap) {
-      delete charge.maxCap;
+    if (!data.minCap) {
+      delete data.minCap;
     }
-    this.productsService.createCharge(charge).subscribe((response: any) => {
+    if (!data.maxCap) {
+      delete data.maxCap;
+    }
+    this.productsService.createCharge(data).subscribe((response: any) => {
       this.router.navigate(['../'], { relativeTo: this.route });
     });
   }

src/app/products/fixed-deposit-products/fixed-deposit-product-stepper/fixed-deposit-product-interest-rate-chart-step/fixed-deposit-product-interest-rate-chart-step.component.ts

@@ -1,7 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit, Input } from '@angular/core';
 import { FormGroup, FormBuilder, Validators, FormArray } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { MatDialog } from '@angular/material/dialog';
 import { animate, state, style, transition, trigger } from '@angular/animations';
 
@@ -17,6 +16,7 @@ import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
 
 /** Custom Services */
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 @Component({
   selector: 'mifosx-fixed-deposit-product-interest-rate-chart-step',
@@ -59,13 +59,13 @@ export class FixedDepositProductInterestRateChartStepComponent implements OnInit
   /**
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {MatDialog} dialog Dialog reference.
-   * @param {DatePipe} datePipe Date Pipe.
+   * @param {Dates} dateUtils Date Utils.
    * @param {SettingsService} settingsService Settings Service.
    */
 
   constructor(private formBuilder: FormBuilder,
               public dialog: MatDialog,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private settingsService: SettingsService) {
     this.createFixedDepositProductInterestRateChartForm();
   }
@@ -375,8 +375,8 @@ export class FixedDepositProductInterestRateChartStepComponent implements OnInit
     for (const chart of fixedDepositProductInterestRateChart.charts) {
       chart.dateFormat = dateFormat;
       chart.locale = locale;
-      chart.fromDate = this.datePipe.transform(chart.fromDate, dateFormat) || '';
-      chart.endDate = this.datePipe.transform(chart.endDate, dateFormat) || '';
+      chart.fromDate = this.dateUtils.formatDate(chart.fromDate, dateFormat) || '';
+      chart.endDate = this.dateUtils.formatDate(chart.endDate, dateFormat) || '';
       if (chart.endDate === '') {
         delete chart.endDate;
       }

src/app/products/floating-rates/create-floating-rate/create-floating-rate.component.ts

@@ -49,7 +49,7 @@ export class CreateFloatingRateComponent implements OnInit {
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {ProductsService} productsService Product Service.
    * @param {ActivatedRoute} route Activated Route.
-   * @param {DatePipe} datePipe Date Pipe.
+   * @param {DatePipe} datePipe Date Utils.
    * @param {MatDialog} dialog Dialog reference.
    * @param {SettingsService} settingsService Settings Service.
    */

src/app/products/floating-rates/edit-floating-rate/edit-floating-rate.component.ts

@@ -54,7 +54,7 @@ export class EditFloatingRateComponent implements OnInit {
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {ProductsService} productsService Product Service.
    * @param {ActivatedRoute} route Activated Route.
-   * @param {DatePipe} datePipe Date Pipe.
+   * @param {DatePipe} datePipe Date Utils.
    * @param {MatDialog} dialog Dialog reference.
    * @param {SettingsService} settingsService Settings Service.
    */

src/app/products/loan-products/loan-product-stepper/loan-product-details-step/loan-product-details-step.component.ts

@@ -1,7 +1,7 @@
 /** Angular Imports */
 import { Component, OnInit, Input } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
+import { Dates } from 'app/core/utils/dates';
 
 /** Custom Services */
 import { SettingsService } from 'app/settings/settings.service';
@@ -24,12 +24,12 @@ export class LoanProductDetailsStepComponent implements OnInit {
 
   /**
    * @param {FormBuilder} formBuilder Form Builder.
-   * @param {DatePipe} datePipe Date Pipe.
+   * @param {Dates} dateUtils Date Utils.
    * @param {SettingsService} settingsService Settings Service.
    */
 
   constructor(private formBuilder: FormBuilder,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private settingsService: SettingsService) {
     this.createLoanProductDetailsForm();
   }
@@ -61,15 +61,17 @@ export class LoanProductDetailsStepComponent implements OnInit {
   }
 
   get loanProductDetails() {
+    const loanProductDetailsFormData = this.loanProductDetailsForm.value;
     const prevStartDate: Date = this.loanProductDetailsForm.value.startDate;
     const prevCloseDate: Date = this.loanProductDetailsForm.value.closeDate;
-    // TODO: Update once language and date settings are setup
     const dateFormat = this.settingsService.dateFormat;
-    this.loanProductDetailsForm.patchValue({
-      startDate: this.datePipe.transform(prevStartDate, dateFormat) || '',
-      closeDate: this.datePipe.transform(prevCloseDate, dateFormat) || ''
-    });
-    return this.loanProductDetailsForm.value;
+    if (loanProductDetailsFormData.startDate instanceof Date) {
+      loanProductDetailsFormData.startDate = this.dateUtils.formatDate(prevStartDate, dateFormat) || '';
+    }
+    if (loanProductDetailsFormData.closeDate instanceof Date) {
+      loanProductDetailsFormData.closeDate = this.dateUtils.formatDate(prevCloseDate, dateFormat) || '';
+    }
+    return loanProductDetailsFormData;
   }
 
 }

src/app/products/manage-tax-components/create-tax-component/create-tax-component.component.ts

@@ -2,11 +2,11 @@
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Create Tax Component component.
@@ -41,14 +41,14 @@ export class CreateTaxComponentComponent implements OnInit {
    * @param {ProductsService} productsService Products Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
-   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {Dates} dateUtils Date Utils to format date.
    * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private productsService: ProductsService,
               private route: ActivatedRoute,
               private router: Router,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private settingsService: SettingsService) {
     this.route.data.subscribe((data: { taxComponentTemplate: any }) => {
       this.taxComponentTemplateData = data.taxComponentTemplate;
@@ -115,16 +115,19 @@ export class CreateTaxComponentComponent implements OnInit {
    * if successful redirects to Tax Components.
    */
   submit() {
-    const prevStartDate: Date = this.taxComponentForm.value.startDate;
-    // TODO: Update once language and date settings are setup
+    const taxComponentFormData = this.taxComponentForm.value;
+    const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    this.taxComponentForm.patchValue({
-      startDate: this.datePipe.transform(prevStartDate, dateFormat)
-    });
-    const taxComponent = this.taxComponentForm.value;
-    taxComponent.locale = this.settingsService.language.code;
-    taxComponent.dateFormat = dateFormat;
-    this.productsService.createTaxComponent(taxComponent).subscribe((response: any) => {
+    const prevStartDate: Date = this.taxComponentForm.value.startDate;
+    if (taxComponentFormData.startDate instanceof Date) {
+      taxComponentFormData.startDate = this.dateUtils.formatDate(prevStartDate, dateFormat);
+    }
+    const data = {
+      ...taxComponentFormData,
+      dateFormat,
+      locale
+    };
+    this.productsService.createTaxComponent(data).subscribe((response: any) => {
       this.router.navigate(['../', response.resourceId], { relativeTo: this.route });
     });
   }

src/app/products/manage-tax-components/edit-tax-component/edit-tax-component.component.ts

@@ -2,11 +2,11 @@
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Edit tax component.
@@ -31,14 +31,14 @@ export class EditTaxComponentComponent implements OnInit {
    * @param {ProductsService} productsService Products Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
-   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {Dates} dateUtils Date Utils to format date.
    * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private productsService: ProductsService,
               private route: ActivatedRoute,
               private router: Router,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private settingsService: SettingsService) {
     this.route.data.subscribe((data: { taxComponent: any }) => {
       this.taxComponentData = data.taxComponent;
@@ -70,16 +70,19 @@ export class EditTaxComponentComponent implements OnInit {
    * if successfull redirects to tax component.
    */
   submit() {
-    const prevStartDate: Date = this.taxComponentForm.value.startDate;
-    // TODO: Update once language and date settings are setup
+    const taxComponentFormData = this.taxComponentForm.value;
+    const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    this.taxComponentForm.patchValue({
-      startDate: this.datePipe.transform(prevStartDate, dateFormat)
-    });
-    const taxComponent = this.taxComponentForm.value;
-    taxComponent.locale = this.settingsService.language.code;
-    taxComponent.dateFormat = dateFormat;
-    this.productsService.updateTaxComponent(this.taxComponentData.id, taxComponent).subscribe((response: any) => {
+    const prevStartDate: Date = this.taxComponentForm.value.startDate;
+    if (taxComponentFormData.startDate instanceof Date) {
+      taxComponentFormData.startDate = this.dateUtils.formatDate(prevStartDate, dateFormat);
+    }
+    const data = {
+      ...taxComponentFormData,
+      dateFormat,
+      locale
+    };
+    this.productsService.updateTaxComponent(this.taxComponentData.id, data).subscribe((response: any) => {
       this.router.navigate(['../../', response.resourceId], { relativeTo: this.route });
     });
   }

src/app/products/manage-tax-groups/create-tax-group/create-tax-group.component.ts

@@ -48,7 +48,7 @@ export class CreateTaxGroupComponent implements OnInit {
    * @param {ProductsService} productsService Products Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
-   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {DatePipe} datePipe Date Utils to format date.
    * @param {MatDialog} dialog Dialog reference.
    * @param {SettingsService} settingsService Settings Service.
    */

src/app/products/manage-tax-groups/edit-tax-group/edit-tax-group.component.ts

@@ -48,7 +48,7 @@ export class EditTaxGroupComponent implements OnInit {
    * @param {ProductsService} productsService Products Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
-   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {DatePipe} datePipe Date Utils to format date.
    * @param {MatDialog} dialog Dialog reference.
    * @param {SettingsService} settingsService Settings Service.
    */

src/app/products/recurring-deposit-products/recurring-deposit-product-stepper/recurring-deposit-product-interest-rate-chart-step/recurring-deposit-product-interest-rate-chart-step.component.ts

@@ -1,7 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit, Input } from '@angular/core';
 import { FormGroup, FormBuilder, Validators, FormArray } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { MatDialog } from '@angular/material/dialog';
 import { animate, state, style, transition, trigger } from '@angular/animations';
 
@@ -17,6 +16,7 @@ import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
 
 
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 @Component({
   selector: 'mifosx-recurring-deposit-product-interest-rate-chart-step',
@@ -59,13 +59,13 @@ export class RecurringDepositProductInterestRateChartStepComponent implements On
   /**
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {MatDialog} dialog Dialog reference.
-   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {Dates} dateUtils Date Utils to format date.
    * @param {SettingsService} settingsService Settings Service.
    */
 
   constructor(private formBuilder: FormBuilder,
               public dialog: MatDialog,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private settingsService: SettingsService) {
     this.createrecurringDepositProductInterestRateChartForm();
   }
@@ -376,8 +376,8 @@ export class RecurringDepositProductInterestRateChartStepComponent implements On
     for (const chart of recurringDepositProductInterestRateChart.charts) {
       chart.dateFormat = dateFormat;
       chart.locale = locale;
-      chart.fromDate = this.datePipe.transform(chart.fromDate, dateFormat) || '';
-      chart.endDate = this.datePipe.transform(chart.endDate, dateFormat) || '';
+      chart.fromDate = this.dateUtils.formatDate(chart.fromDate, dateFormat) || '';
+      chart.endDate = this.dateUtils.formatDate(chart.endDate, dateFormat) || '';
       if (chart.endDate === '') {
         delete chart.endDate;
       }

src/app/products/share-products/create-dividend/create-dividend.component.ts

@@ -2,7 +2,7 @@
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
-import { DatePipe } from '@angular/common';
+import { Dates } from 'app/core/utils/dates';
 
 /** Custom Services. */
 import { ProductsService } from 'app/products/products.service';
@@ -32,14 +32,14 @@ export class CreateDividendComponent implements OnInit {
    * Get Share Product data from `Resolver`.
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {ActivatedRoute} route Activated Route.
-   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {Dates} dateUtils Date Utils to format date.
    * @param {ProductsService} productsService Products Service.
    * @param {Router} router Router.
    * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private route: ActivatedRoute,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private productService: ProductsService,
               private router: Router,
               private settingsService: SettingsService) {
@@ -67,17 +67,23 @@ export class CreateDividendComponent implements OnInit {
    * Submits Create Dividend form.
    */
   submit() {
+    const createDividendFormData = this.createDividendForm.value;
+    const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    const startDate = this.createDividendForm.value.dividendPeriodStartDate;
-    const endDate = this.createDividendForm.value.dividendPeriodEndDate;
-    this.createDividendForm.patchValue({
-      'dividendPeriodStartDate': this.datePipe.transform(startDate, dateFormat),
-      'dividendPeriodEndDate': this.datePipe.transform(endDate, dateFormat)
-    });
-    const dividendForm = this.createDividendForm.value;
-    dividendForm.locale = this.settingsService.language.code;
-    dividendForm.dateFormat = dateFormat;
-    this.productService.createDividend(this.shareProductData.id, dividendForm).subscribe((response: any) => {
+    const prevStartDate: Date = this.createDividendForm.value.dividendPeriodStartDate;
+    const prevEndDate: Date = this.createDividendForm.value.dividendPeriodEndDate;
+    if (createDividendFormData.dividendPeriodStartDate instanceof Date) {
+      createDividendFormData.dividendPeriodStartDate = this.dateUtils.formatDate(prevStartDate, dateFormat);
+    }
+    if (createDividendFormData.dividendPeriodEndDate instanceof Date) {
+      createDividendFormData.dividendPeriodEndDate = this.dateUtils.formatDate(prevEndDate, dateFormat);
+    }
+    const data = {
+      ...createDividendFormData,
+      dateFormat,
+      locale
+    };
+    this.productService.createDividend(this.shareProductData.id, data).subscribe((response: any) => {
       this.router.navigate(['../'], { relativeTo: this.route });
     });
   }

src/app/products/share-products/share-product-stepper/share-product-market-price-step/share-product-market-price-step.component.ts

@@ -30,8 +30,8 @@ export class ShareProductMarketPriceStepComponent implements OnInit {
 
   /**
    * @param {FormBuilder} formBuilder Form Builder.
-   * @param {DatePipe} datePipe Date Pipe to format date.
-   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {DatePipe} datePipe Date Utils to format date.
+   * @param {DatePipe} datePipe Date Utils to format date.
    * @param {SettingsService} settingsService Settings Service
    */