更改切换redis连接操作方式
This commit is contained in:
@@ -34,7 +34,8 @@ function onDragStart(e: DragEvent) {
|
||||
}"
|
||||
draggable="true"
|
||||
@dragstart="onDragStart"
|
||||
>
|
||||
@click="connStore.switchTo(connection.id)"
|
||||
>
|
||||
<div class="card-status" />
|
||||
<div class="card-body">
|
||||
<div class="card-name">{{ connection.name }}</div>
|
||||
|
||||
@@ -156,11 +156,6 @@ function restoreTabState(connId: string) {
|
||||
}
|
||||
}
|
||||
|
||||
// Connected connections for switcher
|
||||
const connectedConnections = computed(() =>
|
||||
connStore.connections.filter(c => connStore.connectedIds.includes(c.id))
|
||||
)
|
||||
|
||||
// Switch active connection, save/restore tabs
|
||||
watch(
|
||||
() => connStore.activeId,
|
||||
@@ -206,28 +201,6 @@ onUnmounted(() => {
|
||||
<template>
|
||||
<div class="main-area" @click="closeContextMenu">
|
||||
<div class="tab-bar" v-if="connStore.isConnected" ref="tabBarRef" @wheel.passive="onWheel">
|
||||
<!-- Connection switcher -->
|
||||
<el-dropdown v-if="connectedConnections.length > 0" trigger="click" @command="connStore.switchTo($event)">
|
||||
<div class="conn-switcher">
|
||||
<span class="conn-dot" />
|
||||
<span class="conn-name">{{ connStore.activeConnection?.name }}</span>
|
||||
<el-icon v-if="connectedConnections.length > 1"><ArrowDown /></el-icon>
|
||||
</div>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item
|
||||
v-for="conn in connectedConnections"
|
||||
:key="conn.id"
|
||||
:command="conn.id"
|
||||
:class="{ 'is-active': conn.id === connStore.activeId }"
|
||||
>
|
||||
{{ conn.name }}
|
||||
<span class="conn-host">{{ conn.host }}:{{ conn.port }}</span>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<div class="tab-divider" v-if="connectedConnections.length > 0" />
|
||||
<!-- DB Selector -->
|
||||
<DbSelector v-if="connStore.isConnected" class="tab-db-selector" />
|
||||
<div class="tab-divider" v-if="connStore.isConnected" />
|
||||
@@ -321,44 +294,6 @@ onUnmounted(() => {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.conn-switcher {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 8px 14px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: var(--accent-light);
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.conn-switcher:hover {
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
|
||||
.conn-dot {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: var(--success);
|
||||
box-shadow: 0 0 6px var(--success);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.conn-name {
|
||||
max-width: 120px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.conn-host {
|
||||
font-size: 10px;
|
||||
color: var(--text-muted);
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.tab-db-selector {
|
||||
flex-shrink: 0;
|
||||
padding: 0 4px;
|
||||
|
||||
Reference in New Issue
Block a user