Skip to content

Commit d8bdc15

Browse files
mbechevmbechev
committed
chore: fix issues
1 parent fe4061b commit d8bdc15

File tree

4 files changed

+89
-85
lines changed

4 files changed

+89
-85
lines changed

‎examples-standalone/finance-portfolio/src/app/components/heatmap/heatmap.component.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ import { StockDataService } from '../../services/stock-data.service';
44
import { Stock } from '../../models';
55
import { NavigationComponent } from '../navigation/navigation.component';
66

7+
import '@progress/kendo-ui';
8+
79
declare var kendo: any;
810

911
@Component({

‎examples-standalone/finance-portfolio/src/app/components/stock-chart/stock-chart.component.html‎

Lines changed: 81 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,91 +1,88 @@
11
<div class="container">
2-
<div class="row py-4 d-flex justify-content-between align-items-center">
3-
<div class="col col-4 d-flex daterange-input-wrap">
4-
<kendo-daterange>
5-
<kendo-dateinput
6-
kendoDateRangeStartInput
7-
[autoCorrectOn]="'change'"
8-
[min]="calendarMin"
9-
[max]="calendarMax"
10-
[(ngModel)]="range.start"
11-
(valueChange)="handleRangeChange($event, range.end)"
12-
>
13-
</kendo-dateinput>
14-
<kendo-dateinput
15-
kendoDateRangeEndInput
16-
[autoCorrectOn]="'change'"
17-
[min]="calendarMin"
18-
[max]="calendarMax"
19-
[(ngModel)]="range.end"
20-
(valueChange)="handleRangeChange(range.start, $event)"
21-
>
22-
</kendo-dateinput>
23-
</kendo-daterange>
24-
</div>
2+
<div class="row py-4 d-flex justify-content-between align-items-center">
3+
<div class="col col-4 d-flex daterange-input-wrap">
4+
<kendo-daterange>
5+
<kendo-dateinput
6+
kendoDateRangeStartInput
7+
[autoCorrectOn]="'change'"
8+
[(ngModel)]="range.start"
9+
(valueChange)="handleRangeChange($event, range.end)"
10+
>
11+
</kendo-dateinput>
12+
<kendo-dateinput
13+
kendoDateRangeEndInput
14+
[autoCorrectOn]="'change'"
15+
[(ngModel)]="range.end"
16+
(valueChange)="handleRangeChange(range.start, $event)"
17+
>
18+
</kendo-dateinput>
19+
<kendo-daterange-popup [min]="calendarMin" [max]="calendarMax"> </kendo-daterange-popup>
20+
</kendo-daterange>
21+
</div>
2522

26-
<ul class="k-reset d-flex col-12 col-sm-8 col-md-6 col-lg-3 justify-content-center justify-content-sm-start">
27-
@for (filter of timeFilters; track filter) {
28-
<li class="ms-3">
29-
<span
30-
[ngClass]="{ active: activeTimeFilter === filter.duration }"
31-
class="list-item time-filter-item"
32-
(click)="onTimeFilterClick(filter.duration)"
33-
>
34-
{{ filter.name }}
35-
</span>
36-
</li>
37-
}
38-
</ul>
23+
<ul class="k-reset d-flex col-12 col-sm-8 col-md-6 col-lg-3 justify-content-center justify-content-sm-start">
24+
@for (filter of timeFilters; track filter) {
25+
<li class="ms-3">
26+
<span
27+
[ngClass]="{ active: activeTimeFilter === filter.duration }"
28+
class="list-item time-filter-item"
29+
(click)="onTimeFilterClick(filter.duration)"
30+
>
31+
{{ filter.name }}
32+
</span>
33+
</li>
34+
}
35+
</ul>
3936

40-
<div class="col-12 col-sm-4 col-md-6 col-lg-4 text-center text-sm-right mt-3 mt-sm-0">
41-
<kendo-dropdownlist
42-
class="dropdown-list-selection interval"
43-
[style.width.px]="150"
44-
[style.marginRight.px]="8"
45-
[data]="intervals"
46-
[textField]="'name'"
47-
[valueField]="'interval'"
48-
[(value)]="selectedInterval"
49-
[itemDisabled]="disableIncompatibleIntervals"
50-
>
51-
<ng-template kendoDropDownListValueTemplate let-dataItem>
52-
<span class="service-category"> Interval: {{ dataItem?.name }}</span>
53-
</ng-template>
54-
</kendo-dropdownlist>
37+
<div class="col-12 col-sm-4 col-md-6 col-lg-4 text-center text-sm-right mt-3 mt-sm-0">
38+
<kendo-dropdownlist
39+
class="dropdown-list-selection interval"
40+
[style.width.px]="160"
41+
[style.marginRight.px]="8"
42+
[data]="intervals"
43+
[textField]="'name'"
44+
[valueField]="'interval'"
45+
[(value)]="selectedInterval"
46+
[itemDisabled]="disableIncompatibleIntervals"
47+
>
48+
<ng-template kendoDropDownListValueTemplate let-dataItem>
49+
<span class="service-category"> Interval: {{ dataItem?.name }}</span>
50+
</ng-template>
51+
</kendo-dropdownlist>
5552

56-
<kendo-dropdownlist
57-
[style.width.px]="170"
58-
class="dropdown-list-selection"
59-
[data]="charts"
60-
[valueField]="'value'"
61-
[textField]="'text'"
62-
[valuePrimitive]="true"
63-
[(value)]="chartType"
64-
>
65-
<ng-template kendoDropDownListValueTemplate let-dataItem>
66-
<span class="chart-category selected align-items-center">
67-
<img src="assets/{{ dataItem.value }}.png" />
68-
{{ dataItem.text }}
69-
</span>
70-
</ng-template>
71-
<ng-template kendoDropDownListItemTemplate let-dataItem>
72-
<span class="chart-category d-flex align-items-center">
73-
<img src="assets/{{ dataItem.value }}.png" />
74-
{{ dataItem.text }}
75-
</span>
76-
</ng-template>
77-
</kendo-dropdownlist>
53+
<kendo-dropdownlist
54+
[style.width.px]="170"
55+
class="dropdown-list-selection"
56+
[data]="charts"
57+
[valueField]="'value'"
58+
[textField]="'text'"
59+
[valuePrimitive]="true"
60+
[(value)]="chartType"
61+
>
62+
<ng-template kendoDropDownListValueTemplate let-dataItem>
63+
<span class="chart-category selected align-items-center">
64+
<img src="assets/{{ dataItem.value }}.png" />
65+
{{ dataItem.text }}
66+
</span>
67+
</ng-template>
68+
<ng-template kendoDropDownListItemTemplate let-dataItem>
69+
<span class="chart-category d-flex align-items-center">
70+
<img src="assets/{{ dataItem.value }}.png" />
71+
{{ dataItem.text }}
72+
</span>
73+
</ng-template>
74+
</kendo-dropdownlist>
75+
</div>
7876
</div>
79-
</div>
80-
<div class="row">
81-
<div class="col">
82-
<app-stock-details
83-
[chartType]="chartType"
84-
[interval]="selectedInterval.interval"
85-
[range]="normalizedRange"
86-
[symbol]="stockDataService.selectedStock.symbol!"
87-
>
88-
</app-stock-details>
77+
<div class="row">
78+
<div class="col">
79+
<app-stock-details
80+
[chartType]="chartType"
81+
[interval]="selectedInterval.interval"
82+
[range]="normalizedRange"
83+
[symbol]="stockDataService.selectedStock.symbol!"
84+
>
85+
</app-stock-details>
86+
</div>
8987
</div>
90-
</div>
9188
</div>

‎examples-standalone/finance-portfolio/src/app/components/stock-details/stock-details.component.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,11 @@ export class StockDetailsComponent implements OnChanges {
6060

6161
public itemColor = (args: any) => {
6262
const current: StockIntervalDetails = args.dataItem;
63+
64+
if (!current) {
65+
return '#5CB85C';
66+
}
67+
6368
const currentLargerThenPrev = !this.previousColumnChartItem || current.volume >= this.previousColumnChartItem.volume;
6469

6570
if (current.volume) {

‎examples-standalone/finance-portfolio/src/styles/_kendo.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
@use '@progress/kendo-theme-default/scss/all.scss' as *;
1+
@use '@progress/kendo-theme-bootstrap/scss/all.scss' as *;

0 commit comments

Comments
 (0)