diff --git a/assets/react/controllers/Menu.tsx b/assets/react/controllers/Menu.tsx
index a2205270e4791a7538a17cedbc1f718a4d9d34c2..c6e66a085e2fe15cbafa191b01ae24c0a581fe03 100644
--- a/assets/react/controllers/Menu.tsx
+++ b/assets/react/controllers/Menu.tsx
@@ -27,7 +27,7 @@ export default function Menu() {
</li>
<li>
<a href="/">
- <span className="item">Deconexion</span>
+ <span className="item">Déconnexion</span>
</a>
</li>
</ul>
diff --git a/assets/react/controllers/TransactionComponant.tsx b/assets/react/controllers/TransactionComponant.tsx
index 13f4810d8d66be3fa58d7c0b07e365aebd3cfe67..2c44b0d32265ef249d94e7c5d845d421c2396905 100644
--- a/assets/react/controllers/TransactionComponant.tsx
+++ b/assets/react/controllers/TransactionComponant.tsx
@@ -2,7 +2,10 @@ import * as React from "react";
import { Transaction } from "../../APIService";
import "../../styles/transaction.css";
-import { VersionedOptionalTransaction, VersionedTransaction } from "./TransactionList";
+import {
+ VersionedOptionalTransaction,
+ VersionedTransaction,
+} from "./TransactionList";
export default function TransactionComponant(props: {
index: number;
@@ -23,7 +26,6 @@ export default function TransactionComponant(props: {
const [isEditing, setIsEditing] = React.useState(props.isEditing);
-
React.useEffect(() => {
if (version !== props.transaction.version) {
setCategory(props.transaction.category);
@@ -40,7 +42,7 @@ export default function TransactionComponant(props: {
date,
category,
expense,
- version
+ version,
});
setIsEditing(false);
};
@@ -56,6 +58,7 @@ export default function TransactionComponant(props: {
{isEditing ? (
<>
<div>
+ <strong>Lieu : </strong>
<label htmlFor="location"></label>
<input
type="text"
@@ -66,6 +69,7 @@ export default function TransactionComponant(props: {
/>
</div>
<div>
+ <strong>Description : </strong>
<label htmlFor="description"></label>
<input
type="text"
@@ -76,6 +80,7 @@ export default function TransactionComponant(props: {
/>
</div>
<div>
+ <strong>Categorie : </strong>
<label htmlFor="category"></label>
<input
type="text"
@@ -86,6 +91,7 @@ export default function TransactionComponant(props: {
/>
</div>
<div>
+ <strong>Montant : </strong>
<label htmlFor="amount"></label>
<input
type="number"
@@ -93,9 +99,10 @@ export default function TransactionComponant(props: {
onChange={(e) => setAmount(Number(e.target.value))}
placeholder="amount"
required
- />
+ /> <strong> $</strong>
</div>
<div>
+ <strong>Date : </strong>
<label htmlFor="date"></label>
<input
type="date"
@@ -106,9 +113,14 @@ export default function TransactionComponant(props: {
/>
</div>
<div>
- Revenue : <input type="checkbox" value={Number(!expense)} onChange={e => setExpense(!e.target.value)} />
+ <strong>Revenue : </strong>{" "}
+ <input
+ type="checkbox"
+ value={Number(!expense)}
+ onChange={(e) => setExpense(!e.target.value)}
+ />
</div>
- <div>
+ <div><strong>Valider : </strong>
<img
src="img/vert.png"
alt="valider"
@@ -116,8 +128,9 @@ export default function TransactionComponant(props: {
/>
</div>
<div>
+ <strong>Supprimer : </strong>
<img
- src="img/faux.png"
+ src="img/download.png"
alt="supprimer"
onClick={() => props.deleteTransaction(props.index)}
/>
@@ -125,15 +138,37 @@ export default function TransactionComponant(props: {
</>
) : (
<>
- <div><strong>Lieu : </strong>{location}</div>
- <div>{description}</div>
- <div>{category}</div>
- <div>{amount.toFixed(2)} $</div>
- <div>{date}</div>
<div>
- Revenue : <input type="checkbox" disabled readOnly value={Number(!expense)} />
+ <strong>Lieu : </strong>
+ {location}
+ </div>
+ <div>
+ <strong>Description : </strong>
+ {description}
+ </div>
+ <div>
+ <strong>Categorie : </strong>
+ {category}
+ </div>
+ <div>
+ <strong>Montant : </strong>
+ {amount.toFixed(2)} $
+ </div>
+ <div>
+ <strong>Date : </strong>
+ {date}
+ </div>
+ <div>
+ <strong>Revenue : </strong>{" "}
+ <input
+ type="checkbox"
+ disabled
+ readOnly
+ value={Number(!expense)}
+ />
</div>
<div>
+ <strong>Modifier : </strong>
<img
src="img/263087.png"
alt="peinceau"
@@ -141,6 +176,7 @@ export default function TransactionComponant(props: {
/>
</div>
<div>
+ <strong>Supprimer : </strong>
<img
src="img/download.png"
alt="peinceau"
diff --git a/templates/transaction/index.html.twig b/templates/transaction/index.html.twig
index bdd68fdf187e633f81399fffbe59604b51074c23..8921458c8d924d0e0b711ec2d0c067b62218f798 100644
--- a/templates/transaction/index.html.twig
+++ b/templates/transaction/index.html.twig
@@ -19,24 +19,7 @@
</div>
<div style="display: flex;justify-grow: 1;flex-direction: column;margin-left: 225px; ">
- <div {{ react_component('TransactionList') }} />
- {# <div>
- <h1>Mes transactions
- <img src="img/plus.png" alt="ajouter"/>
- </h1>
- </div>
- <div style="display:flex; flex-direction:column; flex-grow: 1">
- <div {{ react_component( 'TransactionComponant', {location: "Decathlon", description: "Chaussure", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div>
- <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div>
- <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div>
- <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div>
- <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div>
- <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div>
- <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div>
- <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:true, category : "sport"} ) }}></div>
- </div> #}
- {# <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div> #}
- {# <div {{ react_component( 'TransactionComponant', {location: "Metro", description: "les courses", amount:13, date: "12-12-12", isEditing:false, category : "sport"} ) }}></div> #}
+ <div {{ react_component('TransactionList') }}/>
</div>
{% endblock %}