171 lines
5.1 KiB
TypeScript
171 lines
5.1 KiB
TypeScript
import React, { useState } from 'react'
|
|
import CashManagement from './components/CashManagement'
|
|
import CashAccountForm from './components/CashAccountForm'
|
|
import CashMovementForm from './components/CashMovementForm'
|
|
import CashAccountDetails from './components/CashAccountDetails'
|
|
import { FiCashAccount, FiCashMovement, CashMovementTypeEnum } from '../../types/fi'
|
|
import { mockCashAccounts } from '../../mocks/mockCashAccounts'
|
|
import { mockCashMovements } from '../../mocks/mockCashMovements'
|
|
import { Container } from '@/components/shared'
|
|
|
|
const CashPage: React.FC = () => {
|
|
const [showAccountForm, setShowAccountForm] = useState(false)
|
|
const [showMovementForm, setShowMovementForm] = useState(false)
|
|
const [showAccountDetails, setShowAccountDetails] = useState(false)
|
|
const [editingAccount, setEditingAccount] = useState<FiCashAccount | undefined>()
|
|
const [editingMovement, setEditingMovement] = useState<FiCashMovement | undefined>()
|
|
const [viewingAccount, setViewingAccount] = useState<FiCashAccount | undefined>()
|
|
const [cashAccounts, setCashAccounts] = useState(mockCashAccounts)
|
|
const [cashMovements, setCashMovements] = useState(mockCashMovements)
|
|
|
|
const handleAddAccount = () => {
|
|
setEditingAccount(undefined)
|
|
setShowAccountForm(true)
|
|
}
|
|
|
|
const handleEditAccount = (account: FiCashAccount) => {
|
|
setEditingAccount(account)
|
|
setShowAccountForm(true)
|
|
}
|
|
|
|
const handleSaveAccount = (accountData: Omit<FiCashAccount, 'id'>) => {
|
|
if (editingAccount) {
|
|
// Update existing account
|
|
setCashAccounts((prev) =>
|
|
prev.map((acc) =>
|
|
acc.id === editingAccount.id ? { ...accountData, id: editingAccount.id } : acc,
|
|
),
|
|
)
|
|
} else {
|
|
// Add new account
|
|
const newAccount: FiCashAccount = {
|
|
...accountData,
|
|
id: Date.now().toString(),
|
|
}
|
|
setCashAccounts((prev) => [...prev, newAccount])
|
|
}
|
|
setShowAccountForm(false)
|
|
setEditingAccount(undefined)
|
|
}
|
|
|
|
const handleAddMovement = () => {
|
|
setEditingMovement(undefined)
|
|
setShowMovementForm(true)
|
|
}
|
|
|
|
const handleEditMovement = (movement: FiCashMovement) => {
|
|
setEditingMovement(movement)
|
|
setShowMovementForm(true)
|
|
}
|
|
|
|
const handleSaveMovement = (movementData: Omit<FiCashMovement, 'id'>) => {
|
|
if (editingMovement) {
|
|
// Update existing movement
|
|
setCashMovements((prev) =>
|
|
prev.map((mov) =>
|
|
mov.id === editingMovement.id ? { ...movementData, id: editingMovement.id } : mov,
|
|
),
|
|
)
|
|
} else {
|
|
// Add new movement
|
|
const newMovement: FiCashMovement = {
|
|
...movementData,
|
|
id: Date.now().toString(),
|
|
}
|
|
setCashMovements((prev) => [...prev, newMovement])
|
|
}
|
|
|
|
// Update cash account balance
|
|
if (movementData.cashAccount) {
|
|
setCashAccounts((prev) =>
|
|
prev.map((acc) => {
|
|
if (acc.id === movementData.cashAccount?.id) {
|
|
const balanceChange =
|
|
movementData.movementType === CashMovementTypeEnum.Income
|
|
? movementData.amount
|
|
: -movementData.amount
|
|
return {
|
|
...acc,
|
|
balance: acc.balance + balanceChange,
|
|
lastModificationTime: new Date(),
|
|
}
|
|
}
|
|
return acc
|
|
}),
|
|
)
|
|
}
|
|
|
|
setShowMovementForm(false)
|
|
setEditingMovement(undefined)
|
|
}
|
|
|
|
const handleViewDetails = (account: FiCashAccount) => {
|
|
setViewingAccount(account)
|
|
setShowAccountDetails(true)
|
|
}
|
|
|
|
const handleCloseAccountForm = () => {
|
|
setShowAccountForm(false)
|
|
setEditingAccount(undefined)
|
|
}
|
|
|
|
const handleCloseMovementForm = () => {
|
|
setShowMovementForm(false)
|
|
setEditingMovement(undefined)
|
|
}
|
|
|
|
const handleCloseAccountDetails = () => {
|
|
setShowAccountDetails(false)
|
|
setViewingAccount(undefined)
|
|
}
|
|
|
|
return (
|
|
<Container>
|
|
<CashManagement
|
|
cashAccounts={cashAccounts}
|
|
cashMovements={cashMovements}
|
|
onAddAccount={handleAddAccount}
|
|
onEditAccount={handleEditAccount}
|
|
onAddMovement={handleAddMovement}
|
|
onEditMovement={handleEditMovement}
|
|
onViewDetails={handleViewDetails}
|
|
/>
|
|
|
|
{/* Account Form Modal */}
|
|
{showAccountForm && (
|
|
<CashAccountForm
|
|
account={editingAccount}
|
|
onSave={handleSaveAccount}
|
|
onCancel={handleCloseAccountForm}
|
|
isEdit={!!editingAccount}
|
|
/>
|
|
)}
|
|
|
|
{/* Movement Form Modal */}
|
|
{showMovementForm && (
|
|
<CashMovementForm
|
|
movement={editingMovement}
|
|
cashAccounts={cashAccounts}
|
|
onSave={handleSaveMovement}
|
|
onCancel={handleCloseMovementForm}
|
|
isEdit={!!editingMovement}
|
|
/>
|
|
)}
|
|
|
|
{/* Account Details Modal */}
|
|
{showAccountDetails && viewingAccount && (
|
|
<CashAccountDetails
|
|
account={viewingAccount}
|
|
movements={cashMovements}
|
|
onClose={handleCloseAccountDetails}
|
|
onEdit={(account) => {
|
|
setShowAccountDetails(false)
|
|
handleEditAccount(account)
|
|
}}
|
|
/>
|
|
)}
|
|
</Container>
|
|
)
|
|
}
|
|
|
|
export default CashPage
|