perf: add an 'Import Keys' option to new key dialog.
This commit is contained in:
parent
0d6765a757
commit
e87b02e14c
|
@ -13,6 +13,7 @@ import { NSpace } from 'naive-ui'
|
||||||
import useTabStore from 'stores/tab.js'
|
import useTabStore from 'stores/tab.js'
|
||||||
import NewStreamValue from '@/components/new_value/NewStreamValue.vue'
|
import NewStreamValue from '@/components/new_value/NewStreamValue.vue'
|
||||||
import useBrowserStore from 'stores/browser.js'
|
import useBrowserStore from 'stores/browser.js'
|
||||||
|
import Import from '@/components/icons/Import.vue'
|
||||||
|
|
||||||
const i18n = useI18n()
|
const i18n = useI18n()
|
||||||
const newForm = reactive({
|
const newForm = reactive({
|
||||||
|
@ -169,6 +170,11 @@ const onAdd = async () => {
|
||||||
const onClose = () => {
|
const onClose = () => {
|
||||||
dialogStore.closeNewKeyDialog()
|
dialogStore.closeNewKeyDialog()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const onImport = () => {
|
||||||
|
dialogStore.closeNewKeyDialog()
|
||||||
|
dialogStore.openImportKeyDialog(newForm.server, newForm.db)
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
@ -177,17 +183,11 @@ const onClose = () => {
|
||||||
:closable="false"
|
:closable="false"
|
||||||
:close-on-esc="false"
|
:close-on-esc="false"
|
||||||
:mask-closable="false"
|
:mask-closable="false"
|
||||||
:negative-button-props="{ size: 'medium' }"
|
|
||||||
:negative-text="$t('common.cancel')"
|
|
||||||
:positive-button-props="{ size: 'medium' }"
|
|
||||||
:positive-text="$t('common.confirm')"
|
|
||||||
:show-icon="false"
|
:show-icon="false"
|
||||||
:title="$t('dialogue.key.new')"
|
:title="$t('dialogue.key.new')"
|
||||||
preset="dialog"
|
preset="dialog"
|
||||||
style="width: 600px"
|
style="width: 600px"
|
||||||
transform-origin="center"
|
transform-origin="center">
|
||||||
@positive-click="onAdd"
|
|
||||||
@negative-click="onClose">
|
|
||||||
<n-scrollbar ref="scrollRef" style="max-height: 500px">
|
<n-scrollbar ref="scrollRef" style="max-height: 500px">
|
||||||
<n-form
|
<n-form
|
||||||
ref="newFormRef"
|
ref="newFormRef"
|
||||||
|
@ -234,6 +234,25 @@ const onClose = () => {
|
||||||
<!-- TODO: Add import from txt file option -->
|
<!-- TODO: Add import from txt file option -->
|
||||||
</n-form>
|
</n-form>
|
||||||
</n-scrollbar>
|
</n-scrollbar>
|
||||||
|
|
||||||
|
<template #action>
|
||||||
|
<div class="flex-item-expand">
|
||||||
|
<n-button :focusable="false" size="medium" @click="onImport">
|
||||||
|
<template #icon>
|
||||||
|
<n-icon :component="Import" />
|
||||||
|
</template>
|
||||||
|
{{ $t('interface.import_key') }}
|
||||||
|
</n-button>
|
||||||
|
</div>
|
||||||
|
<div class="flex-item n-dialog__action">
|
||||||
|
<n-button :focusable="false" size="medium" @click="onClose">
|
||||||
|
{{ $t('common.cancel') }}
|
||||||
|
</n-button>
|
||||||
|
<n-button :focusable="false" size="medium" type="primary" @click="onAdd">
|
||||||
|
{{ $t('common.confirm') }}
|
||||||
|
</n-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
</n-modal>
|
</n-modal>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -25,7 +25,6 @@ import More from '@/components/icons/More.vue'
|
||||||
import Export from '@/components/icons/Export.vue'
|
import Export from '@/components/icons/Export.vue'
|
||||||
import { ConnectionType } from '@/consts/connection_type.js'
|
import { ConnectionType } from '@/consts/connection_type.js'
|
||||||
import Import from '@/components/icons/Import.vue'
|
import Import from '@/components/icons/Import.vue'
|
||||||
import Down from '@/components/icons/Down.vue'
|
|
||||||
import Checkbox from '@/components/icons/Checkbox.vue'
|
import Checkbox from '@/components/icons/Checkbox.vue'
|
||||||
import Timer from '@/components/icons/Timer.vue'
|
import Timer from '@/components/icons/Timer.vue'
|
||||||
|
|
||||||
|
@ -65,12 +64,8 @@ const dbSelectOptions = computed(() => {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
const addOptions = computed(() => [
|
|
||||||
{ key: 'import', label: i18n.t('interface.import_key'), icon: render.renderIcon(Import, { strokeWidth: 3.5 }) },
|
|
||||||
])
|
|
||||||
|
|
||||||
const moreOptions = computed(() => [
|
const moreOptions = computed(() => [
|
||||||
// { key: 'import', label: i18n.t('interface.import_key'), icon: render.renderIcon(Import, { strokeWidth: 3.5 }) },
|
{ key: 'import', label: i18n.t('interface.import_key'), icon: render.renderIcon(Import, { strokeWidth: 3.5 }) },
|
||||||
{ key: 'flush', label: i18n.t('interface.flush_db'), icon: render.renderIcon(Delete, { strokeWidth: 3.5 }) },
|
{ key: 'flush', label: i18n.t('interface.flush_db'), icon: render.renderIcon(Delete, { strokeWidth: 3.5 }) },
|
||||||
{ key: 'divider', type: 'divider' },
|
{ key: 'divider', type: 'divider' },
|
||||||
{
|
{
|
||||||
|
@ -271,6 +266,7 @@ watch(
|
||||||
<redis-type-selector v-model:value="filterForm.type" @update:value="onSelectFilterType" />
|
<redis-type-selector v-model:value="filterForm.type" @update:value="onSelectFilterType" />
|
||||||
</template>
|
</template>
|
||||||
</content-search-input>
|
</content-search-input>
|
||||||
|
<n-button-group>
|
||||||
<icon-button
|
<icon-button
|
||||||
:disabled="loading"
|
:disabled="loading"
|
||||||
:icon="Refresh"
|
:icon="Refresh"
|
||||||
|
@ -280,7 +276,6 @@ watch(
|
||||||
stroke-width="4"
|
stroke-width="4"
|
||||||
t-tooltip="interface.reload"
|
t-tooltip="interface.reload"
|
||||||
@click="onReload" />
|
@click="onReload" />
|
||||||
<n-button-group>
|
|
||||||
<icon-button
|
<icon-button
|
||||||
:disabled="loading"
|
:disabled="loading"
|
||||||
:icon="Plus"
|
:icon="Plus"
|
||||||
|
@ -290,18 +285,6 @@ watch(
|
||||||
stroke-width="4"
|
stroke-width="4"
|
||||||
t-tooltip="interface.new_key"
|
t-tooltip="interface.new_key"
|
||||||
@click="onAddKey" />
|
@click="onAddKey" />
|
||||||
<n-dropdown
|
|
||||||
:options="addOptions"
|
|
||||||
placement="bottom-end"
|
|
||||||
style="min-width: 130px"
|
|
||||||
trigger="click"
|
|
||||||
@select="onSelectOptions">
|
|
||||||
<n-button :focusable="false" size="small" style="padding: 0 3px">
|
|
||||||
<n-icon size="10">
|
|
||||||
<down :stroke-width="6" />
|
|
||||||
</n-icon>
|
|
||||||
</n-button>
|
|
||||||
</n-dropdown>
|
|
||||||
</n-button-group>
|
</n-button-group>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -79,7 +79,7 @@
|
||||||
"rename_key": "Rename Key",
|
"rename_key": "Rename Key",
|
||||||
"delete_key": "Delete Key",
|
"delete_key": "Delete Key",
|
||||||
"batch_delete_key": "Batch Delete Keys",
|
"batch_delete_key": "Batch Delete Keys",
|
||||||
"import_key": "Import Key",
|
"import_key": "Import Key(s)",
|
||||||
"flush_db": "Flush Database",
|
"flush_db": "Flush Database",
|
||||||
"check_mode": "Check Mode",
|
"check_mode": "Check Mode",
|
||||||
"quit_check_mode": "Quit Check Mode",
|
"quit_check_mode": "Quit Check Mode",
|
||||||
|
|
Loading…
Reference in New Issue