mirror of
https://github.com/t8y2/dbx.git
synced 2026-10-29 00:09:52 +00:00
fix(grid): persist WHERE filter input across tab switches (closes #210)
whereFilterInput was a component-local ref that got lost when switching tabs because DataGrid is destroyed and recreated via :key binding. Store whereInput in the QueryTab state and pass it as initialWhereInput prop so it survives tab switches.
This commit is contained in:
@@ -80,6 +80,7 @@ const props = defineProps<{
|
|||||||
connectionId?: string;
|
connectionId?: string;
|
||||||
database?: string;
|
database?: string;
|
||||||
context?: "results" | "table-data";
|
context?: "results" | "table-data";
|
||||||
|
initialWhereInput?: string;
|
||||||
tableMeta?: {
|
tableMeta?: {
|
||||||
schema?: string;
|
schema?: string;
|
||||||
tableName: string;
|
tableName: string;
|
||||||
@@ -228,7 +229,7 @@ const orderBySuggestionLeft = ref(0);
|
|||||||
|
|
||||||
const orderByInput = ref("");
|
const orderByInput = ref("");
|
||||||
const hasOrderByInput = computed(() => orderByInput.value.trim().length > 0);
|
const hasOrderByInput = computed(() => orderByInput.value.trim().length > 0);
|
||||||
const whereFilterInput = ref("");
|
const whereFilterInput = ref(props.initialWhereInput ?? "");
|
||||||
const hasWhereFilterInput = computed(() => whereFilterInput.value.trim().length > 0);
|
const hasWhereFilterInput = computed(() => whereFilterInput.value.trim().length > 0);
|
||||||
|
|
||||||
type LocalColumnFilterDraft = {
|
type LocalColumnFilterDraft = {
|
||||||
|
|||||||
@@ -374,6 +374,7 @@ function onHandleCloseColumnPanel() {
|
|||||||
:loading="activeTab.isExecuting"
|
:loading="activeTab.isExecuting"
|
||||||
:editable="!!activeTab.tableMeta?.primaryKeys?.length"
|
:editable="!!activeTab.tableMeta?.primaryKeys?.length"
|
||||||
context="table-data"
|
context="table-data"
|
||||||
|
:initial-where-input="activeTab.whereInput"
|
||||||
:database-type="activeConnection?.db_type"
|
:database-type="activeConnection?.db_type"
|
||||||
:connection-id="activeTab.connectionId"
|
:connection-id="activeTab.connectionId"
|
||||||
:database="activeTab.database"
|
:database="activeTab.database"
|
||||||
|
|||||||
@@ -48,6 +48,7 @@ export function useDataGridActions(activeTab: ComputedRef<QueryTab | undefined>)
|
|||||||
const tab = activeTab.value;
|
const tab = activeTab.value;
|
||||||
if (!tab) return;
|
if (!tab) return;
|
||||||
if (tab.mode === "data" && tab.tableMeta) {
|
if (tab.mode === "data" && tab.tableMeta) {
|
||||||
|
tab.whereInput = whereInput ?? "";
|
||||||
queryStore.updateSql(tab.id, buildTableSql(tab, { whereInput, orderBy }));
|
queryStore.updateSql(tab.id, buildTableSql(tab, { whereInput, orderBy }));
|
||||||
await queryStore.executeCurrentTab();
|
await queryStore.executeCurrentTab();
|
||||||
return;
|
return;
|
||||||
@@ -72,6 +73,7 @@ export function useDataGridActions(activeTab: ComputedRef<QueryTab | undefined>)
|
|||||||
async function onPaginate(offset: number, limit: number, whereInput?: string, orderBy?: string) {
|
async function onPaginate(offset: number, limit: number, whereInput?: string, orderBy?: string) {
|
||||||
const tab = activeTab.value;
|
const tab = activeTab.value;
|
||||||
if (!tab?.tableMeta) return;
|
if (!tab?.tableMeta) return;
|
||||||
|
tab.whereInput = whereInput ?? "";
|
||||||
const sql = buildTableSql(tab, { limit, offset, whereInput, orderBy });
|
const sql = buildTableSql(tab, { limit, offset, whereInput, orderBy });
|
||||||
queryStore.updateSql(tab.id, sql);
|
queryStore.updateSql(tab.id, sql);
|
||||||
await queryStore.executeCurrentTab();
|
await queryStore.executeCurrentTab();
|
||||||
@@ -83,6 +85,7 @@ export function useDataGridActions(activeTab: ComputedRef<QueryTab | undefined>)
|
|||||||
|
|
||||||
if (tab.mode === "data") {
|
if (tab.mode === "data") {
|
||||||
if (!tab.tableMeta) return;
|
if (!tab.tableMeta) return;
|
||||||
|
tab.whereInput = whereInput ?? "";
|
||||||
const orderBy = direction ? `${quoteIdent(tab, column)} ${direction.toUpperCase()}` : undefined;
|
const orderBy = direction ? `${quoteIdent(tab, column)} ${direction.toUpperCase()}` : undefined;
|
||||||
const sql = buildTableSql(tab, { orderBy, whereInput });
|
const sql = buildTableSql(tab, { orderBy, whereInput });
|
||||||
queryStore.updateSql(tab.id, sql);
|
queryStore.updateSql(tab.id, sql);
|
||||||
|
|||||||
@@ -251,6 +251,7 @@ export interface QueryTab {
|
|||||||
selectStar: boolean;
|
selectStar: boolean;
|
||||||
columns: string[];
|
columns: string[];
|
||||||
};
|
};
|
||||||
|
whereInput?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface SavedSqlFolder {
|
export interface SavedSqlFolder {
|
||||||
|
|||||||
Reference in New Issue
Block a user