You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
54 lines
1.6 KiB
JavaScript
54 lines
1.6 KiB
JavaScript
const renderResultMarkup = (query, result) =>
|
|
`
|
|
<h1 class="display-6">${query}</h1>
|
|
<table class="table table-bordered table-striped">
|
|
<tr>
|
|
${result.columns.map((column) => `<th>${column}</th>`).join('')}
|
|
</tr>
|
|
${result.rows.map(
|
|
(row) =>
|
|
`<tr>${Object.entries(row)
|
|
.map(([key, value]) => `<td>${value.value}</td>`)
|
|
.join('')}</tr>`,
|
|
)}
|
|
</table>`;
|
|
|
|
const processAnalyzeResult = (data) => {
|
|
const img = document.getElementById('imgslot');
|
|
const queriesResult = document.getElementById('queriesResult');
|
|
|
|
img.src = 'none.png';
|
|
if (data.image) {
|
|
img.src = 'data:image/jpg;base64,' + data.image;
|
|
}
|
|
|
|
queriesResult.innerHTML = '';
|
|
if (data.data && data.data.response) {
|
|
for (const [query, result] of Object.entries(data.data.response)) {
|
|
queriesResult.innerHTML += renderResultMarkup(query, result);
|
|
}
|
|
} else if (data.data && data.data.error) {
|
|
queriesResult.innerHTML = `<div class="alert alert-danger">${JSON.stringify(data.data.error)}</div>`;
|
|
}
|
|
};
|
|
|
|
const handleFormSubmit = (event) => {
|
|
event.preventDefault();
|
|
const data = new FormData(event.target);
|
|
const loaderWrapper = document.getElementById('loaderWrapper');
|
|
loaderWrapper.classList.remove('d-none');
|
|
fetch('/analyze', { method: 'POST', body: data })
|
|
.then((res) => res.json())
|
|
.then(processAnalyzeResult)
|
|
.catch(() => {
|
|
alert('Произошла внутренняя ошибка.');
|
|
})
|
|
.finally(() => {
|
|
loaderWrapper.classList.add('d-none');
|
|
});
|
|
};
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
document.getElementById('uploadForm').addEventListener('submit', handleFormSubmit);
|
|
});
|