Skip to content

Commit bbfec3a

Browse files
committed
update doc
1 parent 0beb678 commit bbfec3a

66 files changed

Lines changed: 3310 additions & 1169 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

documentation/components/AddExpenseComponent.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1591,7 +1591,7 @@ <h3 id="inputs">
15911591
<script src="../js/libs/deep-iterator.js"></script>
15921592
<script>
15931593
var COMPONENT_TEMPLATE = '<div><section id="add" class="section p-4 md:p-4"> <!-- <h1 class="text-2xl font-bold mb-6 text-[var(--color-accent)]">➕ Add Expense</h1> --> <form [formGroup]="expenseForm" (ngSubmit)="onSubmit()" class="space-y-4 text-[var(--color-text)]"> <!-- Amount and Category --> <div class="flex flex-col md:flex-row md:space-x-4"> <!-- Amount --> <div class="relative w-full md:w-1/2"> <label class="block mb-1 font-medium">Amount</label> <input #amountInput type="number" min="0" max="100000000" formControlName="amount" class="w-full p-2 rounded border" style="background-color: var(--input-bg); color: var(--input-text); border-color: var(--input-border);" step="0.01" /> <div class="error-message text-[var(--color-error)]" *ngIf="expenseForm.get(\'amount\')?.touched && expenseForm.get(\'amount\')?.errors?.[\'min\']"> Amount cannot be negative </div> <div class="error-message text-[var(--color-error)]" *ngIf="expenseForm.get(\'amount\')?.touched && expenseForm.get(\'amount\')?.errors?.[\'max\']"> Amount cannot exceed 100,000,000 </div> <div class="error-message text-[var(--color-error)]" *ngIf="expenseForm.get(\'amount\')?.touched && expenseForm.get(\'amount\')?.errors?.[\'required\']"> Amount is required </div> </div> <!-- Category --> <div class="w-full md:w-1/2 mt-4 md:mt-0"> <label class="block mb-1 font-medium">Category</label> <app-category-dropdown [dropdownMaxHeightClass]="\'max-h-60\'" [selectedCategoryName]="selectedCategoryName" (categorySelected)="onCategorySelected($event)"></app-category-dropdown> <div class="error-message text-[var(--color-error)]" *ngIf="expenseForm.get(\'category_id\')?.touched && expenseForm.get(\'category_id\')?.invalid"> Category is required </div> </div> </div> <!-- Date and Time --> <div class="flex flex-row space-x-2"> <div class="w-full md:w-1/2 flex flex-col"> <label class="block mb-1 font-medium">Date</label> <input type="date" formControlName="date" class="w-full p-2 rounded border bg-[var(--input-bg)] text-[var(--input-text)] border-[var(--input-border)]" /> <div *ngIf="expenseForm.get(\'date\')?.touched && expenseForm.get(\'date\')?.invalid" class="text-[var(--color-error)] text-sm mt-1"> Date is required </div> </div> <div class="w-full md:w-1/2 flex flex-col"> <label class="block mb-1 font-medium">Time</label> <input type="time" formControlName="time" step="1" class="w-full p-2 rounded border bg-[var(--input-bg)] text-[var(--input-text)] border-[var(--input-border)]" /> <div *ngIf="expenseForm.get(\'time\')?.touched && expenseForm.get(\'time\')?.invalid" class="text-[var(--color-error)] text-sm mt-1"> Time is required </div> </div> </div> <!-- Payment Mode and Location --> <div class="flex flex-col md:flex-row md:space-x-4"> <div class="w-full md:w-1/2"> <label class="block mb-1 font-medium">Payment Mode</label> <select formControlName="payment_mode" class="w-full p-2 rounded border" style="background-color: var(--input-bg); color: var(--input-text); border-color: var(--input-border);"> <option value="UPI">UPI</option> <option value="Cash">Cash</option> <option value="Others">Others</option> </select> </div> <div class="relative w-full md:w-1/2 mt-4 md:mt-0"> <label class="block mb-1 font-medium">Location</label> <input type="text" formControlName="location" maxlength="51" class="w-full p-2 rounded border" style="background-color: var(--input-bg); color: var(--input-text); border-color: var(--input-border);" /> <!-- Location Suggestions --> <ul *ngIf="showLocationSuggestions && filteredLocationSuggestions.length" class="absolute max-h-40 z-50 w-full overflow-y-auto bg-[var(--color-bg)] rounded border" style="background-color: var(--input-bg); color: var(--input-text); border-color: var(--input-border);"> <li *ngFor="let loc of filteredLocationSuggestions" (click)="selectLocationSuggestion(loc)" class="p-2 cursor-pointer hover:bg-[--list-hover]"> {{ loc }} </li> </ul> <div class="error-message text-[var(--color-error)]" *ngIf="expenseForm.get(\'location\')?.touched && expenseForm.get(\'location\')?.errors?.[\'maxlength\']"> Location cannot be more than 50 characters </div> </div> </div> <!-- Note --> <div> <label class="block mb-1 font-medium">Note</label> <textarea formControlName="note" maxlength="101" rows="2" class="w-full p-2 rounded border resize-none" style="background-color: var(--input-bg); color: var(--input-text); border-color: var(--input-border);"></textarea> <!-- Note Suggestions --> <ul *ngIf="showNoteSuggestions && filteredNoteSuggestions.length" class="max-h-40 z-50 w-full overflow-y-auto bg-[var(--color-bg)] rounded border" style="background-color: var(--input-bg); color: var(--input-text); border-color: var(--input-border);"> <li *ngFor="let note of filteredNoteSuggestions" (click)="selectNoteSuggestion(note)" class="p-2 cursor-pointer hover:bg-[--list-hover]"> {{ note }} </li> </ul> <div class="error-message text-[var(--color-error)]" *ngIf="expenseForm.get(\'note\')?.touched && expenseForm.get(\'note\')?.errors?.[\'maxlength\']"> Note cannot be more than 100 characters </div> </div> <!-- Extra Spending Toggle --> <div style="margin-top: 8px;"> <div class="w-full md:w-1/2 flex items-center justify-between md:justify-start md:space-x-4"> <label for="isExtraSpending" class="block font-medium">Mark as Extra Spending</label> <label class="relative inline-flex items-center cursor-pointer"> <input type="checkbox" id="isExtraSpending" formControlName="isExtraSpending" class="sr-only peer"> <div class="w-11 h-6 bg-gray-600 rounded-full peer peer-checked:bg-[var(--color-accent)] transition-all"> </div> <span class="absolute left-1 top-1 w-4 h-4 bg-white rounded-full transition-all peer-checked:translate-x-5"></span> </label> </div> </div> <div> <button type="submit" class="bg-[var(--color-accent)] text-[var(--color-white)] px-4 py-2 rounded w-full"> Add Expense </button> </div> </form></section></div>'
1594-
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': 'CustomModalComponent', 'selector': 'app-custom-modal'},{'name': 'DownloadComponentComponent', 'selector': 'app-download-component'},{'name': 'ExpenseDetailsModalComponent', 'selector': 'app-expense-details-modal'},{'name': 'ExpenseListComponent', 'selector': 'app-expense-list'},{'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': 'SearchButtonComponent', 'selector': 'app-search-button'},{'name': 'SearchComponent', 'selector': 'app-search'},{'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'}];
1594+
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': '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': 'SearchButtonComponent', 'selector': 'app-search-button'},{'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'}];
15951595
var DIRECTIVES = [];
15961596
var ACTUAL_COMPONENT = {'name': 'AddExpenseComponent'};
15971597
</script>

0 commit comments

Comments
 (0)