feat: add Stimulus import modal controller
This commit is contained in:
59
assets/controllers/import_modal_controller.js
Normal file
59
assets/controllers/import_modal_controller.js
Normal file
@@ -0,0 +1,59 @@
|
|||||||
|
import { Controller } from '@hotwired/stimulus';
|
||||||
|
|
||||||
|
export default class extends Controller {
|
||||||
|
static targets = ['overlay', 'fileInput', 'feedback', 'submitBtn'];
|
||||||
|
|
||||||
|
open() {
|
||||||
|
this.overlayTarget.hidden = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
close() {
|
||||||
|
this.overlayTarget.hidden = true;
|
||||||
|
this.fileInputTarget.value = '';
|
||||||
|
this.feedbackTarget.hidden = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
async submit() {
|
||||||
|
const file = this.fileInputTarget.files[0];
|
||||||
|
if (!file) {
|
||||||
|
this._showFeedback('Veuillez sélectionner un fichier.', true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!file.name.endsWith('.csv')) {
|
||||||
|
this._showFeedback('Seuls les fichiers CSV sont acceptés.', true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.submitBtnTarget.disabled = true;
|
||||||
|
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', file);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch('/api/imports', {
|
||||||
|
method: 'POST',
|
||||||
|
body: formData,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
const data = await response.json();
|
||||||
|
this._showFeedback(data.error || 'Une erreur est survenue.', true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this._showFeedback('Import lancé !', false);
|
||||||
|
setTimeout(() => this.close(), 1500);
|
||||||
|
} catch (e) {
|
||||||
|
this._showFeedback('Une erreur est survenue.', true);
|
||||||
|
} finally {
|
||||||
|
this.submitBtnTarget.disabled = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
_showFeedback(message, isError) {
|
||||||
|
this.feedbackTarget.textContent = message;
|
||||||
|
this.feedbackTarget.className = isError ? 'modal-feedback error' : 'modal-feedback success';
|
||||||
|
this.feedbackTarget.hidden = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user