refactor: debug cascader

src/cascader/cascader.component.html

@@ -42,13 +42,10 @@
   (attach)="attached()"
   (positionChange)="positionChange($event)"
   [cdkConnectedOverlayOpen]="menuVisible">
-  <div
-    [attr.tabindex]="-1"
-    #menu
-    [ngClass]="menuCls"
-    [ngStyle]="thyMenuStyle"
-    (mouseleave)="mouseleaveMenu($event)"
-    [@scaleYMotion]="'enter'">
+  <div [attr.tabindex]="-1" #menu [ngClass]="menuCls" [ngStyle]="thyMenuStyle" (mouseleave)="mouseleaveMenu($event)">
+    <!-- [@scaleYMotion]="'enter'"
+  (@scaleYMotion.start)="animationStart($event)"
+  (@scaleYMotion.done)="animationDone($event)" -->
     <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

@@ -43,7 +43,7 @@ import { ThyCascaderOptionComponent } from './cascader-li.component';
 import { ThyCascaderSearchOptionComponent } from './cascader-search-option.component';
 import { ThyCascaderExpandTrigger, ThyCascaderOption, ThyCascaderSearchOption, ThyCascaderTriggerType } from './types';
 import { ThyCascaderService } from './cascader.service';
-import { scaleYMotion } from 'ngx-tethys/core';
+// import { scaleYMotion } from 'ngx-tethys/core';
 
 /**
  * 级联选择菜单
@@ -79,8 +79,9 @@ import { scaleYMotion } from 'ngx-tethys/core';
         ThyCascaderSearchOptionComponent,
         ThyEmptyComponent,
         ThyIconComponent
-    ],
-    animations: [scaleYMotion]
+    ]
+    // ,
+    // animations: [scaleYMotion]
 })
 export class ThyCascaderComponent
     extends TabIndexDisabledControlValueAccessorMixin
@@ -629,10 +630,20 @@ export class ThyCascaderComponent
             return;
         }
         if (this.isHoverTriggerAction()) {
+            console.log('---hover了---');
             this.setMenuVisible(!this.menuVisible);
+            console.log('---setMenuVisible 了---', this.menuVisible);
         }
     }
 
+    animationStart(event: any) {
+        console.log('动画开始', event);
+    }
+
+    animationDone(event: any) {
+        console.log('动画结束', event);
+    }
+
     public clickOption(option: ThyCascaderOption, index: number, event: Event | boolean): void {
         this.thyCascaderService.clickOption(option, index, event, this.selectOption);
     }

src/cascader/examples/basic/basic.component.html

@@ -1,2 +1,2 @@
-<thy-cascader [thyOptions]="areaCode" [(ngModel)]="values" (ngModelChange)="selectChanges($event)" thyColumnClassName="column-class-name">
-</thy-cascader>
+<!-- <thy-cascader [thyOptions]="areaCode" [(ngModel)]="values" (ngModelChange)="selectChanges($event)" thyColumnClassName="column-class-name">
+</thy-cascader> -->

src/cascader/examples/custom-template/custom-template.component.html

@@ -1,4 +1,4 @@
-<thy-cascader
+<!-- <thy-cascader
   [thyOptions]="thyCustomerOptions"
   (ngModelChange)="selectChange($event)"
   [(ngModel)]="curVal"
@@ -20,4 +20,4 @@
       </span>
     </ng-container>
   </ng-container>
-</ng-template>
+</ng-template> -->

src/cascader/examples/disabled/disabled.component.html

@@ -1,4 +1,4 @@
-<div class="custom-disabled-container">
+<!-- <div class="custom-disabled-container">
   <div class="mb-2">选择框禁用：</div>
   <div class="d-flex mb-2">
     <thy-cascader class="mr-2" [thyDisabled]="true" style="width: 200px"></thy-cascader>
@@ -24,4 +24,4 @@
       <span *ngIf="isLast && label"> {{ label }}</span>
     </ng-container>
   </ng-template>
-</div>
+</div> -->

src/cascader/examples/empty/empty.component.ts

@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
 
 @Component({
     selector: 'thy-cascader-empty-example',
-    template: ` <thy-cascader [thyOptions]="[]" thyEmptyStateText="Hello World" style="width:200px"> </thy-cascader> `
+    template: ``
 })
 export class ThyCascaderEmptyExampleComponent {
     public values: any[] = [];

src/cascader/examples/move-unfold-trigger/move-unfold-trigger.component.html

@@ -1,9 +1,9 @@
-<thy-cascader
+<!-- <thy-cascader
   [thyOptions]="areaCode"
   (ngModelChange)="selectChanges($event)"
   [(ngModel)]="values"
   thyExpandTriggerAction="hover"
   thyTriggerAction="hover"
   style="width:200px;"
 >
-</thy-cascader>
+</thy-cascader> -->

src/cascader/examples/move-unfold/index.md

@@ -1,4 +1,4 @@
 ---
 title: Move-Unfold
-order: 30
+order: 0
 ---

src/cascader/examples/multiple/multiple.component.html

@@ -1,4 +1,4 @@
-<thy-cascader
+<!-- <thy-cascader
   [thyOptions]="areaCode"
   [(ngModel)]="values"
   [thyMultiple]="true"
@@ -12,4 +12,4 @@
   <ng-container *ngFor="let label of labels; let i = index; let isLast = last">
     <span *ngIf="isLast && label"> {{ label }}</span>
   </ng-container>
-</ng-template>
+</ng-template> -->

src/cascader/examples/search/search.component.html

@@ -1,4 +1,4 @@
-<thy-cascader
+<!-- <thy-cascader
   class="mb-3"
   [thyOptions]="areaCode"
   [thyShowSearch]="true"
@@ -22,4 +22,4 @@
   <ng-container *ngFor="let label of labels; let i = index; let isLast = last">
     <span *ngIf="isLast && label"> {{ label }}</span>
   </ng-container>
-</ng-template>
+</ng-template> -->

src/cascader/examples/select-changed/select-changed.component.html

@@ -1,8 +1,8 @@
-<thy-cascader
+<!-- <thy-cascader
   [thyOptions]="areaCode"
   (ngModelChange)="selectChanges($event)"
   [(ngModel)]="values"
   [thyChangeOnSelect]="true"
   style="width: 200px;"
 >
-</thy-cascader>
+</thy-cascader> -->

src/cascader/examples/size/size.component.html

@@ -1,9 +1,9 @@
-<thy-button-group thySize="sm" thyType="outline-default">
+<!-- <thy-button-group thySize="sm" thyType="outline-default">
   <button thyButton *ngFor="let item of sizes" (click)="size = item" [ngClass]="{ active: size === item }">
     {{ item }}
   </button>
 </thy-button-group>
 
 <div class="mt-4">
   <thy-cascader [thyOptions]="areaCode" [(ngModel)]="values" [thySize]="size" style="width:200px"> </thy-cascader>
-</div>
+</div> -->