Skip to content

Commit e6a1954

Browse files
committed
update ui
1 parent 582654d commit e6a1954

27 files changed

Lines changed: 1526 additions & 146 deletions

dev.md

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,4 +31,13 @@ compodoc -s
3131
# Build for production
3232
ng build --configuration production
3333
# or
34-
ng build --prod
34+
ng build --prod
35+
36+
37+
## Create a Component
38+
39+
ng g c component-name
40+
41+
## Create a Service
42+
43+
ng g s service-name

documentation/components/ExpenseWiseComponent.html

Lines changed: 34 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -287,12 +287,12 @@ <h3 id="constructor">Constructor</h3>
287287
<tbody>
288288
<tr>
289289
<td class="col-md-4">
290-
<code>constructor(sectionService: <a href="../injectables/SectionService.html" target="_self">SectionService</a>, platformId: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank">Object</a>)</code>
290+
<code>constructor(sectionService: <a href="../injectables/SectionService.html" target="_self">SectionService</a>, screenTypeService: <a href="../injectables/ScreenTypeService.html" target="_self">ScreenTypeService</a>, platformId: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank">Object</a>)</code>
291291
</td>
292292
</tr>
293293
<tr>
294294
<td class="col-md-4">
295-
<div class="io-line">Defined in <a href="" data-line="44" class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:44</a></div>
295+
<div class="io-line">Defined in <a href="" data-line="45" class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:45</a></div>
296296
</td>
297297
</tr>
298298

@@ -329,6 +329,22 @@ <h3 id="constructor">Constructor</h3>
329329

330330
</td>
331331
</tr>
332+
<tr>
333+
<td>screenTypeService</td>
334+
335+
<td>
336+
<code><a href="../injectables/ScreenTypeService.html" target="_self" >ScreenTypeService</a></code>
337+
</td>
338+
339+
<td>
340+
No
341+
</td>
342+
343+
<td>
344+
<p>Service to track the screentype is mobile, tablet, and laptop</p>
345+
346+
</td>
347+
</tr>
332348
<tr>
333349
<td>platformId</td>
334350

@@ -383,8 +399,8 @@ <h3>HostListeners</h3> <table class="table table-sm table-bordered">
383399

384400
<tr>
385401
<td class="col-md-4">
386-
<div class="io-line">Defined in <a href="" data-line="75"
387-
class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:75</a></div>
402+
<div class="io-line">Defined in <a href="" data-line="78"
403+
class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:78</a></div>
388404
</td>
389405
</tr>
390406

@@ -452,8 +468,8 @@ <h3 id="methods">
452468

453469
<tr>
454470
<td class="col-md-4">
455-
<div class="io-line">Defined in <a href="" data-line="65"
456-
class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:65</a></div>
471+
<div class="io-line">Defined in <a href="" data-line="68"
472+
class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:68</a></div>
457473
</td>
458474
</tr>
459475

@@ -500,8 +516,8 @@ <h3 id="methods">
500516

501517
<tr>
502518
<td class="col-md-4">
503-
<div class="io-line">Defined in <a href="" data-line="75"
504-
class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:75</a></div>
519+
<div class="io-line">Defined in <a href="" data-line="78"
520+
class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:78</a></div>
505521
</td>
506522
</tr>
507523

@@ -584,7 +600,7 @@ <h3 id="inputs">
584600
</tr>
585601
<tr>
586602
<td class="col-md-4">
587-
<div class="io-line">Defined in <a href="" data-line="39" class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:39</a></div>
603+
<div class="io-line">Defined in <a href="" data-line="40" class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:40</a></div>
588604
</td>
589605
</tr>
590606

@@ -621,7 +637,7 @@ <h3 id="inputs">
621637
</tr>
622638
<tr>
623639
<td class="col-md-4">
624-
<div class="io-line">Defined in <a href="" data-line="44" class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:44</a></div>
640+
<div class="io-line">Defined in <a href="" data-line="45" class="link-to-prism">src/app/features/expense-wise/expense-wise.component.ts:45</a></div>
625641
</td>
626642
</tr>
627643

@@ -657,6 +673,7 @@ <h3 id="inputs">
657673
import { AiComponent } from &#x27;../../features/ai/ai.component&#x27;;
658674

659675
import { SectionService } from &#x27;../../service/section/section.service&#x27;;
676+
import { ScreenTypeService } from &#x27;../../service/screen-type/screen-type.service&#x27;;
660677

661678
/**
662679
* Root component of the application.
@@ -689,10 +706,12 @@ <h3 id="inputs">
689706
* Initializes route tracking, section updates, PWA update listener, and services.
690707
*
691708
* @param sectionService Service to track current section changes
709+
* @param screenTypeService Service to track the screentype is mobile, tablet, and laptop
692710
* @param platformId Angular platform ID to check if running in browser
693711
*/
694712
constructor(
695713
private sectionService: SectionService,
714+
private screenTypeService: ScreenTypeService,
696715
@Inject(PLATFORM_ID) private platformId: Object
697716

698717
) {
@@ -706,7 +725,7 @@ <h3 id="inputs">
706725
*/
707726
ngOnInit() {
708727
if (isPlatformBrowser(this.platformId)) {
709-
this.isMobile &#x3D; window.innerWidth &lt;&#x3D; 768;
728+
this.isMobile &#x3D; this.screenTypeService.isMobile();
710729
}
711730
}
712731
/**
@@ -716,16 +735,16 @@ <h3 id="inputs">
716735
@HostListener(&#x27;window:resize&#x27;, [&#x27;$event&#x27;])
717736
onResize(event: any) {
718737
if (isPlatformBrowser(this.platformId)) {
719-
this.isMobile &#x3D; event.target.innerWidth &lt;&#x3D; 768;
738+
this.isMobile &#x3D; this.screenTypeService.isMobile();
720739
}
721740
}
722741
}</code></pre>
723742
</div>
724743

725744
<div class="tab-pane fade " id="templateData">
726745
<pre class="line-numbers"><code class="language-html">&lt;div class&#x3D;&quot;expense&quot;&gt;
727-
&lt;app-navbar&gt;&lt;/app-navbar&gt;
728-
&lt;div class&#x3D;&quot;flex pt-14 pb-9 h-screen overflow-hidden&quot;&gt;
746+
&lt;app-navbar class&#x3D;&quot;hidden md:block&quot;&gt;&lt;/app-navbar&gt;
747+
&lt;div class&#x3D;&quot;flex md:pt-14 pb-9 h-screen overflow-hidden&quot;&gt;
729748
&lt;app-sidebar&gt;&lt;/app-sidebar&gt;
730749
&lt;main class&#x3D;&quot;flex-1 overflow-y-auto w-full h-full&quot;&gt;
731750
&lt;ng-container [ngSwitch]&#x3D;&quot;currentSection&quot;&gt;
@@ -773,7 +792,7 @@ <h3 id="inputs">
773792
<script src="../js/libs/htmlparser.js"></script>
774793
<script src="../js/libs/deep-iterator.js"></script>
775794
<script>
776-
var COMPONENT_TEMPLATE = '<div><div class="expense"> <app-navbar></app-navbar> <div class="flex pt-14 pb-9 h-screen overflow-hidden"> <app-sidebar></app-sidebar> <main class="flex-1 overflow-y-auto w-full h-full"> <ng-container [ngSwitch]="currentSection"> <app-home *ngSwitchCase="\'home\'"></app-home> <div *ngSwitchCase="\'add\'" [class.mobile-slide-up]="isMobile"> <app-add-expense></app-add-expense> </div> <app-list-expenses *ngSwitchCase="\'list\'"></app-list-expenses> <app-calendar *ngSwitchCase="\'calendar\'"></app-calendar> <app-settings *ngSwitchCase="\'settings\'"></app-settings> <app-budget *ngSwitchCase="\'budget\'"></app-budget> <app-ai *ngSwitchCase="\'ai\'"></app-ai> <app-home *ngSwitchDefault></app-home> </ng-container> </main> </div> <app-footer></app-footer> <app-toast></app-toast></div></div>'
795+
var COMPONENT_TEMPLATE = '<div><div class="expense"> <app-navbar class="hidden md:block"></app-navbar> <div class="flex md:pt-14 pb-9 h-screen overflow-hidden"> <app-sidebar></app-sidebar> <main class="flex-1 overflow-y-auto w-full h-full"> <ng-container [ngSwitch]="currentSection"> <app-home *ngSwitchCase="\'home\'"></app-home> <div *ngSwitchCase="\'add\'" [class.mobile-slide-up]="isMobile"> <app-add-expense></app-add-expense> </div> <app-list-expenses *ngSwitchCase="\'list\'"></app-list-expenses> <app-calendar *ngSwitchCase="\'calendar\'"></app-calendar> <app-settings *ngSwitchCase="\'settings\'"></app-settings> <app-budget *ngSwitchCase="\'budget\'"></app-budget> <app-ai *ngSwitchCase="\'ai\'"></app-ai> <app-home *ngSwitchDefault></app-home> </ng-container> </main> </div> <app-footer></app-footer> <app-toast></app-toast></div></div>'
777796
var COMPONENTS = [{'name': 'AddExpenseComponent', 'selector': 'app-add-expense'},{'name': 'AiComponent', 'selector': 'app-ai'},{'name': 'AppComponent', 'selector': 'app-root'},{'name': 'BudgetComponent', 'selector': 'app-budget'},{'name': 'CalendarComponent', 'selector': 'app-calendar'},{'name': 'CategoryDropdownComponent', 'selector': 'app-category-dropdown'},{'name': 'DownloadComponentComponent', 'selector': 'app-download-component'},{'name': 'ExpenseDetailsModalComponent', 'selector': 'app-expense-details-modal'},{'name': 'ExpenseListComponent', 'selector': 'app-expense-list'},{'name': 'ExpenseWiseComponent', 'selector': 'app-expense-wise'},{'name': 'FooterComponent', 'selector': 'app-footer'},{'name': 'FormModelComponent', 'selector': 'app-form-model'},{'name': 'GlobalLoaderComponent', 'selector': 'app-global-loader'},{'name': 'GraphsComponent', 'selector': 'app-graphs'},{'name': 'HamburgerMenuComponent', 'selector': 'app-hamburger-menu'},{'name': 'HomeComponent', 'selector': 'app-home'},{'name': 'InstallAppPopupComponentComponent', 'selector': 'app-install-app-popup-component'},{'name': 'ListExpensesComponent', 'selector': 'app-list-expenses'},{'name': 'MusicComponent', 'selector': 'app-music'},{'name': 'NavbarComponent', 'selector': 'app-navbar'},{'name': 'PieChartComponent', 'selector': 'app-pie-chart'},{'name': 'PlaylistMusicComponent', 'selector': 'app-playlist-music'},{'name': 'SearchButtonComponent', 'selector': 'app-search-button'},{'name': 'SearchMusicComponent', 'selector': 'app-search-music'},{'name': 'SettingItemComponent', 'selector': 'app-setting-item'},{'name': 'SettingsComponent', 'selector': 'app-settings'},{'name': 'SidebarComponent', 'selector': 'app-sidebar'},{'name': 'TemplatePlaygroundComponent', 'selector': 'template-playground-root'},{'name': 'ToastComponent', 'selector': 'app-toast'}];
778797
var DIRECTIVES = [];
779798
var ACTUAL_COMPONENT = {'name': 'ExpenseWiseComponent'};

0 commit comments

Comments
 (0)