Merge branch 'master' into luxiaobei/#INFR-10910

schematics/ng-update/update-13/migrations/name-package-relation.ts

@@ -182,13 +182,15 @@ export const namePackageRelationsInNg13 = {
     LibPackerModule: 'date-picker',
     MonthHeaderComponent: 'date-picker',
     MonthTableComponent: 'date-picker',
+    QuarterTableComponent: 'date-picker',
     DatePopupComponent: 'date-picker',
     InnerPopupComponent: 'date-picker',
     YearHeaderComponent: 'date-picker',
     YearTableComponent: 'date-picker',
     ThyMonthPickerComponent: 'date-picker',
     ThyPickerComponent: 'date-picker',
     ThyDatePickerFormatPipe: 'date-picker',
+    ThyQuarterPickerFormatPipe: 'date-picker',
     ThyDatePickerFormatStringPipe: 'date-picker',
     DatePickerAdvancedShowYearTipPipe: 'date-picker',
     transformDateValue: 'date-picker',
@@ -224,6 +226,7 @@ export const namePackageRelationsInNg13 = {
     RangeEntry: 'date-picker',
     ThyWeekPickerComponent: 'date-picker',
     ThyYearPickerComponent: 'date-picker',
+    ThyQuarterPickerComponent: 'date-picker',
     AttachTypes: 'date-range',
     DateRangeItemInfo: 'date-range',
     ThyDateRangeComponent: 'date-range',

schematics/ng-update/update-9/migrations/import-entry-point-classify.ts

@@ -167,6 +167,7 @@ const NAME_PACKAGE_RELATION = {
     LibPackerModule: 'date-picker',
     MonthPanelComponent: 'date-picker',
     MonthTableComponent: 'date-picker',
+    QuarterTableComponent: 'date-picker',
     PanelMonthData: 'date-picker',
     DatePopupComponent: 'date-picker',
     RangePartType: 'date-picker',
@@ -176,6 +177,7 @@ const NAME_PACKAGE_RELATION = {
     ThyMonthPickerComponent: 'date-picker',
     ThyPickerComponent: 'date-picker',
     ThyDatePickerFormatPipe: 'date-picker',
+    ThyQuarterPickerFormatPipe: 'date-picker',
     ThyDatePickerFormatStringPipe: 'date-picker',
     transformDateValue: 'date-picker',
     convertDate: 'date-picker',
@@ -200,6 +202,7 @@ const NAME_PACKAGE_RELATION = {
     SupportTimeOptions: 'date-picker',
     ThyWeekPickerComponent: 'date-picker',
     ThyYearPickerComponent: 'date-picker',
+    ThyQuarterPickerComponent: 'date-picker',
     AttachTypes: 'date-range',
     DateRangeItemInfo: 'date-range',
     ThyDateRangeComponent: 'date-range',

scripts/name-package-relation.json

@@ -164,13 +164,15 @@
   "LibPackerModule": "date-picker",
   "MonthHeaderComponent": "date-picker",
   "MonthTableComponent": "date-picker",
+  "QuarterTableComponent": "date-picker",
   "DatePopupComponent": "date-picker",
   "InnerPopupComponent": "date-picker",
   "YearHeaderComponent": "date-picker",
   "YearTableComponent": "date-picker",
   "ThyMonthPickerComponent": "date-picker",
   "ThyPickerComponent": "date-picker",
   "ThyDatePickerFormatPipe": "date-picker",
+  "ThyQuarterPickerFormatPipe": "date-picker",
   "ThyDatePickerFormatStringPipe": "date-picker",
   "DatePickerAdvancedShowYearTipPipe": "date-picker",
   "transformDateValue": "date-picker",
@@ -206,6 +208,7 @@
   "RangeEntry": "date-picker",
   "ThyWeekPickerComponent": "date-picker",
   "ThyYearPickerComponent": "date-picker",
+  "ThyQuarterPickerComponent": "date-picker",
   "AttachTypes": "date-range",
   "DateRangeItemInfo": "date-range",
   "ThyDateRangeComponent": "date-range",

src/cascader/cascader.component.html

@@ -36,12 +36,19 @@
   [cdkConnectedOverlayOrigin]="origin"
   [cdkConnectedOverlayPositions]="positions"
   [cdkConnectedOverlayMinWidth]="menuMinWidth"
+  cdkConnectedOverlayTransformOriginOn=".thy-cascader-menus"
   (backdropClick)="closeMenu()"
   (detach)="closeMenu()"
   (attach)="attached()"
   (positionChange)="positionChange($event)"
   [cdkConnectedOverlayOpen]="menuVisible">
-  <div [attr.tabindex]="-1" #menu [ngClass]="menuCls" [ngStyle]="thyMenuStyle" (mouseleave)="mouseleaveMenu($event)">
+  <div
+    [attr.tabindex]="-1"
+    #menu
+    [ngClass]="menuCls"
+    [ngStyle]="thyMenuStyle"
+    (mouseleave)="mouseleaveMenu($event)"
+    [@scaleYMotion]="'enter'">
     <ng-container *ngIf="!isShowSearchPanel">
       <ng-container *ngIf="columns.length > 0; else emptyPlaceholder">
         <ul #cascaderOptionContainers *ngFor="let options of columns; let i = index" [ngClass]="menuColumnCls">

src/cascader/cascader.component.ts

@@ -49,7 +49,7 @@ import { useHostRenderer } from '@tethys/cdk/dom';
 import { ThyCascaderOptionComponent } from './cascader-li.component';
 import { ThyCascaderSearchOptionComponent } from './cascader-search-option.component';
 import { ThyCascaderExpandTrigger, ThyCascaderOption, ThyCascaderSearchOption, ThyCascaderTriggerType } from './types';
-import { deepCopy } from '@angular-devkit/core';
+import { scaleYMotion } from 'ngx-tethys/core';
 
 function toArray<T>(value: T | T[]): T[] {
     let ret: T[];
@@ -119,7 +119,8 @@ const defaultDisplayRender = (label: any) => label.join(' / ');
         ThyCascaderSearchOptionComponent,
         ThyEmptyComponent,
         ThyIconComponent
-    ]
+    ],
+    animations: [scaleYMotion]
 })
 export class ThyCascaderComponent
     extends TabIndexDisabledControlValueAccessorMixin

src/cascader/test/cascader.spec.ts

@@ -17,6 +17,7 @@ import { By } from '@angular/platform-browser';
 import { clone } from '../examples/cascader-address-options';
 import { ThyCascaderModule } from '../module';
 import { ThyCascaderExpandTrigger, ThyCascaderTriggerType } from '../types';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 
 registerLocaleData(zh);
 
@@ -406,7 +407,7 @@ class CascaderMultipleComponent {
 describe('thy-cascader', () => {
     beforeEach(waitForAsync(() => {
         TestBed.configureTestingModule({
-            imports: [FormsModule, CommonModule, OverlayModule, ThyCascaderModule],
+            imports: [FormsModule, CommonModule, OverlayModule, ThyCascaderModule, NoopAnimationsModule],
             declarations: [CascaderTemplateComponent, CascaderBasicComponent, CascaderLoadComponent, CascaderMultipleComponent],
             providers: [{ provide: ComponentFixtureAutoDetect, useValue: true }]
         });

src/date-picker/base-picker.component.ts

@@ -148,6 +148,7 @@ export class BasePickerComponent extends AbstractPickerComponent implements OnIn
         if (!this.thyFormat) {
             const inputFormats: { [key in ThyPanelMode]?: string } = {
                 year: 'yyyy',
+                quarter: 'yyyy-qqq',
                 month: 'yyyy-MM',
                 week: 'yyyy-ww周',
                 date: this.thyShowTime ? 'yyyy-MM-dd HH:mm' : 'yyyy-MM-dd'

src/date-picker/date-picker.directive.spec.ts

@@ -64,6 +64,7 @@ describe('ThyPickerDirective', () => {
                 expect(queryFromOverlay('.thy-calendar-year-btn').textContent.includes('2021')).toBeTruthy();
                 expect(queryFromOverlay('.thy-calendar-month-btn').textContent.includes('10')).toBeTruthy();
             }));
+
             it('should support thyMaxDate', fakeAsync(() => {
                 fixtureInstance.thyValue = new Date('2021-10-10 10:00');
                 fixtureInstance.thyMaxDate = new Date('2021-10-10');
@@ -74,6 +75,7 @@ describe('ThyPickerDirective', () => {
                 const disabledCell = queryFromOverlay('tbody.thy-calendar-tbody td.thy-calendar-disabled-cell');
                 expect(disabledCell.textContent.trim()).toBe('11');
             }));
+
             it('should support thyMinDate', fakeAsync(() => {
                 fixtureInstance.thyValue = new Date('2021-10-11 11:00');
                 fixtureInstance.thyMinDate = new Date('2021-10-11');
@@ -103,6 +105,7 @@ describe('ThyPickerDirective', () => {
                 expect(debugElement.query(By.css('thy-picker .thy-input-disabled'))).toBeNull();
                 expect(debugElement.query(By.css('thy-picker thy-icon.thy-calendar-picker-clear'))).toBeDefined();
             }));
+
             it('should support thyShowTime', fakeAsync(() => {
                 // fixtureInstance.thyAllowClear = true;
                 fixtureInstance.thyValue = new Date();

src/date-picker/date-picker.module.ts

@@ -15,11 +15,12 @@ import { ThyPickerComponent } from './picker.component';
 import { ThyIconModule } from 'ngx-tethys/icon';
 import { ThyInputModule } from 'ngx-tethys/input';
 import { DatePickerRequiredValidator, RangePickerRequiredValidator } from './picker.validators';
-import { ThyDatePickerFormatPipe, ThyDatePickerFormatStringPipe } from './picker.pipes';
+import { ThyDatePickerFormatPipe, ThyDatePickerFormatStringPipe, ThyQuarterPickerFormatPipe } from './picker.pipes';
 import { ThyDatePickerDirective } from './date-picker.directive';
 import { ThyRangePickerDirective } from './range-picker.directive';
 import { ThyPopoverModule } from 'ngx-tethys/popover';
 import { ThyDatePickerConfigService } from './date-picker.service';
+import { ThyQuarterPickerComponent } from './quarter-picker.component';
 
 registerLocaleData(localeZhHans, 'zh-Hans');
 
@@ -36,11 +37,13 @@ registerLocaleData(localeZhHans, 'zh-Hans');
         ThyDatePickerComponent,
         ThyMonthPickerComponent,
         ThyYearPickerComponent,
+        ThyQuarterPickerComponent,
         ThyWeekPickerComponent,
         ThyRangePickerComponent,
         DatePickerRequiredValidator,
         RangePickerRequiredValidator,
         ThyDatePickerFormatPipe,
+        ThyQuarterPickerFormatPipe,
         ThyDatePickerFormatStringPipe,
         ThyDatePickerDirective,
         ThyRangePickerDirective
@@ -50,10 +53,12 @@ registerLocaleData(localeZhHans, 'zh-Hans');
         ThyRangePickerComponent,
         ThyMonthPickerComponent,
         ThyYearPickerComponent,
+        ThyQuarterPickerComponent,
         ThyWeekPickerComponent,
         DatePickerRequiredValidator,
         RangePickerRequiredValidator,
         ThyDatePickerFormatPipe,
+        ThyQuarterPickerFormatPipe,
         ThyDatePickerFormatStringPipe,
         ThyDatePickerDirective,
         ThyRangePickerDirective

src/date-picker/date-picker.service.spec.ts

@@ -1,20 +1,26 @@
 import { ThyDatePickerConfigService } from './date-picker.service';
 import { DEFAULT_DATE_PICKER_CONFIG } from './date-picker.config';
+
 describe('thyDatePickerConfigService Angular testing', () => {
     let thyDatePickerConfigService: ThyDatePickerConfigService = new ThyDatePickerConfigService(DEFAULT_DATE_PICKER_CONFIG);
     const { showShortcut, shortcutPosition, shortcutDatePresets, shortcutRangesPresets, weekStartsOn } = DEFAULT_DATE_PICKER_CONFIG;
+
     it('get default shortcut', () => {
         expect(thyDatePickerConfigService.showShortcut).toBe(showShortcut);
     });
+
     it('get default shortcut position', () => {
         expect(thyDatePickerConfigService.shortcutPosition).toBe(shortcutPosition);
     });
+
     it('get default shortcut date presets', () => {
         expect(thyDatePickerConfigService.shortcutDatePresets).toBe(shortcutDatePresets);
     });
+
     it('get default shortcut ranges presets', () => {
         expect(thyDatePickerConfigService.shortcutRangesPresets).toBe(shortcutRangesPresets);
     });
+
     it('get default weekStartsOn', () => {
         expect(thyDatePickerConfigService.config.weekStartsOn).toBe(weekStartsOn);
     });

src/date-picker/examples/basic/basic.component.html

@@ -6,9 +6,9 @@
     thyPlaceHolder="选择时间"
     [(ngModel)]="dateTime"
     (ngModelChange)="onChange($event)"
-    [thyAllowClear]="isAllowClear"
-  ></thy-date-picker>
+    [thyAllowClear]="isAllowClear"></thy-date-picker>
 </thy-form-group>
+
 <thy-form-group thyLabelText="高级时间选择器">
   <thy-date-picker
     class="d-block w-50 mb-3"
@@ -19,18 +19,17 @@
     (ngModelChange)="onChange($event)"
     [thyAllowClear]="isAllowClear"
     [thyShowShortcut]="true"
-    [thyShortcutPresets]="shortcutDatePresets"
-  ></thy-date-picker>
+    [thyShortcutPresets]="shortcutDatePresets"></thy-date-picker>
 </thy-form-group>
+
 <thy-form-group thyLabelText="周选择器">
   <thy-date-picker
     class="d-block w-50 mb-3"
     thyPlaceHolder="选择周"
     [(ngModel)]="week"
     (ngModelChange)="onChange($event)"
     [thyAllowClear]="isAllowClear"
-    [thyMode]="'week'"
-  ></thy-date-picker>
+    [thyMode]="'week'"></thy-date-picker>
 </thy-form-group>
 
 <thy-form-group thyLabelText="月份选择器">
@@ -39,8 +38,7 @@
     [(ngModel)]="dateTime"
     (ngModelChange)="onChange($event)"
     [thyAllowClear]="isAllowClear"
-    thyPlaceHolder="请选择月份"
-  >
+    thyPlaceHolder="请选择月份">
   </thy-month-picker>
 </thy-form-group>
 
@@ -50,8 +48,16 @@
     [(ngModel)]="dateTime"
     (ngModelChange)="onChange($event)"
     [thyAllowClear]="isAllowClear"
-    thyPlaceHolder="请选择年份"
-  ></thy-year-picker>
+    thyPlaceHolder="请选择年份"></thy-year-picker>
+</thy-form-group>
+
+<thy-form-group thyLabelText="季度选择器">
+  <thy-quarter-picker
+    class="d-block w-50 mb-3"
+    [(ngModel)]="dateTime"
+    (ngModelChange)="onChange($event)"
+    [thyAllowClear]="isAllowClear"
+    thyPlaceHolder="请选择季度"></thy-quarter-picker>
 </thy-form-group>
 
 <thy-form-group thyLabelText="月份范围选择器">
@@ -61,17 +67,15 @@
     (ngModelChange)="onChange($event)"
     [thyAllowClear]="isAllowClear"
     [thyMode]="'month'"
-    [thyAutoStartAndEnd]="true"
-  ></thy-range-picker>
+    [thyAutoStartAndEnd]="true"></thy-range-picker>
 </thy-form-group>
 
 <thy-form-group thyLabelText="日期范围选择器">
   <thy-range-picker
     class="d-block w-50 mb-3"
     [(ngModel)]="dateRange"
     (ngModelChange)="onChange($event)"
-    [thyAllowClear]="isAllowClear"
-  ></thy-range-picker>
+    [thyAllowClear]="isAllowClear"></thy-range-picker>
 </thy-form-group>
 
 <thy-form-group thyLabelText="年范围选择器">
@@ -80,8 +84,7 @@
     [(ngModel)]="yearRange"
     thyMode="year"
     (ngModelChange)="onChange($event)"
-    [thyAllowClear]="isAllowClear"
-  ></thy-range-picker>
+    [thyAllowClear]="isAllowClear"></thy-range-picker>
 </thy-form-group>
 
 <thy-form-group thyLabelText="周范围选择器">
@@ -92,8 +95,16 @@
     (ngModelChange)="onChange($event)"
     [thyAllowClear]="isAllowClear"
     [thyShowShortcut]="true"
-    [thyShortcutPresets]="shortcutMonthPresets"
-  ></thy-range-picker>
+    [thyShortcutPresets]="shortcutMonthPresets"></thy-range-picker>
+</thy-form-group>
+
+<thy-form-group thyLabelText="季度范围选择器">
+  <thy-range-picker
+    class="d-block w-50 mb-3"
+    [(ngModel)]="quarterRange"
+    thyMode="quarter"
+    (ngModelChange)="onChange($event)"
+    [thyAllowClear]="isAllowClear"></thy-range-picker>
 </thy-form-group>
 
 <thy-form-group thyLabelText="高级范围选择器">
@@ -103,6 +114,5 @@
     thyMode="flexible"
     [thyShowShortcut]="true"
     (ngModelChange)="onChange($event)"
-    [thyAllowClear]="isAllowClear"
-  ></thy-range-picker>
+    [thyAllowClear]="isAllowClear"></thy-range-picker>
 </thy-form-group>

src/date-picker/examples/basic/basic.component.ts

@@ -18,12 +18,14 @@ export class ThyDatePickerBasicExampleComponent implements OnInit {
     flexibleDateTime = 1234567890;
     week = { date: new Date(), with_time: 0 };
 
-    dateRange = { begin: new Date('2021-10'), end: new Date('2021-12') };
+    dateRange = { begin: new Date('2023-10'), end: new Date('2023-12') };
 
     weekRange = { begin: new Date('2021-10-03'), end: new Date('2021-12-12') };
 
     yearRange = { begin: new Date('2021'), end: new Date('2028') };
 
+    quarterRange = { begin: new Date('2023-6'), end: new Date('2023-12') };
+
     flexibleDateRange: ThyDateRangeEntry;
 
     isAllowClear = true;