feat(theme:pipe:date): add global config (#1711)

packages/abc/st/test/st-data-source.spec.ts

@@ -1,9 +1,11 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { DecimalPipe } from '@angular/common';
 import { HttpParams } from '@angular/common/http';
+import { TestBed } from '@angular/core/testing';
 import { firstValueFrom, of, throwError } from 'rxjs';
 
 import { DatePipe, YNPipe } from '@delon/theme';
+import { CurrencyService } from '@delon/util/format';
 import { deepCopy } from '@delon/util/other';
 import { NzSafeAny } from 'ng-zorro-antd/core/types';
 
@@ -39,7 +41,7 @@ describe('abc: table: data-souce', () => {
   let datePipe: DatePipe;
   let ynPipe: YNPipe;
   let decimalPipe: DecimalPipe;
-  let currencySrv: MockCurrencyService;
+  let currencySrv: CurrencyService;
   let httpResponse: any;
   let mockDomSanitizer: MockDomSanitizer;
 
@@ -49,22 +51,11 @@ describe('abc: table: data-souce', () => {
     }
   }
 
-  class MockCurrencyService {
-    format(): string {
-      return '';
-    }
-  }
-
   class MockDomSanitizer {
     bypassSecurityTrustHtml(val: any): any {
       return val;
     }
   }
-  class MockNzI18nService {
-    getDateLocale(): null {
-      return null;
-    }
-  }
 
   function genModule(): void {
     options = {
@@ -78,13 +69,16 @@ describe('abc: table: data-souce', () => {
       columns: [{ title: '', index: 'id' }] as _STColumn[],
       paginator: true
     };
+    TestBed.configureTestingModule({
+      providers: [DatePipe, YNPipe, DecimalPipe, CurrencyService]
+    });
     mockDomSanitizer = new MockDomSanitizer() as any;
-    datePipe = new DatePipe(new MockNzI18nService() as any);
-    ynPipe = new YNPipe(mockDomSanitizer as any);
-    decimalPipe = new DecimalPipe('zh-CN');
+    datePipe = TestBed.inject(DatePipe);
+    ynPipe = TestBed.inject(YNPipe);
+    decimalPipe = TestBed.inject(DecimalPipe);
     http = new MockHttpClient();
-    currencySrv = new MockCurrencyService();
-    srv = new STDataSource(http as any, datePipe, ynPipe, decimalPipe, currencySrv as any, mockDomSanitizer as any);
+    currencySrv = TestBed.inject(CurrencyService);
+    srv = new STDataSource(http as any, datePipe, ynPipe, decimalPipe, currencySrv, mockDomSanitizer as any);
     srv.setCog(ST_DEFAULT_CONFIG);
   }
 

packages/abc/st/test/st.spec.ts

@@ -5,32 +5,14 @@ import { By } from '@angular/platform-browser';
 import { Router } from '@angular/router';
 import { of, Subject, throwError } from 'rxjs';
 
-import {
-  DatePipe,
-  DelonLocaleService,
-  DrawerHelper,
-  en_US,
-  ModalHelper,
-  _HttpClient,
-  AlainI18NService
-} from '@delon/theme';
+import { DelonLocaleService, DrawerHelper, en_US, ModalHelper, _HttpClient, AlainI18NService } from '@delon/theme';
+import { formatDate } from '@delon/util/date-time';
 import { deepCopy } from '@delon/util/other';
 import { NzPaginationComponent } from 'ng-zorro-antd/pagination';
 import { NzTooltipDirective } from 'ng-zorro-antd/tooltip';
 
 import { STWidgetRegistry } from './../st-widget';
-import {
-  PS,
-  DEFAULTCOUNT,
-  USERS,
-  MOCKDATE,
-  MOCKIMG,
-  genData,
-  MockNzI18nService,
-  PageObject,
-  TestComponent,
-  genModule
-} from './base.spec';
+import { PS, DEFAULTCOUNT, USERS, MOCKDATE, MOCKIMG, genData, PageObject, TestComponent, genModule } from './base.spec';
 import { STDataSource } from '../st-data-source';
 import { STExport } from '../st-export';
 import { STComponent } from '../st.component';
@@ -269,7 +251,7 @@ describe('abc: st', () => {
           it(`should be render date`, fakeAsync(() => {
             page
               .updateColumn([{ title: '', index: 'date', type: 'date' }])
-              .expectCell(new DatePipe(new MockNzI18nService() as any).transform(MOCKDATE, 'yyyy-MM-dd HH:mm'))
+              .expectCell(formatDate(MOCKDATE, 'yyyy-MM-dd HH:mm'))
               .asyncEnd();
           }));
           it(`should be custom render date format`, fakeAsync(() => {
@@ -282,7 +264,7 @@ describe('abc: st', () => {
                   dateFormat: 'yyyy-MM'
                 }
               ])
-              .expectCell(new DatePipe(new MockNzI18nService() as any).transform(MOCKDATE, 'yyyy-MM'))
+              .expectCell(formatDate(MOCKDATE, 'yyyy-MM'))
               .asyncEnd();
           }));
           it(`should be text center`, fakeAsync(() => {

packages/theme/src/pipes/date/date.pipe.ts

@@ -1,13 +1,15 @@
-import { Pipe, PipeTransform } from '@angular/core';
+import { Pipe, PipeTransform, inject } from '@angular/core';
 
+import { AlainConfigService } from '@delon/util/config';
 import { formatDate } from '@delon/util/date-time';
 import { NzI18nService } from 'ng-zorro-antd/i18n';
 
 @Pipe({ name: '_date', standalone: true })
 export class DatePipe implements PipeTransform {
-  constructor(private nzI18n: NzI18nService) {}
+  private nzI18n = inject(NzI18nService);
+  private defFormat = inject(AlainConfigService).get('themePipe')?.dateFormat ?? 'yyyy-MM-dd HH:mm';
 
-  transform(value: Date | string | number, formatString: string = 'yyyy-MM-dd HH:mm'): string {
-    return formatDate(value, formatString, this.nzI18n.getDateLocale());
+  transform(value: Date | string | number, formatString?: string | null): string {
+    return formatDate(value, formatString ?? this.defFormat, this.nzI18n.getDateLocale());
   }
 }

packages/util/config/config.types.ts

@@ -27,6 +27,7 @@ import { AlainChartConfig } from './chart/chart.type';
 import { AlainMockConfig } from './mock/mock.type';
 import { AlainSFConfig } from './sf/sf.type';
 import { AlainThemeHttpClientConfig, AlainThemeResponsiveConfig, AlainThemeI18nConfig } from './theme/index';
+import { AlainThemePipeConfig } from './theme/pipe.type';
 import { AlainUtilArrayConfig } from './util/array.type';
 import { AlainUtilCurrencyConfig } from './util/currency.type';
 
@@ -60,6 +61,7 @@ export interface AlainConfig {
   themeHttp?: AlainThemeHttpClientConfig;
   themeResponsive?: AlainThemeResponsiveConfig;
   themeI18n?: AlainThemeI18nConfig;
+  themePipe?: AlainThemePipeConfig;
 }
 
 export type AlainConfigKey = keyof AlainConfig;

packages/util/config/theme/pipe.type.ts

@@ -0,0 +1,3 @@
+export interface AlainThemePipeConfig {
+  dateFormat?: string;
+}