lingling
/
tiny-rdm
mirror of https://github.com/tiny-craft/tiny-rdm.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

perf: cancel focus for all button components

This commit is contained in:
tiny-craft 2023-09-06 16:07:20 +08:00
parent 3b368b5a1c
commit 0de32407c7
18 changed files with 40 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/AppContent.vue
View File

@ -133,7 +133,11 @@ watch(
</div> </div>
<!-- content --> <!-- content -->
<div id="app-content" :style="prefStore.generalFont" class="flex-box-h flex-item-expand"> <div
id="app-content"
:style="prefStore.generalFont"
style="--wails-draggable: none"
class="flex-box-h flex-item-expand">
<nav-menu v-model:value="tabStore.nav" :width="data.navMenuWidth" /> <nav-menu v-model:value="tabStore.nav" :width="data.navMenuWidth" />
<!-- browser page--> <!-- browser page-->
<div v-show="tabStore.nav === 'browser'" :class="{ dragging }" class="flex-box-h flex-item-expand"> <div v-show="tabStore.nav === 'browser'" :class="{ dragging }" class="flex-box-h flex-item-expand">

4
frontend/src/components/common/IconButton.vue
View File

@ -32,7 +32,7 @@ const hasTooltip = computed(() => {
<template> <template>
<n-tooltip v-if="hasTooltip"> <n-tooltip v-if="hasTooltip">
<template #trigger> <template #trigger>
<n-button :disabled="disabled" :text="!border" @click.prevent="emit('click')"> <n-button :disabled="disabled" :text="!border" :focusable="false" @click.prevent="emit('click')">
<n-icon :color="props.color" :size="props.size"> <n-icon :color="props.color" :size="props.size">
<component :is="props.icon" :stroke-width="props.strokeWidth" /> <component :is="props.icon" :stroke-width="props.strokeWidth" />
</n-icon> </n-icon>
@ -40,7 +40,7 @@ const hasTooltip = computed(() => {
</template> </template>
{{ props.tTooltip ? $t(props.tTooltip) : props.tooltip }} {{ props.tTooltip ? $t(props.tTooltip) : props.tooltip }}
</n-tooltip> </n-tooltip>
<n-button v-else :disabled="disabled" :text="!border" @click.prevent="emit('click')"> <n-button v-else :disabled="disabled" :text="!border" :focusable="false" @click.prevent="emit('click')">
<n-icon :color="props.color" :size="props.size"> <n-icon :color="props.color" :size="props.size">
<component :is="props.icon" :stroke-width="props.strokeWidth" /> <component :is="props.icon" :stroke-width="props.strokeWidth" />
</n-icon> </n-icon>

14
frontend/src/components/common/Toolbar.vue
View File

@ -1,14 +0,0 @@
<script></script>
<template>
<div class="app-toolbar flex-box-h">
<n-button>按钮1</n-button>
<n-button>按钮2</n-button>
</div>
</template>
<style lang="scss" scoped>
.app-toolbar {
align-items: center;
}
</style>

2
frontend/src/components/content/ContentPane.vue
View File

@ -140,7 +140,7 @@ const onReloadKey = async () => {
<div v-else-if="showNonexists" class="content-container flex-item-expand flex-box-v"> <div v-else-if="showNonexists" class="content-container flex-item-expand flex-box-v">
<n-empty :description="$t('nonexist_tab_content')" class="empty-content"> <n-empty :description="$t('nonexist_tab_content')" class="empty-content">
<template #extra> <template #extra>
<n-button @click="onReloadKey">{{ $t('reload') }}</n-button> <n-button :focusable="false" @click="onReloadKey">{{ $t('reload') }}</n-button>
</template> </template>
</n-empty> </n-empty>
</div> </div>

2
frontend/src/components/content/ContentServerPane.vue
View File

@ -10,7 +10,7 @@ const dialogStore = useDialogStore()
<!-- TODO: replace icon to app icon --> <!-- TODO: replace icon to app icon -->
<n-empty :description="$t('empty_server_content')"> <n-empty :description="$t('empty_server_content')">
<template #extra> <template #extra>
<n-button @click="dialogStore.openNewDialog()"> <n-button :focusable="false" @click="dialogStore.openNewDialog()">
<template #icon> <template #icon>
<n-icon :component="AddLink" size="18" /> <n-icon :component="AddLink" size="18" />
</template> </template>

8
frontend/src/components/content_value/ContentToolbar.vue
View File

@ -74,7 +74,7 @@ const onDeleteKey = () => {
<n-button-group> <n-button-group>
<n-tooltip> <n-tooltip>
<template #trigger> <template #trigger>
<n-button @click="dialogStore.openTTLDialog(props.ttl)"> <n-button :focusable="false" @click="dialogStore.openTTLDialog(props.ttl)">
<template #icon> <template #icon>
<n-icon :component="Timer" size="18" /> <n-icon :component="Timer" size="18" />
</template> </template>
@ -92,12 +92,6 @@ const onDeleteKey = () => {
size="18" size="18"
t-tooltip="rename_key" t-tooltip="rename_key"
@click="dialogStore.openRenameKeyDialog(props.server, props.db, props.keyPath)" /> @click="dialogStore.openRenameKeyDialog(props.server, props.db, props.keyPath)" />
<!-- <n-button @click="dialogStore.openRenameKeyDialog(props.server, props.db, props.keyPath)">-->
<!-- <template #icon>-->
<!-- <n-icon :component="Edit" size="18" />-->
<!-- </template>-->
<!-- {{ $t('rename_key') }}-->
<!-- </n-button>-->
</n-button-group> </n-button-group>
<n-tooltip> <n-tooltip>
<template #trigger> <template #trigger>

2
frontend/src/components/content_value/ContentValueHash.vue
View File

@ -258,7 +258,7 @@ const onUpdateFilter = (filters, sourceColumn) => {
</n-input-group> </n-input-group>
</div> </div>
<div class="flex-item-expand"></div> <div class="flex-item-expand"></div>
<n-button plain @click="onAddRow"> <n-button plain :focusable="false" @click="onAddRow">
<template #icon> <template #icon>
<n-icon :component="AddLink" size="18" /> <n-icon :component="AddLink" size="18" />
</template> </template>

2
frontend/src/components/content_value/ContentValueList.vue
View File

@ -182,7 +182,7 @@ const onUpdateFilter = (filters, sourceColumn) => {
@update:value="onFilterInput" /> @update:value="onFilterInput" />
</div> </div>
<div class="flex-item-expand"></div> <div class="flex-item-expand"></div>
<n-button plain @click="onAddValue"> <n-button plain :focusable="false" @click="onAddValue">
<template #icon> <template #icon>
<n-icon :component="AddLink" size="18" /> <n-icon :component="AddLink" size="18" />
</template> </template>

2
frontend/src/components/content_value/ContentValueSet.vue
View File

@ -178,7 +178,7 @@ const onUpdateFilter = (filters, sourceColumn) => {
@update:value="onFilterInput" /> @update:value="onFilterInput" />
</div> </div>
<div class="flex-item-expand"></div> <div class="flex-item-expand"></div>
<n-button plain @click="onAddValue"> <n-button plain :focusable="false" @click="onAddValue">
<template #icon> <template #icon>
<n-icon :component="AddLink" size="18" /> <n-icon :component="AddLink" size="18" />
</template> </template>

2
frontend/src/components/content_value/ContentValueStream.vue
View File

@ -171,7 +171,7 @@ const onUpdateFilter = (filters, sourceColumn) => {
</n-input-group> </n-input-group>
</div> </div>
<div class="flex-item-expand"></div> <div class="flex-item-expand"></div>
<n-button plain @click="onAddRow"> <n-button plain :focusable="false" @click="onAddRow">
<template #icon> <template #icon>
<n-icon :component="AddLink" size="18" /> <n-icon :component="AddLink" size="18" />
</template> </template>

8
frontend/src/components/content_value/ContentValueString.vue
View File

@ -173,13 +173,13 @@ const onSaveValue = async () => {
<n-select v-model:value="viewAs" :options="viewOption" style="width: 200px" /> <n-select v-model:value="viewAs" :options="viewOption" style="width: 200px" />
<div class="flex-item-expand"></div> <div class="flex-item-expand"></div>
<n-button-group v-if="!inEdit"> <n-button-group v-if="!inEdit">
<n-button @click="onCopyValue"> <n-button :focusable="false" @click="onCopyValue">
<template #icon> <template #icon>
<n-icon :component="Copy" size="18" /> <n-icon :component="Copy" size="18" />
</template> </template>
{{ $t('copy_value') }} {{ $t('copy_value') }}
</n-button> </n-button>
<n-button plain @click="onEditValue"> <n-button plain :focusable="false" @click="onEditValue">
<template #icon> <template #icon>
<n-icon :component="Edit" size="18" /> <n-icon :component="Edit" size="18" />
</template> </template>
@ -187,13 +187,13 @@ const onSaveValue = async () => {
</n-button> </n-button>
</n-button-group> </n-button-group>
<n-button-group v-else> <n-button-group v-else>
<n-button :loading="saving" plain @click="onSaveValue"> <n-button :loading="saving" :focusable="false" plain @click="onSaveValue">
<template #icon> <template #icon>
<n-icon :component="Save" size="18" /> <n-icon :component="Save" size="18" />
</template> </template>
{{ $t('save_update') }} {{ $t('save_update') }}
</n-button> </n-button>
<n-button :loading="saving" plain @click="onCancelEdit"> <n-button :loading="saving" :focusable="false" plain @click="onCancelEdit">
<template #icon> <template #icon>
<n-icon :component="Close" size="18" /> <n-icon :component="Close" size="18" />
</template> </template>

2
frontend/src/components/content_value/ContentValueZSet.vue
View File

@ -289,7 +289,7 @@ const onUpdateFilter = (filters, sourceColumn) => {
</n-input-group> </n-input-group>
</div> </div>
<div class="flex-item-expand"></div> <div class="flex-item-expand"></div>
<n-button plain @click="onAddRow"> <n-button plain :focusable="false" @click="onAddRow">
<template #icon> <template #icon>
<n-icon :component="AddLink" size="18" /> <n-icon :component="AddLink" size="18" />
</template> </template>

8
frontend/src/components/dialogs/ConnectionDialog.vue
View File

@ -249,13 +249,15 @@ const onClose = () => {
<template #action> <template #action>
<div class="flex-item-expand"> <div class="flex-item-expand">
<n-button :disabled="closingConnection" :loading="testing" @click="onTestConnection"> <n-button :focusable="false" :disabled="closingConnection" :loading="testing" @click="onTestConnection">
{{ $t('conn_test') }} {{ $t('conn_test') }}
</n-button> </n-button>
</div> </div>
<div class="flex-item n-dialog__action"> <div class="flex-item n-dialog__action">
<n-button :disabled="closingConnection" @click="onClose">{{ $t('cancel') }}</n-button> <n-button :focusable="false" :disabled="closingConnection" @click="onClose">
<n-button :disabled="closingConnection" type="primary" @click="onSaveConnection"> {{ $t('cancel') }}
</n-button>
<n-button :focusable="false" :disabled="closingConnection" type="primary" @click="onSaveConnection">
{{ isEditMode ? $t('update') : $t('confirm') }} {{ isEditMode ? $t('update') : $t('confirm') }}
</n-button> </n-button>
</div> </div>

11
frontend/src/components/dialogs/DeleteKeyDialog.vue
View File

@ -99,11 +99,16 @@ const onClose = () => {
<template #action> <template #action>
<div class="flex-item n-dialog__action"> <div class="flex-item n-dialog__action">
<n-button @click="onClose">{{ $t('cancel') }}</n-button> <n-button :focusable="false" @click="onClose">{{ $t('cancel') }}</n-button>
<n-button v-if="!deleteForm.showAffected" type="primary" @click="scanAffectedKey"> <n-button v-if="!deleteForm.showAffected" type="primary" :focusable="false" @click="scanAffectedKey">
{{ $t('show_affected_key') }} {{ $t('show_affected_key') }}
</n-button> </n-button>
<n-button v-else :disabled="isEmpty(deleteForm.affectedKeys)" type="error" @click="onConfirmDelete"> <n-button
v-else
:focusable="false"
:disabled="isEmpty(deleteForm.affectedKeys)"
type="error"
@click="onConfirmDelete">
{{ $t('confirm_delete_key', { num: size(deleteForm.affectedKeys) }) }} {{ $t('confirm_delete_key', { num: size(deleteForm.affectedKeys) }) }}
</n-button> </n-button>
</div> </div>

2
frontend/src/components/dialogs/KeyFilterDialog.vue
View File

@ -91,7 +91,7 @@ const onClose = () => {
</template> </template>
<div class="text-block">{{ $t('filter_pattern_tip') }}</div> <div class="text-block">{{ $t('filter_pattern_tip') }}</div>
</n-tooltip> </n-tooltip>
<n-button secondary type="primary" @click="filterForm.pattern = '*'"> <n-button secondary type="primary" :focusable="false" @click="filterForm.pattern = '*'">
{{ $t('restore_defaults') }} {{ $t('restore_defaults') }}
</n-button> </n-button>
</n-input-group> </n-input-group>

4
frontend/src/components/dialogs/NewKeyDialog.vue
View File

@ -178,7 +178,9 @@ const onClose = () => {
{{ $t('second') }} {{ $t('second') }}
</template> </template>
</n-input-number> </n-input-number>
<n-button secondary type="primary" @click="newForm.ttl = -1">{{ $t('persist_key') }}</n-button> <n-button secondary type="primary" :focusable="false" @click="newForm.ttl = -1">
{{ $t('persist_key') }}
</n-button>
</n-input-group> </n-input-group>
</n-form-item> </n-form-item>
<component :is="addValueComponent[newForm.type]" ref="subFormRef" v-model:value="newForm.value" /> <component :is="addValueComponent[newForm.type]" ref="subFormRef" v-model:value="newForm.value" />

6
frontend/src/components/dialogs/SetTtlDialog.vue
View File

@ -91,11 +91,11 @@ const onConfirm = async () => {
<template #action> <template #action>
<div class="flex-item-expand"> <div class="flex-item-expand">
<n-button @click="ttlForm.ttl = -1">{{ $t('persist_key') }}</n-button> <n-button :focusable="false" @click="ttlForm.ttl = -1">{{ $t('persist_key') }}</n-button>
</div> </div>
<div class="flex-item n-dialog__action"> <div class="flex-item n-dialog__action">
<n-button @click="onClose">{{ $t('cancel') }}</n-button> <n-button :focusable="false" @click="onClose">{{ $t('cancel') }}</n-button>
<n-button type="primary" @click="onConfirm">{{ $t('save') }}</n-button> <n-button type="primary" :focusable="false" @click="onConfirm">{{ $t('save') }}</n-button>
</div> </div>
</template> </template>
</n-modal> </n-modal>

2
frontend/src/stores/tab.js
View File

@ -204,7 +204,7 @@ const useTabStore = defineStore('tab', {
}, },
/** /**
* * set selected keys of current display browser tree
* @param {string} server * @param {string} server
* @param {string|string[]} keys * @param {string|string[]} keys
*/ */