mirror of
https://github.com/t8y2/dbx.git
synced 2026-11-01 16:28:46 +00:00
fix: prevent compare dialogs from closing on outside click
Add @interact-outside.prevent to schema diff and data compare dialogs to avoid accidental dismissal. Move compare action buttons to footer, matching the SQL file execution dialog layout.
This commit is contained in:
@@ -689,7 +689,7 @@ watch(
|
||||
|
||||
<template>
|
||||
<Dialog v-model:open="open">
|
||||
<DialogContent class="sm:max-w-4xl max-h-[85vh] flex flex-col overflow-hidden">
|
||||
<DialogContent class="sm:max-w-4xl max-h-[85vh] flex flex-col overflow-hidden" @interact-outside.prevent>
|
||||
<DialogHeader>
|
||||
<DialogTitle class="flex items-center gap-2">
|
||||
<GitCompareArrows class="w-4 h-4" />
|
||||
@@ -903,15 +903,6 @@ watch(
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-3">
|
||||
<Button size="sm" :disabled="!canCompare || comparing" @click="startCompare">
|
||||
<Loader2 v-if="comparing" class="w-3.5 h-3.5 animate-spin mr-1" />
|
||||
<GitCompareArrows v-else class="w-3.5 h-3.5 mr-1" />
|
||||
{{ t("dataCompare.compare") }}
|
||||
</Button>
|
||||
<span v-if="compareProgressLabel" class="text-xs text-muted-foreground">{{ compareProgressLabel }}</span>
|
||||
</div>
|
||||
|
||||
<div v-if="hasResults" class="space-y-3">
|
||||
<div class="rounded-lg border p-3 text-sm">
|
||||
{{ summary }}
|
||||
@@ -999,6 +990,18 @@ watch(
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<DialogFooter v-if="!(hasResults && syncSql.trim())">
|
||||
<Button variant="outline" @click="open = false">{{ t("common.close") }}</Button>
|
||||
<span v-if="compareProgressLabel" class="text-xs text-muted-foreground self-center">{{
|
||||
compareProgressLabel
|
||||
}}</span>
|
||||
<Button size="sm" :disabled="!canCompare || comparing" @click="startCompare">
|
||||
<Loader2 v-if="comparing" class="w-3.5 h-3.5 animate-spin mr-1" />
|
||||
<GitCompareArrows v-else class="w-3.5 h-3.5 mr-1" />
|
||||
{{ t("dataCompare.compare") }}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
|
||||
<DialogFooter v-if="hasResults && syncSql.trim()" class="flex items-center gap-2">
|
||||
<span v-if="executing" class="text-xs text-muted-foreground mr-auto">
|
||||
{{ t("diff.syncProgress", { current: executedCount, total: executeTotal }) }}
|
||||
|
||||
@@ -372,7 +372,7 @@ watch(
|
||||
|
||||
<template>
|
||||
<Dialog v-model:open="open">
|
||||
<DialogContent class="sm:max-w-2xl max-h-[80vh] flex flex-col overflow-hidden">
|
||||
<DialogContent class="sm:max-w-2xl max-h-[80vh] flex flex-col overflow-hidden" @interact-outside.prevent>
|
||||
<DialogHeader>
|
||||
<DialogTitle class="flex items-center gap-2">
|
||||
<GitCompareArrows class="w-4 h-4" />
|
||||
@@ -492,12 +492,6 @@ watch(
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Button v-if="step === 'select'" size="sm" :disabled="!canCompare || loadingMeta" @click="startCompare">
|
||||
<Loader2 v-if="loadingMeta" class="w-3.5 h-3.5 mr-1 animate-spin" />
|
||||
<GitCompareArrows v-else class="w-3.5 h-3.5 mr-1" />
|
||||
{{ loadingMeta ? t("common.loading") : t("diff.compare") }}
|
||||
</Button>
|
||||
|
||||
<!-- Comparing -->
|
||||
<div v-if="step === 'comparing'" class="flex items-center justify-center py-8 text-sm text-muted-foreground">
|
||||
<Loader2 class="w-4 h-4 animate-spin mr-2" />
|
||||
@@ -643,6 +637,15 @@ watch(
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<DialogFooter v-if="!(step === 'result' && diffs.length > 0)" class="flex items-center gap-2">
|
||||
<Button variant="outline" @click="open = false">{{ t("common.close") }}</Button>
|
||||
<Button v-if="step === 'select'" size="sm" :disabled="!canCompare || loadingMeta" @click="startCompare">
|
||||
<Loader2 v-if="loadingMeta" class="w-3.5 h-3.5 mr-1 animate-spin" />
|
||||
<GitCompareArrows v-else class="w-3.5 h-3.5 mr-1" />
|
||||
{{ loadingMeta ? t("common.loading") : t("diff.compare") }}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
|
||||
<DialogFooter v-if="step === 'result' && diffs.length > 0" class="flex items-center gap-2">
|
||||
<span v-if="executing" class="text-xs text-muted-foreground mr-auto">
|
||||
{{ t("diff.syncProgress", { current: executedCount, total: executeTotal }) }}
|
||||
|
||||
Reference in New Issue
Block a user