add change year and month button

This commit is contained in:
Peter Maquiran
2021-09-21 10:04:42 +01:00
parent afb7c42e9f
commit c13080d2ad
9 changed files with 172 additions and 26 deletions
+54 -2
View File
@@ -35,8 +35,60 @@
</div>
<!-- Move forward one screen of the slides -->
<h2 class="capitaliseText">{{ viewTitle }}</h2>
<!-- <div class="drop-down">
<h2 class="capitaliseText d-flex align-center">
{{ viewTitle }}
<div (click)="dropdownScrollWeal = true; onDropDownScrollWeal()">
<ion-icon style="font-size: 19pt;" src="assets/images/icons-arrow-arrow-down.svg" ></ion-icon>
</div>
</h2>
<div class="dropdown-scroll-weel" *ngIf="dropdownScrollWeal">
<div class="flex-grow-1 height-100 overflow-y-auto">
<ul>
<li (click)="changeMonth(0)" [class.active]="monthNum==0" ><span>Jan</span></li>
<li (click)="changeMonth(1)" [class.active]="monthNum==1"><span>Fev</span></li>
<li (click)="changeMonth(2)" [class.active]="monthNum==2"><span>Mar</span></li>
<li (click)="changeMonth(3)" [class.active]="monthNum==3"><span>Abr</span></li>
<li (click)="changeMonth(4)" [class.active]="monthNum==4"><span>Maio</span></li>
<li (click)="changeMonth(5)" [class.active]="monthNum==5"><span>Jun</span></li>
<li (click)="changeMonth(6)" [class.active]="monthNum==6"><span>Jul</span></li>
<li (click)="changeMonth(7)" [class.active]="monthNum==7"><span>Ago</span></li>
<li (click)="changeMonth(8)" [class.active]="monthNum==8"><span>Set</span></li>
<li (click)="changeMonth(9)" [class.active]="monthNum==9"><span>Out</span></li>
<li (click)="changeMonth(10)" [class.active]="monthNum==10"><span>Nov</span></li>
<li (click)="changeMonth(11)" [class.active]="monthNum==11"><span>Dez</span></li>
</ul>
</div>
<div class="flex-grow-1 height-100 overflow-y-auto">
<ul>
<li (click)="changeYear(2010)" [class.active]="yearNum==2010"><span>2010</span></li>
<li (click)="changeYear(2011)" [class.active]="yearNum==2011"><span>2011</span></li>
<li (click)="changeYear(2012)" [class.active]="yearNum==2012"><span>2012</span></li>
<li (click)="changeYear(2013)" [class.active]="yearNum==2013"><span>2013</span></li>
<li (click)="changeYear(2014)" [class.active]="yearNum==2014"><span>2014</span></li>
<li (click)="changeYear(2015)" [class.active]="yearNum==2015"><span>2015</span></li>
<li (click)="changeYear(2016)" [class.active]="yearNum==2016"><span>2016</span></li>
<li (click)="changeYear(2017)" [class.active]="yearNum==2017"><span>2017</span></li>
<li (click)="changeYear(2018)" [class.active]="yearNum==2018"><span>2018</span></li>
<li (click)="changeYear(2019)" [class.active]="yearNum==2019"><span>2019</span></li>
<li (click)="changeYear(2020)" [class.active]="yearNum==2020"><span>2020</span></li>
<li (click)="changeYear(2021)" [class.active]="yearNum==2021"><span>2021</span></li>
<li (click)="changeYear(2022)" [class.active]="yearNum==2022"><span>2022</span></li>
<li (click)="changeYear(2023)" [class.active]="yearNum==2023"><span>2023</span></li>
<li (click)="changeYear(2024)" [class.active]="yearNum==2024"><span>2024</span></li>
<li (click)="changeYear(2025)" [class.active]="yearNum==2025"><span>2025</span></li>
<li (click)="changeYear(2026)" [class.active]="yearNum==2026"><span>2026</span></li>
</ul>
</div>
</div>
<div *ngIf="dropdownScrollWeal" class="dropdown-scroll-weel-background" (click)="dropdownScrollWeal = false">
</div>
<!-- <div class="drop-down">
<ion-icon slot="icon-only" class="arrow-down" src="assets/images/icons-arrow-arrow-down.svg"></ion-icon>
<div class="drop-down-container">
<ul>