admin/depenses_trello
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

v1.1 - Import/Export CSV, 17 dépenses restaurées

Browse Source
This commit is contained in:
h3r7
2026-02-28 08:21:03 +01:00
parent 47e4648a03
commit 64c7a976f7
3 changed files with 120 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
templates/index.html
View File

@@ -11,7 +11,7 @@
body { font-family: 'Outfit', sans-serif; background: var(--bg-dark); color: var(--text); padding: 15px; min-height: 100vh; }
h1 { text-align: center; font-size: 1.6em; background: linear-gradient(135deg, var(--primary), var(--secondary)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.nav { display: flex; gap: 10px; margin: 15px 0; }
.nav a { flex: 1; padding: 12 var(--bg-cardpx; background:); border-radius: 10px; text-align: center; color: var(--text-dim); text-decoration: none; }
.nav a { flex: 1; padding: 12px; background: var(--bg-card); border-radius: 10px; text-align: center; color: var(--text-dim); text-decoration: none; }
.nav a.active { background: linear-gradient(135deg, var(--primary), var(--secondary)); color: #fff; }
.card { background: var(--bg-card); border-radius: 15px; padding: 15px; margin-bottom: 15px; }
h2 { font-size: 1em; margin-bottom: 12px; }
@@ -25,6 +25,7 @@
.btn-success { background: linear-gradient(135deg, var(--success), #00cc66); color: var(--bg-dark); }
.btn-danger { background: var(--danger); color: #fff; }
.btn-send { background: linear-gradient(135deg, #0088cc, #006699); color: #fff; }
.btn-export { background: linear-gradient(135deg, #9944cc, #6622aa); color: #fff; }
.prenom-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.prenom-tag { display: flex; align-items: center; gap: 5px; background: linear-gradient(135deg, var(--primary), var(--secondary)); padding: 8px 12px; border-radius: 20px; font-size: 0.85em; }
.expense-item { display: flex; justify-content: space-between; align-items: center; padding: 12px; background: var(--bg-input); border-radius: 10px; margin-bottom: 8px; flex-wrap: wrap; gap: 5px; }
@@ -37,6 +38,9 @@
.total span { font-weight: 700; color: var(--accent); }
.preview { background: var(--bg-input); padding: 12px; border-radius: 10px; white-space: pre-wrap; color: var(--success); font-family: monospace; margin-top: 10px; }
.actions { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.actions-row { display: flex; gap: 10px; }
.actions-row .btn { margin-top: 0; }
.file-input { display: none; }
</style>
</head>
<body>
@@ -64,6 +68,15 @@
<div id="expenses"></div>
<div class="total">Total: <span id="total">0.00€</span></div>
<div class="actions">
<div class="actions-row">
<button class="btn btn-primary" onclick="generate()">👁️ Aperçu</button>
<button class="btn btn-success" onclick="sendAll()">🟦 Tout envoyer</button>
</div>
<div class="actions-row">
<button class="btn btn-export" onclick="exportCSV()">📥 Exporter CSV</button>
<button class="btn btn-export" onclick="document.getElementById('file-import').click()">📤 Importer CSV</button>
<input type="file" id="file-import" class="file-input" accept=".csv" onchange="importCSV(this)">
</div>
<button class="btn btn-danger" onclick="clearAll()">🗑️ Tout effacer</button>
</div>
</div>
@@ -130,24 +143,20 @@
}
function render() {
// Prenoms
document.getElementById('prenom-select').innerHTML = '<option value="">Choisir...</option>' + config.prenoms.map(function(p) { return '<option value="' + p + '">' + p + '</option>'; }).join('');
document.getElementById('prenom-tags').innerHTML = config.prenoms.map(function(p, i) { return '<span class="prenom-tag">' + p + '<a href="/api/prenom/del/' + i + '" style="color:#fff;text-decoration:none;margin-left:5px">×</a></span>'; }).join('');
// Format
document.getElementById('format-input').value = config.format || '{prenom} - {date} - {libelle} - {montant}€';
var fmt = config.format || '{prenom} - {date} - {libelle} - {montant}€';
fmt = fmt.replace('{prenom}', 'Papa').replace('{date}', '27/02/2026').replace('{libelle}', 'Courses').replace('{montant}', '45.50');
document.getElementById('format-preview').textContent = fmt;
// Trello
if (config.trello) {
document.getElementById('trello-api_key').value = config.trello.api_key || '';
document.getElementById('trello-token').value = config.trello.token || '';
document.getElementById('trello-list_id').value = config.trello.list_id || '';
}
// Expenses
document.getElementById('count').textContent = depenses.length;
var total = depenses.reduce(function(s, d) { return s + (parseFloat(d.montant) || 0); }, 0);
document.getElementById('total').textContent = total.toFixed(2) + '€';
@@ -180,6 +189,30 @@
document.getElementById('depense-date').value = dd + '/' + mm + '/' + yyyy;
}
function exportCSV() {
window.location.href = '/api/export';
}
function importCSV(input) {
var file = input.files[0];
if (!file) return;
var fd = new FormData();
fd.append('file', file);
fetch('/api/import', { method: 'POST', body: fd })
.then(function(r) { return r.json(); })
.then(function(d) {
if (d.success) {
alert('Importé: ' + d.imported + ' dépenses!');
load();
} else {
alert('Erreur: ' + d.error);
}
});
input.value = '';
}
async function sendOne(id) {
if (!config.trello || !config.trello.api_key) { alert('Configure Trello!'); showPage('config'); return; }
var r = await fetch('/api/trello/send_one/' + id, { method: 'POST' });