feat: support delete operation

This commit is contained in:
sigoden
2022-05-26 19:52:54 +08:00
parent 78e7daf7cc
commit dd888f1ae8
4 changed files with 74 additions and 21 deletions

View File

@@ -103,17 +103,41 @@
}
}
function addFile(file) {
function addPath(file, index) {
const actionTd = file.name === ".." || readonly ? "" : `
<td class="cell-actions">
<div onclick="deletePath(${index})" class="delete-btn" id="deleteBtn${index}" title="Delete ${file.name}">
<svg width="18" height="18" viewBox="0 0 40 40"><path d="M28,40H11.8c-3.3,0-5.9-2.7-5.9-5.9V16c0-0.6,0.4-1,1-1s1,0.4,1,1v18.1c0,2.2,1.8,3.9,3.9,3.9H28c2.2,0,3.9-1.8,3.9-3.9V16 c0-0.6,0.4-1,1-1s1,0.4,1,1v18.1C33.9,37.3,31.2,40,28,40z"/></g><g><path d="M33.3,4.9h-7.6C25.2,2.1,22.8,0,19.9,0s-5.3,2.1-5.8,4.9H6.5c-2.3,0-4.1,1.8-4.1,4.1S4.2,13,6.5,13h26.9 c2.3,0,4.1-1.8,4.1-4.1S35.6,4.9,33.3,4.9z M19.9,2c1.8,0,3.3,1.2,3.7,2.9h-7.5C16.6,3.2,18.1,2,19.9,2z M33.3,11H6.5 c-1.1,0-2.1-0.9-2.1-2.1c0-1.1,0.9-2.1,2.1-2.1h26.9c1.1,0,2.1,0.9,2.1,2.1C35.4,10.1,34.5,11,33.3,11z"/></g><g><path d="M12.9,35.1c-0.6,0-1-0.4-1-1V17.4c0-0.6,0.4-1,1-1s1,0.4,1,1v16.7C13.9,34.6,13.4,35.1,12.9,35.1z"/></g><g><path d="M26.9,35.1c-0.6,0-1-0.4-1-1V17.4c0-0.6,0.4-1,1-1s1,0.4,1,1v16.7C27.9,34.6,27.4,35.1,26.9,35.1z"/></g><g><path d="M19.9,35.1c-0.6,0-1-0.4-1-1V17.4c0-0.6,0.4-1,1-1s1,0.4,1,1v16.7C20.9,34.6,20.4,35.1,19.9,35.1z"/></svg>
</div>
</td>`
$tbody.insertAdjacentHTML("beforeend", `
<tr>
<tr id="addPath${index}">
<td class="path cell-name">
<div>${getSvg(file.path_type)}</div>
<a href="${encodeURI(file.path)}" title="${file.name}">${file.name}</a>
</td>
<td class="cell-mtime">${formatMtime(file.mtime)}</td>
<td class="cell-size">${formatSize(file.size)}</td>
</tr>
`)
${actionTd}
</tr>`)
}
async function deletePath(index) {
const file = paths[index];
if (!file) return;
try {
const res = await fetch(encodeURI(file.path), {
method: "DELETE",
});
if (res.status !== 200) {
const text = await res.text();
throw new Error(text);
}
document.getElementById(`addPath${index}`).remove();
} catch (err) {
alert(`Failed to delete ${file.name}, ${err.message}`);
}
}
function addUploadControl() {
@@ -164,11 +188,13 @@
}
document.addEventListener('DOMContentLoaded', () => {
addBreadcrumb(breadcrumb);
paths.forEach(file => addFile(file));
if (readonly) {
paths.forEach((file, index) => addPath(file, index));
if (!readonly) {
addUploadControl();
document.querySelector(".main thead tr").insertAdjacentHTML("beforeend", `<th class="cell-actions">Actions</th>`);
document.getElementById("file").addEventListener("change", e => {
const files = e.target.files;
for (const file of files) {