From aad148c6e4f88cf9a586042093cb0f5e507a0fe5 Mon Sep 17 00:00:00 2001 From: meta-d Date: Wed, 31 Jan 2024 19:11:59 +0800 Subject: [PATCH] feat: Remove LetDirective --- .../data-sources/data-sources.module.ts | 2 -- .../indicator-detail.component.html | 12 +++---- .../indicator-detail.component.ts | 7 ++-- .../src/lib/indicator-market.component.html | 8 ++--- .../src/lib/indicator-market.component.ts | 34 +++++++++---------- .../src/lib/indicator-market.module.ts | 2 -- 6 files changed, 32 insertions(+), 33 deletions(-) diff --git a/apps/cloud/src/app/features/setting/data-sources/data-sources.module.ts b/apps/cloud/src/app/features/setting/data-sources/data-sources.module.ts index 1641fea47..db9203fe8 100644 --- a/apps/cloud/src/app/features/setting/data-sources/data-sources.module.ts +++ b/apps/cloud/src/app/features/setting/data-sources/data-sources.module.ts @@ -1,7 +1,6 @@ import { NgModule } from '@angular/core' import { ButtonGroupDirective, DensityDirective } from '@metad/ocap-angular/core' import { ContentLoaderModule } from '@ngneat/content-loader' -import { LetDirective } from '@ngrx/component' import { FormlyModule } from '@ngx-formly/core' import { TranslateModule } from '@ngx-translate/core' import { MaterialModule, SharedModule } from '../../../@shared' @@ -17,7 +16,6 @@ import { PACDataSourcesComponent } from './data-sources.component' TranslateModule, PACDataSourcesRoutingModule, ContentLoaderModule, - LetDirective, ButtonGroupDirective, DensityDirective diff --git a/libs/apps/indicator-market/src/lib/indicator-detail/indicator-detail.component.html b/libs/apps/indicator-market/src/lib/indicator-detail/indicator-detail.component.html index ecefc1369..f9be5a431 100644 --- a/libs/apps/indicator-market/src/lib/indicator-detail/indicator-detail.component.html +++ b/libs/apps/indicator-market/src/lib/indicator-detail/indicator-detail.component.html @@ -21,9 +21,9 @@
{{ 'IndicatorApp.MOM' | translate: {Default: 'MOM'} }}
-
- arrow_drop_up - arrow_drop_down +
+ arrow_drop_up + arrow_drop_down {{(indicator.data?.MOM | percent:'0.2-2' | replaceNullWithText:'-' )!}}
@@ -41,9 +41,9 @@
{{ 'IndicatorApp.YOY' | translate: {Default: 'YOY'} }}
-
- arrow_drop_up - arrow_drop_down +
+ arrow_drop_up + arrow_drop_down {{(indicator.data?.YOY | percent:'0.2-2' | replaceNullWithText:'-' )!}}
diff --git a/libs/apps/indicator-market/src/lib/indicator-detail/indicator-detail.component.ts b/libs/apps/indicator-market/src/lib/indicator-detail/indicator-detail.component.ts index 00a436d98..6ffd228bc 100644 --- a/libs/apps/indicator-market/src/lib/indicator-detail/indicator-detail.component.ts +++ b/libs/apps/indicator-market/src/lib/indicator-detail/indicator-detail.component.ts @@ -74,6 +74,7 @@ import { IndicatoryMarketComponent } from '../indicator-market.component' import { IndicatorsStore } from '../services/store' import { IndicatorState, Trend, TrendColor, TrendReverseColor } from '../types' import { nanoid } from 'nanoid' +import { toSignal } from '@angular/core/rxjs-interop' @UntilDestroy({ checkProperties: true }) @Component({ @@ -405,8 +406,10 @@ export class IndicatorDetailComponent { }) ) - public readonly mom$ = this.indicator$.pipe(map((indicator) => (indicator.data?.MOM > 0 ? Trend.Up : Trend.Down))) - public readonly yoy$ = this.indicator$.pipe(map((indicator) => (indicator.data?.YOY > 0 ? Trend.Up : Trend.Down))) + // public readonly mom$ = this.indicator$.pipe(map((indicator) => (indicator.data?.MOM > 0 ? Trend.Up : Trend.Down))) + // public readonly yoy$ = this.indicator$.pipe(map((indicator) => (indicator.data?.YOY > 0 ? Trend.Up : Trend.Down))) + readonly mom$ = toSignal(this.indicator$.pipe(map((indicator) => (indicator.data?.MOM > 0 ? Trend.Up : Trend.Down)))) + readonly yoy$ = toSignal(this.indicator$.pipe(map((indicator) => (indicator.data?.YOY > 0 ? Trend.Up : Trend.Down)))) // Free dimensions as slicers bar public readonly freeDimensions$ = this.indicator$.pipe( diff --git a/libs/apps/indicator-market/src/lib/indicator-market.component.html b/libs/apps/indicator-market/src/lib/indicator-market.component.html index b58b5f3fa..84e5a375a 100644 --- a/libs/apps/indicator-market/src/lib/indicator-market.component.html +++ b/libs/apps/indicator-market/src/lib/indicator-market.component.html @@ -14,7 +14,7 @@
- {{tagText$ | async}} + {{tagText$()}}
- + - + diff --git a/libs/apps/indicator-market/src/lib/indicator-market.component.ts b/libs/apps/indicator-market/src/lib/indicator-market.component.ts index c9b5940e0..02311eab8 100644 --- a/libs/apps/indicator-market/src/lib/indicator-market.component.ts +++ b/libs/apps/indicator-market/src/lib/indicator-market.component.ts @@ -3,6 +3,7 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, + computed, ElementRef, HostBinding, Inject, @@ -10,7 +11,7 @@ import { ViewChild, ViewContainerRef } from '@angular/core' -import { takeUntilDestroyed } from '@angular/core/rxjs-interop' +import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop' import { FormControl } from '@angular/forms' import { MatBottomSheet, MatBottomSheetRef } from '@angular/material/bottom-sheet' import { MatDatepicker } from '@angular/material/datepicker' @@ -21,7 +22,7 @@ import { ComponentStore } from '@metad/store' import { TranslateService } from '@ngx-translate/core' import { includes, some } from 'lodash-es' import { NgxPopperjsPlacements, NgxPopperjsTriggers } from 'ngx-popperjs' -import { combineLatest, firstValueFrom, Observable } from 'rxjs' +import { combineLatest, Observable } from 'rxjs' import { distinctUntilChanged, map, shareReplay, switchMap, tap } from 'rxjs/operators' import { IndicatorDetailComponent } from './indicator-detail/indicator-detail.component' import { MyDataSource } from './services/data-source' @@ -47,22 +48,21 @@ export class IndicatoryMarketComponent extends ComponentStore<{ id?: string }> { @ViewChild('searchInput') searchInputRef: ElementRef - public readonly selected$ = this.indicatorsStore.currentIndicatorId$ - public readonly tag$ = this.indicatorsStore.tag$ - public readonly tagText$ = this.tag$.pipe( - switchMap(async (tag) => { - const tagEnum = await firstValueFrom( - this.translateService.get('IndicatorApp.TagEnum', { - Default: { - [TagEnum.UNIT]: 'Unit', - [TagEnum.MOM]: 'MOM', - [TagEnum.YOY]: 'YOY' - } - }) - ) - return tagEnum[tag] + // public readonly selected$ = this.indicatorsStore.currentIndicatorId$ + // public readonly tag$ = this.indicatorsStore.tag$ + readonly selected$ = toSignal(this.indicatorsStore.currentIndicatorId$) + readonly tag$ = toSignal(this.indicatorsStore.tag$) + readonly tagText$ = computed(() => { + const tag = this.tag$() + const tagEnum = this.translateService.instant('IndicatorApp.TagEnum', { + Default: { + [TagEnum.UNIT]: 'Unit', + [TagEnum.MOM]: 'MOM', + [TagEnum.YOY]: 'YOY' + } }) - ) + return tagEnum[tag] + }) indicatorDataSource: MyDataSource // = new MyDataSource(this.indicatorsStore) readonly mediaMatcher$ = combineLatest( diff --git a/libs/apps/indicator-market/src/lib/indicator-market.module.ts b/libs/apps/indicator-market/src/lib/indicator-market.module.ts index 1b8a7da05..c90bc7afe 100644 --- a/libs/apps/indicator-market/src/lib/indicator-market.module.ts +++ b/libs/apps/indicator-market/src/lib/indicator-market.module.ts @@ -21,7 +21,6 @@ import { ReversePipe } from '@metad/core' import { AnalyticalCardModule } from '@metad/ocap-angular/analytical-card' import { ControlsModule } from '@metad/ocap-angular/controls' import { AppearanceDirective, OcapCoreModule } from '@metad/ocap-angular/core' -import { LetDirective } from '@ngrx/component' import { TranslateModule } from '@ngx-translate/core' import { NgxEchartsModule } from 'ngx-echarts' import { MarkdownModule } from 'ngx-markdown' @@ -40,7 +39,6 @@ import { SharedModule } from './shared/shared.module' FormsModule, ReactiveFormsModule, IndicatorMarketRoutingModule, - LetDirective, ScrollingModule, DragDropModule, MatListModule,