Billing Module - TypeScript Functions
🧾 InvoicesComponent Functions
Invoice management and display interface with filtering, search, and payment tracking capabilities.
Component Properties
export class InvoicesComponent implements OnInit, OnDestroy {
// Data Properties
invoices: Invoice[] = [];
filteredInvoices: Invoice[] = [];
selectedInvoice: Invoice | null = null;
loading: boolean = false;
error: string | null = null;
// Filter Properties
statusFilter: InvoiceStatus = InvoiceStatus.ALL;
dateRangeFilter: DateRange | null = null;
amountRangeFilter: AmountRange | null = null;
searchTerm: string = '';
// Pagination Properties
currentPage: number = 1;
itemsPerPage: number = 10;
totalItems: number = 0;
// UI State Properties
showInvoiceDetails: boolean = false;
showPaymentModal: boolean = false;
showDownloadModal: boolean = false;
// Summary Properties
totalAmount: number = 0;
paidAmount: number = 0;
outstandingAmount: number = 0;
}🔄 Lifecycle Methods
/**
* Component initialization
*/
ngOnInit(): void
/**
* Component cleanup
*/
ngOnDestroy(): void📥 Data Loading Methods
/**
* Load all invoices
*/
loadInvoices(): void
/**
* Load invoices with pagination
* @param page - Page number
* @param pageSize - Items per page
*/
loadInvoicesWithPagination(page: number, pageSize: number): void
/**
* Load invoice by ID
* @param invoiceId - Invoice ID
*/
loadInvoiceById(invoiceId: string): void
/**
* Refresh invoice list
*/
refreshInvoices(): void
/**
* Load invoice summary statistics
*/
loadInvoiceSummary(): void
/**
* Load payment history for invoice
* @param invoiceId - Invoice ID
*/
loadPaymentHistory(invoiceId: string): void🧾 Invoice Management Methods
/**
* View invoice details
* @param invoice - Invoice to view
*/
viewInvoiceDetails(invoice: Invoice): void
/**
* Download invoice as PDF
* @param invoiceId - Invoice ID
*/
downloadInvoice(invoiceId: string): void
/**
* Send invoice via email
* @param invoiceId - Invoice ID
* @param email - Recipient email
*/
sendInvoiceByEmail(invoiceId: string, email: string): void
/**
* Mark invoice as paid
* @param invoiceId - Invoice ID
* @param paymentData - Payment information
*/
markAsPaid(invoiceId: string, paymentData: PaymentData): void
/**
* Dispute invoice
* @param invoiceId - Invoice ID
* @param reason - Dispute reason
*/
disputeInvoice(invoiceId: string, reason: string): void
/**
* Request invoice adjustment
* @param invoiceId - Invoice ID
* @param adjustmentData - Adjustment details
*/
requestAdjustment(invoiceId: string, adjustmentData: AdjustmentRequest): void💳 Payment Methods
/**
* Process payment for invoice
* @param invoiceId - Invoice ID
* @param paymentMethod - Payment method
*/
processPayment(invoiceId: string, paymentMethod: PaymentMethod): void
/**
* Setup recurring payment
* @param invoiceId - Invoice ID
* @param recurringData - Recurring payment configuration
*/
setupRecurringPayment(invoiceId: string, recurringData: RecurringPayment): void
/**
* Retry failed payment
* @param invoiceId - Invoice ID
*/
retryPayment(invoiceId: string): void
/**
* Cancel recurring payment
* @param recurringPaymentId - Recurring payment ID
*/
cancelRecurringPayment(recurringPaymentId: string): void🔍 Search and Filter Methods
/**
* Search invoices by term
* @param searchTerm - Search term
*/
searchInvoices(searchTerm: string): void
/**
* Filter invoices by status
* @param status - Invoice status
*/
filterByStatus(status: InvoiceStatus): void
/**
* Filter invoices by date range
* @param dateRange - Date range filter
*/
filterByDateRange(dateRange: DateRange): void
/**
* Filter invoices by amount range
* @param amountRange - Amount range filter
*/
filterByAmountRange(amountRange: AmountRange): void
/**
* Apply all filters
*/
applyFilters(): void
/**
* Clear all filters
*/
clearFilters(): void💰 PaymentHistoryComponent Functions
Payment history tracking and transaction management with detailed payment analytics.
Component Properties
export class PaymentHistoryComponent implements OnInit {
// Data Properties
payments: Payment[] = [];
filteredPayments: Payment[] = [];
selectedPayment: Payment | null = null;
loading: boolean = false;
error: string | null = null;
// Filter Properties
statusFilter: PaymentStatus = PaymentStatus.ALL;
methodFilter: PaymentMethod = PaymentMethod.ALL;
dateRangeFilter: DateRange | null = null;
// Summary Properties
totalPaid: number = 0;
totalRefunded: number = 0;
totalFees: number = 0;
averageTransactionAmount: number = 0;
}🔄 Lifecycle Methods
/**
* Component initialization
*/
ngOnInit(): void📥 Data Loading Methods
/**
* Load payment history
*/
loadPaymentHistory(): void
/**
* Load payment by ID
* @param paymentId - Payment ID
*/
loadPaymentById(paymentId: string): void
/**
* Load payment analytics
* @param period - Time period for analytics
*/
loadPaymentAnalytics(period: TimePeriod): void
/**
* Export payment history
* @param format - Export format
* @param dateRange - Date range for export
*/
exportPaymentHistory(format: ExportFormat, dateRange: DateRange): void💰 Payment Management Methods
/**
* View payment details
* @param payment - Payment to view
*/
viewPaymentDetails(payment: Payment): void
/**
* Request refund
* @param paymentId - Payment ID
* @param refundAmount - Amount to refund
* @param reason - Refund reason
*/
requestRefund(paymentId: string, refundAmount: number, reason: string): void
/**
* Download payment receipt
* @param paymentId - Payment ID
*/
downloadReceipt(paymentId: string): void
/**
* Dispute payment
* @param paymentId - Payment ID
* @param disputeReason - Dispute reason
*/
disputePayment(paymentId: string, disputeReason: string): void⚙️ BillingSettingsComponent Functions
Billing configuration and payment method management with subscription settings.
Component Properties
export class BillingSettingsComponent implements OnInit {
// Form Properties
billingForm: FormGroup;
paymentMethodForm: FormGroup;
// Data Properties
billingInfo: BillingInfo | null = null;
paymentMethods: PaymentMethod[] = [];
subscriptions: Subscription[] = [];
// UI State Properties
showAddPaymentMethod: boolean = false;
showEditBillingInfo: boolean = false;
isSubmitting: boolean = false;
// Configuration Properties
availableCurrencies: Currency[] = [];
billingCycles: BillingCycle[] = [];
}🔄 Lifecycle Methods
/**
* Component initialization
*/
ngOnInit(): void📝 Form Management Methods
/**
* Initialize billing form
*/
initializeBillingForm(): void
/**
* Initialize payment method form
*/
initializePaymentMethodForm(): void
/**
* Save billing information
*/
saveBillingInfo(): void
/**
* Update billing address
* @param addressData - New billing address
*/
updateBillingAddress(addressData: BillingAddress): void💳 Payment Method Management
/**
* Add new payment method
* @param paymentMethodData - Payment method details
*/
addPaymentMethod(paymentMethodData: AddPaymentMethodRequest): void
/**
* Remove payment method
* @param paymentMethodId - Payment method ID
*/
removePaymentMethod(paymentMethodId: string): void
/**
* Set default payment method
* @param paymentMethodId - Payment method ID
*/
setDefaultPaymentMethod(paymentMethodId: string): void
/**
* Update payment method
* @param paymentMethodId - Payment method ID
* @param updateData - Updated payment method data
*/
updatePaymentMethod(paymentMethodId: string, updateData: UpdatePaymentMethodRequest): void📊 Subscription Management
/**
* Load active subscriptions
*/
loadSubscriptions(): void
/**
* Update subscription
* @param subscriptionId - Subscription ID
* @param planId - New plan ID
*/
updateSubscription(subscriptionId: string, planId: string): void
/**
* Cancel subscription
* @param subscriptionId - Subscription ID
* @param reason - Cancellation reason
*/
cancelSubscription(subscriptionId: string, reason: string): void
/**
* Reactivate subscription
* @param subscriptionId - Subscription ID
*/
reactivateSubscription(subscriptionId: string): void⚙️ BillingService Functions
Core billing service providing invoice management, payment processing, and subscription handling.
Service Properties
export class BillingService {
// Private properties
private readonly apiUrl = 'api/billing';
private invoicesSubject = new BehaviorSubject<Invoice[]>([]);
private paymentsSubject = new BehaviorSubject<Payment[]>([]);
// Public observables
public invoices$ = this.invoicesSubject.asObservable();
public payments$ = this.paymentsSubject.asObservable();
}🧾 Invoice Operations
/**
* Get all invoices
* @param filters - Invoice filters
*/
getInvoices(filters?: InvoiceFilters): Observable<Invoice[]>
/**
* Get invoice by ID
* @param invoiceId - Invoice ID
*/
getInvoiceById(invoiceId: string): Observable<Invoice>
/**
* Generate new invoice
* @param invoiceData - Invoice data
*/
generateInvoice(invoiceData: CreateInvoiceRequest): Observable<Invoice>
/**
* Update invoice
* @param invoiceId - Invoice ID
* @param updateData - Invoice update data
*/
updateInvoice(invoiceId: string, updateData: UpdateInvoiceRequest): Observable<Invoice>
/**
* Download invoice PDF
* @param invoiceId - Invoice ID
*/
downloadInvoicePDF(invoiceId: string): Observable<Blob>
/**
* Send invoice by email
* @param invoiceId - Invoice ID
* @param email - Recipient email
*/
sendInvoiceEmail(invoiceId: string, email: string): Observable<void>💰 Payment Operations
/**
* Process payment
* @param paymentData - Payment details
*/
processPayment(paymentData: PaymentRequest): Observable<Payment>
/**
* Get payment history
* @param filters - Payment filters
*/
getPaymentHistory(filters?: PaymentFilters): Observable<Payment[]>
/**
* Request refund
* @param paymentId - Payment ID
* @param refundData - Refund details
*/
requestRefund(paymentId: string, refundData: RefundRequest): Observable<Refund>
/**
* Get payment by ID
* @param paymentId - Payment ID
*/
getPaymentById(paymentId: string): Observable<Payment>
/**
* Retry failed payment
* @param paymentId - Payment ID
*/
retryFailedPayment(paymentId: string): Observable<Payment>📊 Subscription Management
/**
* Get active subscriptions
*/
getActiveSubscriptions(): Observable<Subscription[]>
/**
* Create new subscription
* @param subscriptionData - Subscription details
*/
createSubscription(subscriptionData: CreateSubscriptionRequest): Observable<Subscription>
/**
* Update subscription
* @param subscriptionId - Subscription ID
* @param updateData - Update details
*/
updateSubscription(subscriptionId: string, updateData: UpdateSubscriptionRequest): Observable<Subscription>
/**
* Cancel subscription
* @param subscriptionId - Subscription ID
* @param cancelData - Cancellation details
*/
cancelSubscription(subscriptionId: string, cancelData: CancelSubscriptionRequest): Observable<void>
/**
* Get subscription by ID
* @param subscriptionId - Subscription ID
*/
getSubscriptionById(subscriptionId: string): Observable<Subscription>💳 Payment Method Management
/**
* Get payment methods
*/
getPaymentMethods(): Observable<PaymentMethod[]>
/**
* Add payment method
* @param paymentMethodData - Payment method details
*/
addPaymentMethod(paymentMethodData: AddPaymentMethodRequest): Observable<PaymentMethod>
/**
* Remove payment method
* @param paymentMethodId - Payment method ID
*/
removePaymentMethod(paymentMethodId: string): Observable<void>
/**
* Set default payment method
* @param paymentMethodId - Payment method ID
*/
setDefaultPaymentMethod(paymentMethodId: string): Observable<void>
/**
* Update payment method
* @param paymentMethodId - Payment method ID
* @param updateData - Update details
*/
updatePaymentMethod(paymentMethodId: string, updateData: UpdatePaymentMethodRequest): Observable<PaymentMethod>🔄 Billing Pipes
Custom pipes for formatting billing-related data and currency display.
💰 CurrencyFormatPipe
export class CurrencyFormatPipe implements PipeTransform {
/**
* Transform amount to formatted currency
* @param value - Amount to format
* @param currency - Currency code
* @param locale - Locale for formatting
*/
transform(value: number, currency: string = 'USD', locale: string = 'en-US'): string
}📊 InvoiceStatusPipe
export class InvoiceStatusPipe implements PipeTransform {
/**
* Transform invoice status to display format
* @param status - Invoice status
*/
transform(status: InvoiceStatus): string
}💳 PaymentMethodPipe
export class PaymentMethodPipe implements PipeTransform {
/**
* Transform payment method to display format
* @param paymentMethod - Payment method object
*/
transform(paymentMethod: PaymentMethod): string
}📋 Interface Definitions
Core Interfaces
interface Invoice {
id: string;
invoiceNumber: string;
customerId: string;
amount: number;
currency: string;
status: InvoiceStatus;
dueDate: Date;
paidDate?: Date;
createdAt: Date;
updatedAt: Date;
items: InvoiceItem[];
taxes: Tax[];
discounts: Discount[];
}
interface Payment {
id: string;
invoiceId: string;
amount: number;
currency: string;
status: PaymentStatus;
method: PaymentMethod;
transactionId: string;
processedAt: Date;
refunds: Refund[];
fees: PaymentFee[];
}
interface Subscription {
id: string;
customerId: string;
planId: string;
status: SubscriptionStatus;
currentPeriodStart: Date;
currentPeriodEnd: Date;
cancelAt?: Date;
trialEnd?: Date;
createdAt: Date;
updatedAt: Date;
}
interface BillingInfo {
customerId: string;
companyName?: string;
billingAddress: BillingAddress;
taxId?: string;
defaultPaymentMethodId?: string;
currency: string;
billingCycle: BillingCycle;
}Enums
enum InvoiceStatus {
DRAFT = 'draft',
PENDING = 'pending',
PAID = 'paid',
OVERDUE = 'overdue',
CANCELLED = 'cancelled',
REFUNDED = 'refunded'
}
enum PaymentStatus {
PENDING = 'pending',
PROCESSING = 'processing',
COMPLETED = 'completed',
FAILED = 'failed',
CANCELLED = 'cancelled',
REFUNDED = 'refunded'
}
enum SubscriptionStatus {
ACTIVE = 'active',
TRIALING = 'trialing',
PAST_DUE = 'past_due',
CANCELLED = 'cancelled',
UNPAID = 'unpaid'
}
enum BillingCycle {
MONTHLY = 'monthly',
QUARTERLY = 'quarterly',
ANNUALLY = 'annually'
}