Coinly/Coinly/UI/Components/AccountCardView.swift

108 lines
3.7 KiB
Swift

import SwiftUI
struct AccountCardView: View {
let account: AccountModel
@EnvironmentObject private var settings: AppSettings
private var accountIcon: String {
account.type.icon
}
private var accountColor: Color {
switch account.type {
case .wallet: return Color(uiColor: .systemBlue)
case .bankAccount: return Color(uiColor: .systemGreen)
case .creditCard: return Color(uiColor: .systemPurple)
case .deposit: return Color(uiColor: .systemOrange)
case .debt: return Color(uiColor: .systemRed)
}
}
var body: some View {
VStack(spacing: AppStyle.paddingMedium) {
// Header
HStack(alignment: .center) {
// Icon
Image(systemName: accountIcon)
.font(.system(size: 24, weight: .medium))
.foregroundColor(accountColor)
.frame(width: 32)
VStack(alignment: .leading, spacing: 4) {
Text(account.name)
.font(AppStyle.fontHeadline)
.foregroundColor(AppStyle.labelPrimary)
Text(account.type.rawValue)
.font(AppStyle.fontSubheadline)
.foregroundColor(AppStyle.labelSecondary)
}
Spacer()
Text(account.currency.symbol)
.font(AppStyle.fontSubheadline)
.foregroundColor(AppStyle.labelSecondary)
}
Divider()
.padding(.horizontal, -AppStyle.paddingMedium)
// Balance
VStack(alignment: .leading, spacing: 4) {
Text("Balance")
.font(AppStyle.fontSubheadline)
.foregroundColor(AppStyle.labelSecondary)
Text(account.balance.formatAsCurrency())
.font(AppStyle.fontTitle2)
.foregroundColor(AppStyle.labelPrimary)
}
.frame(maxWidth: .infinity, alignment: .leading)
// Additional Info
if let availableCredit = account.availableCredit {
HStack {
Text("Available Credit")
.font(AppStyle.fontFootnote)
.foregroundColor(AppStyle.labelSecondary)
Spacer()
Text(availableCredit.formatAsCurrency())
.font(AppStyle.fontCallout)
.foregroundColor(AppStyle.labelPrimary)
}
.padding(.top, 4)
}
if account.isOverdue {
HStack {
Image(systemName: "exclamationmark.circle.fill")
.foregroundColor(Color(uiColor: .systemRed))
Text("Payment Overdue")
.font(AppStyle.fontFootnote)
.foregroundColor(Color(uiColor: .systemRed))
}
.padding(.top, 4)
}
}
.padding(AppStyle.paddingMedium)
.cardStyle()
}
}
// Preview
struct AccountCardView_Previews: PreviewProvider {
static var previews: some View {
Group {
AccountCardView(account: AccountModel.sampleData[0])
.preferredColorScheme(.light)
AccountCardView(account: AccountModel.sampleData[2])
.preferredColorScheme(.dark)
}
.padding()
.background(AppStyle.backgroundPrimary)
.environmentObject(AppSettings.shared)
.previewLayout(.sizeThatFits)
}
}