fix(desktop): constrain SQL preview dialog content

This commit is contained in:
二丫讲梵 authored and GitHub committed 2026-09-18 21:10:32 +08:00
1 parent 5f0a8a9a93
commit bfaf8fa818
3 files changed
+151 -27

No files matched your search

@@ -1042,27 +1042,29 @@ onMounted(loadUsers);
</Dialog>
<Dialog v-model:open="sqlDialogOpen">
<DialogContent class="max-w-2xl">
<DialogContent class="max-w-2xl grid-rows-[auto_minmax(0,1fr)_auto]">
<DialogHeader>
<DialogTitle class="flex items-center gap-2">
<AlertTriangle v-if="pendingDanger" class="h-4 w-4 text-destructive" />
{{ t("userAdmin.sqlPreview") }}
</DialogTitle>
</DialogHeader>
<pre class="max-h-[50vh] min-h-44 overflow-auto whitespace-pre-wrap rounded-md border bg-muted/30 p-3 font-mono text-xs leading-5" v-html="highlightedPendingSql" />
<div v-if="pendingResults.length > 0" class="grid gap-2 rounded-md border p-3">
<div class="text-xs font-semibold" :class="pendingStatus === 'success' ? 'text-green-600' : pendingStatus === 'partial' ? 'text-amber-600' : 'text-destructive'">
{{ t(pendingStatus === "success" ? "userAdmin.resultSuccess" : pendingStatus === "partial" ? "userAdmin.resultPartial" : "userAdmin.resultFailed") }}
</div>
<div v-for="result in pendingResults" :key="result.step.id" class="flex items-start gap-2 text-xs">
<Check v-if="result.status === 'success'" class="mt-0.5 h-3.5 w-3.5 shrink-0 text-green-600" />
<AlertTriangle v-else-if="result.status === 'failed'" class="mt-0.5 h-3.5 w-3.5 shrink-0 text-destructive" />
<span v-else class="mt-1 h-2 w-2 shrink-0 rounded-full bg-muted-foreground" />
<span class="min-w-0">
<span class="block">{{ authorizationStepLabel(result) }}</span>
<span v-if="result.message" class="mt-0.5 block break-all text-destructive">{{ result.message }}</span>
<span v-else-if="result.status === 'skipped'" class="mt-0.5 block text-muted-foreground">{{ t("userAdmin.stepSkipped") }}</span>
</span>
<div class="grid min-h-0 max-h-full min-w-0 gap-3 overflow-hidden" :class="pendingResults.length > 0 ? 'h-[70vh] grid-rows-[minmax(0,1fr)_minmax(0,1fr)]' : 'h-[50vh] grid-rows-[minmax(0,1fr)]'">
<pre class="min-h-0 min-w-0 overflow-auto overscroll-contain whitespace-pre-wrap rounded-md border bg-muted/30 p-3 font-mono text-xs leading-5" v-html="highlightedPendingSql" />
<div v-if="pendingResults.length > 0" class="grid min-h-0 min-w-0 content-start gap-2 overflow-y-auto overscroll-contain rounded-md border p-3">
<div class="text-xs font-semibold" :class="pendingStatus === 'success' ? 'text-green-600' : pendingStatus === 'partial' ? 'text-amber-600' : 'text-destructive'">
{{ t(pendingStatus === "success" ? "userAdmin.resultSuccess" : pendingStatus === "partial" ? "userAdmin.resultPartial" : "userAdmin.resultFailed") }}
</div>
<div v-for="result in pendingResults" :key="result.step.id" class="flex items-start gap-2 text-xs">
<Check v-if="result.status === 'success'" class="mt-0.5 h-3.5 w-3.5 shrink-0 text-green-600" />
<AlertTriangle v-else-if="result.status === 'failed'" class="mt-0.5 h-3.5 w-3.5 shrink-0 text-destructive" />
<span v-else class="mt-1 h-2 w-2 shrink-0 rounded-full bg-muted-foreground" />
<span class="min-w-0">
<span class="block">{{ authorizationStepLabel(result) }}</span>
<span v-if="result.message" class="mt-0.5 block break-all text-destructive">{{ result.message }}</span>
<span v-else-if="result.status === 'skipped'" class="mt-0.5 block text-muted-foreground">{{ t("userAdmin.stepSkipped") }}</span>
</span>
</div>
</div>
</div>
<DialogFooter>