github/dbx
4
0
Fork 0
mirror of https://github.com/t8y2/dbx.git synced 2026-10-19 16:16:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(nacos): improve config selection and separators

Browse Source
This commit is contained in:
LSD
2026-07-10 19:27:07 +08:00
committed by GitHub
parent c35e5c560a
commit ee3de0525e
1 changed files with 34 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/desktop/src/components/nacos/NacosAdminConsole.vue
+34 -16
View File
@@ -913,21 +913,21 @@ onBeforeUnmount(() => {
<div class="min-h-0 flex-1 overflow-auto">
<div class="min-w-max" :style="{ minWidth: configListMinWidth }">
<div class="sticky top-0 z-20 grid border-b bg-muted px-3 py-2 text-[11px] font-medium uppercase tracking-wide text-muted-foreground shadow-sm" :style="{ gridTemplateColumns: configListGridTemplate }">
<div class="relative min-w-0 truncate pr-4">
<span class="truncate">dataID</span>
<div data-column-resize-handle class="absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-primary/30" :class="configListResizingColumnIndex === 0 ? 'bg-primary/30' : ''" @mousedown="onConfigListColumnResizeStart(0, $event)" />
<div class="relative min-w-0 border-r border-border/70 pr-3 last:border-r-0">
<span class="block truncate">dataID</span>
<div data-column-resize-handle class="absolute -right-1 top-0 z-10 h-full w-2 cursor-col-resize" :class="configListResizingColumnIndex === 0 ? 'bg-primary/10' : ''" @mousedown="onConfigListColumnResizeStart(0, $event)" />
</div>
<div class="relative min-w-0 truncate pr-4">
<span class="truncate">{{ t("nacos.group") }}</span>
<div data-column-resize-handle class="absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-primary/30" :class="configListResizingColumnIndex === 1 ? 'bg-primary/30' : ''" @mousedown="onConfigListColumnResizeStart(1, $event)" />
<div class="relative min-w-0 border-r border-border/70 pr-3 last:border-r-0">
<span class="block truncate">{{ t("nacos.group") }}</span>
<div data-column-resize-handle class="absolute -right-1 top-0 z-10 h-full w-2 cursor-col-resize" :class="configListResizingColumnIndex === 1 ? 'bg-primary/10' : ''" @mousedown="onConfigListColumnResizeStart(1, $event)" />
</div>
<div class="relative min-w-0 truncate pr-4">
<span class="truncate">{{ t("nacos.application") }}</span>
<div data-column-resize-handle class="absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-primary/30" :class="configListResizingColumnIndex === 2 ? 'bg-primary/30' : ''" @mousedown="onConfigListColumnResizeStart(2, $event)" />
<div class="relative min-w-0 border-r border-border/70 pr-3 last:border-r-0">
<span class="block truncate">{{ t("nacos.application") }}</span>
<div data-column-resize-handle class="absolute -right-1 top-0 z-10 h-full w-2 cursor-col-resize" :class="configListResizingColumnIndex === 2 ? 'bg-primary/10' : ''" @mousedown="onConfigListColumnResizeStart(2, $event)" />
</div>
<div class="relative min-w-0 truncate pr-4">
<span class="truncate">{{ t("nacos.format") }}</span>
<div data-column-resize-handle class="absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-primary/30" :class="configListResizingColumnIndex === 3 ? 'bg-primary/30' : ''" @mousedown="onConfigListColumnResizeStart(3, $event)" />
<div class="relative min-w-0 border-r border-border/70 pr-3 last:border-r-0">
<span class="block truncate">{{ t("nacos.format") }}</span>
<div data-column-resize-handle class="absolute -right-1 top-0 z-10 h-full w-2 cursor-col-resize" :class="configListResizingColumnIndex === 3 ? 'bg-primary/10' : ''" @mousedown="onConfigListColumnResizeStart(3, $event)" />
</div>
</div>
<button
@@ -939,12 +939,12 @@ onBeforeUnmount(() => {
:style="{ gridTemplateColumns: configListGridTemplate }"
@click="selectConfig(item)"
>
<span class="flex min-w-0 items-center gap-2 pr-3" :title="item.dataId">
<span class="flex min-w-0 items-center gap-2 border-r border-border/50 pr-3 last:border-r-0" :title="item.dataId">
<FileText class="h-3.5 w-3.5 shrink-0 text-muted-foreground" />
<span class="truncate font-medium text-foreground">{{ item.dataId }}</span>
</span>
<span class="truncate pr-3 text-xs text-muted-foreground" :title="item.group || 'DEFAULT_GROUP'">{{ item.group || "DEFAULT_GROUP" }}</span>
<span class="truncate pr-3 text-xs text-muted-foreground" :title="item.appName || '-'">{{ item.appName || "-" }}</span>
<span class="truncate border-r border-border/50 pr-3 text-xs text-muted-foreground last:border-r-0" :title="item.group || 'DEFAULT_GROUP'">{{ item.group || "DEFAULT_GROUP" }}</span>
<span class="truncate border-r border-border/50 pr-3 text-xs text-muted-foreground last:border-r-0" :title="item.appName || '-'">{{ item.appName || "-" }}</span>
<span class="truncate text-xs text-muted-foreground" :title="configFormatLabel(item)">{{ configFormatLabel(item) }}</span>
</button>
</div>
@@ -1049,7 +1049,7 @@ onBeforeUnmount(() => {
</div>
</div>
<div v-if="selectedConfig" class="relative min-h-0 flex-1 overflow-hidden bg-background">
<div ref="configEditorHost" class="h-full min-h-0 overflow-hidden" />
<div ref="configEditorHost" class="nacos-config-editor h-full min-h-0 overflow-hidden" />
<EditorSearchPanel ref="configSearchPanelRef" :view="configEditorView" tone="editor" />
</div>
<div v-else class="flex h-full items-center justify-center text-sm text-muted-foreground">{{ t("nacos.selectConfig") }}</div>
@@ -1253,6 +1253,24 @@ onBeforeUnmount(() => {
</template>
<style scoped>
.nacos-config-editor :deep(.cm-content),
.nacos-config-editor :deep(.cm-line) {
cursor: text;
user-select: text !important;
-webkit-user-select: text !important;
}
.nacos-config-editor :deep(.cm-selectionBackground),
.nacos-config-editor :deep(.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground),
.nacos-config-editor :deep(.cm-trimmedSelection) {
display: block !important;
background: var(--dbx-editor-selection-background, rgba(59, 130, 246, 0.35)) !important;
}
.nacos-config-editor :deep(.cm-content ::selection) {
background: var(--dbx-editor-selection-background, rgba(59, 130, 246, 0.35)) !important;
}
.nacos-admin-splitpanes :deep(.splitpanes--vertical > .splitpanes__splitter) {
width: 4px !important;
border-left: 1px solid var(--border);