```/* eslint-disable no-plusplus */
import { clearPage } from '../../utils/render';
const main = document.querySelector('main');
const ManageQueries = () => {
clearPage();
displayQueries();
};
async function displayQueries() {
const reponses = await fetch('http://localhost:3000/queries')
const queries = await reponses.json();
if(!reponses)
throw new Error(`Petit Soucis`);
for (let index = 0; index < 8; index++) {
const item = document.createElement('div');
item.innerHTML = `
<p>
${queries[index].subject}
<select id=${index+1} >
<option value="requested"${queries[index].status === 'requested' ? '
selected' : ''}">requested</option>
<option value="accepted"${queries[index].status === 'accepted' ? '
selected' : ''}>accepted</option>
<option value="refused"${queries[index].status === 'refused' ? '
selected' : ''}>refused</option>
</select>
</p>
`;
main.appendChild(item);
}
document.addEventListener('change', (event) => {
if (event.target.tagName === 'SELECT') {
const queryId = event.target.id; // Assurez-vous d'avoir un attribut data-
query-id sur chaque select
const newStatus = event.target.value;
updateStatus(queryId, newStatus);
}
});
function updateStatus(queryId, newStatus) {
fetch(`api/queries/${queryId}`, { // Remplacez avec l'URL correcte de votre API
method: 'PATCH',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ status: newStatus }), // Envoyez le nouveau statut dans
le corps de la requête
})
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json();
})
.then(data => {
console.log('Success:', data);
// Ici, vous pouvez également mettre à jour l'interface utilisateur si
nécessaire
})
.catch(error => {
console.error('Error updating status:', error);
});
}
export default ManageQueries;
```
