chore(filelib-web): 详情弹窗加删除按钮(MANAGE 专属,进回收站可恢复),删除入口不再只在右键菜单

This commit is contained in:
ymy
2026-07-31 14:11:26 +08:00
parent 8bc5dbf9e2
commit 09338f355a
2 changed files with 30 additions and 2 deletions
@@ -515,7 +515,7 @@
{#if modal === "detail" && detailNode} {#if modal === "detail" && detailNode}
<Modal maxW={680} title="详情 · {detailNode.name}" onclose={() => (modal = null)}> <Modal maxW={680} title="详情 · {detailNode.name}" onclose={() => (modal = null)}>
<OverviewPanel node={detailNode} /> <OverviewPanel node={detailNode} ondeleted={() => { modal = null; refresh(); }} />
</Modal> </Modal>
{/if} {/if}
+29 -1
View File
@@ -6,15 +6,32 @@
import type { ExportJob, NodeDetail } from "./types.js"; import type { ExportJob, NodeDetail } from "./types.js";
import Modal from "./Modal.svelte"; import Modal from "./Modal.svelte";
let { node }: { node: NodeDetail } = $props(); let { node, ondeleted }: { node: NodeDetail; ondeleted?: () => void } = $props();
let showEditDesc = $state(false); let showEditDesc = $state(false);
let descDraft = $state(""); let descDraft = $state("");
let exportJob = $state<ExportJob | null>(null); let exportJob = $state<ExportJob | null>(null);
let deleting = $state(false);
const canEdit = $derived(node.role === "MANAGE" || node.role === "EDIT"); const canEdit = $derived(node.role === "MANAGE" || node.role === "EDIT");
const canManage = $derived(node.role === "MANAGE");
const roleLabel = $derived(ROLE_LABEL[node.role]); const roleLabel = $derived(ROLE_LABEL[node.role]);
/** 删除(进回收站,可恢复;ADR-0031)。MANAGE 专属,与右键菜单同语义。 */
async function deleteNode(): Promise<void> {
if (!confirm(`删除「${node.name}」?移入回收站,可在回收站恢复。`)) return;
deleting = true;
try {
await api(`/database/api/nodes/${node.id}`, { method: "DELETE" });
toastOk("已移入回收站");
ondeleted?.();
} catch (e) {
toastErr(e instanceof Error ? e.message : String(e));
} finally {
deleting = false;
}
}
$effect(() => { $effect(() => {
void node.id; void node.id;
exportJob = null; exportJob = null;
@@ -113,6 +130,17 @@
{/if} {/if}
</div> </div>
{/if} {/if}
{#if canManage}
<div class="my-4 border-t border-line-soft"></div>
<div class="flex items-center justify-between">
<span class="quiet">删除后移入回收站,可恢复</span>
<button class="btn btn-danger disabled:opacity-50" onclick={deleteNode} disabled={deleting}>
{deleting ? "删除中…" : `删除此${node.kind === "PROJECT" ? "项目" : "文件夹"}`}
</button>
</div>
{/if}
</div> </div>
{#if showEditDesc} {#if showEditDesc}