style: HashEditor 按钮一排显示 + 颜色对比 + TTL 内联编辑
- 去掉设置 TTL 按钮, TTL 列改为 el-input-number 内联编辑 - saveField 保存时一并提交 TTL (HEXPIRE) - 保存和删除按钮改为一排显示 (列宽 120px) - 按钮从 text 改为 outline 样式, 确保浅色模式下文字可见 - 移除 setFieldTtl 函数和 .field-ttl 样式
This commit is contained in:
@@ -78,27 +78,6 @@ async function loadFieldTtls() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function setFieldTtl(field: HashField) {
|
|
||||||
if (!connStore.activeId || !keyStore.selectedKey) return
|
|
||||||
try {
|
|
||||||
const { value: seconds } = await ElMessageBox.prompt(t('editor.ttlTitle'), t('editor.setFieldTtl'), {
|
|
||||||
inputValue: '-1',
|
|
||||||
inputPlaceholder: t('key.ttlHint'),
|
|
||||||
})
|
|
||||||
if (seconds === '-1') {
|
|
||||||
// Remove TTL via PERSIST equivalent — HEXPIRE with 0 or use PERSIST on field
|
|
||||||
await window.electronAPI.redis.execute(connStore.activeId, 'HEXPIRE', [keyStore.selectedKey, '0', 'FIELDS', '1', field.field])
|
|
||||||
field.ttl = -1
|
|
||||||
} else {
|
|
||||||
await window.electronAPI.redis.execute(connStore.activeId, 'HEXPIRE', [keyStore.selectedKey, seconds, 'FIELDS', '1', field.field])
|
|
||||||
field.ttl = Number(seconds)
|
|
||||||
}
|
|
||||||
ElMessage.success(t('editor.saved'))
|
|
||||||
} catch (err: any) {
|
|
||||||
if (err !== 'cancel') ElMessage.error(err.message)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
checkHexpireSupport()
|
checkHexpireSupport()
|
||||||
})
|
})
|
||||||
@@ -107,7 +86,11 @@ async function saveField(item: HashField) {
|
|||||||
if (!connStore.activeId || !keyStore.selectedKey) return
|
if (!connStore.activeId || !keyStore.selectedKey) return
|
||||||
try {
|
try {
|
||||||
await window.electronAPI.redis.hashSet(connStore.activeId, keyStore.selectedKey, item.field, item.value)
|
await window.electronAPI.redis.hashSet(connStore.activeId, keyStore.selectedKey, item.field, item.value)
|
||||||
ElMessage.success('Saved')
|
if (supportsHexpire.value && item.ttl != null) {
|
||||||
|
const seconds = item.ttl < 0 ? '0' : String(item.ttl)
|
||||||
|
await window.electronAPI.redis.execute(connStore.activeId, 'HEXPIRE', [keyStore.selectedKey, seconds, 'FIELDS', '1', item.field])
|
||||||
|
}
|
||||||
|
ElMessage.success(t('editor.saved'))
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
ElMessage.error(err.message)
|
ElMessage.error(err.message)
|
||||||
}
|
}
|
||||||
@@ -165,16 +148,15 @@ async function addField() {
|
|||||||
<el-input v-model="row.value" size="small" class="hash-input" />
|
<el-input v-model="row.value" size="small" class="hash-input" />
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column v-if="supportsHexpire" :label="t('editor.fieldTtl')" width="100">
|
<el-table-column v-if="supportsHexpire" :label="t('editor.fieldTtl')" width="110">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
<span class="field-ttl">{{ row.ttl != null ? row.ttl : '-' }}</span>
|
<el-input-number v-model="row.ttl" :min="-1" size="small" controls-position="right" class="hash-ttl-input" />
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column width="180">
|
<el-table-column width="120" align="center">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
<el-button size="small" type="primary" text @click="saveField(row)">{{ t('editor.save') }}</el-button>
|
<el-button size="small" type="primary" @click="saveField(row)">{{ t('editor.save') }}</el-button>
|
||||||
<el-button v-if="supportsHexpire" size="small" type="warning" text @click="setFieldTtl(row)">{{ t('editor.setFieldTtl') }}</el-button>
|
<el-button size="small" type="danger" @click="deleteField(row)">{{ t('common.delete') }}</el-button>
|
||||||
<el-button size="small" type="danger" text @click="deleteField(row)">{{ t('common.delete') }}</el-button>
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
@@ -265,6 +247,33 @@ async function addField() {
|
|||||||
color: var(--text-primary);
|
color: var(--text-primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hash-ttl-input {
|
||||||
|
width: 90px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hash-ttl-input :deep(.el-input__inner) {
|
||||||
|
color: var(--text-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Button contrast in both themes */
|
||||||
|
.hash-table :deep(.el-button--primary) {
|
||||||
|
--el-button-text-color: var(--accent-light);
|
||||||
|
--el-button-bg-color: transparent;
|
||||||
|
--el-button-border-color: var(--accent);
|
||||||
|
--el-button-hover-text-color: #fff;
|
||||||
|
--el-button-hover-bg-color: var(--accent);
|
||||||
|
--el-button-hover-border-color: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hash-table :deep(.el-button--danger) {
|
||||||
|
--el-button-text-color: var(--danger);
|
||||||
|
--el-button-bg-color: transparent;
|
||||||
|
--el-button-border-color: var(--danger);
|
||||||
|
--el-button-hover-text-color: #fff;
|
||||||
|
--el-button-hover-bg-color: var(--danger);
|
||||||
|
--el-button-hover-border-color: var(--danger);
|
||||||
|
}
|
||||||
|
|
||||||
.item-count {
|
.item-count {
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
color: var(--text-muted);
|
color: var(--text-muted);
|
||||||
@@ -275,9 +284,4 @@ async function addField() {
|
|||||||
color: var(--accent-light);
|
color: var(--accent-light);
|
||||||
}
|
}
|
||||||
|
|
||||||
.field-ttl {
|
|
||||||
font-size: 12px;
|
|
||||||
font-family: 'Cascadia Code', monospace;
|
|
||||||
color: var(--text-muted);
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user