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: move key view switch to connection preferences

This commit is contained in:
tiny-craft 2023-10-22 18:31:10 +08:00
parent 92ffd6c605
commit f9fe74a6b4
7 changed files with 85 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
backend/services/connection_service.go
View File

@ -507,7 +507,8 @@ func (c *connectionService) OpenConnection(name string) (resp types.JSResp) {
resp.Success = true resp.Success = true
resp.Data = map[string]any{ resp.Data = map[string]any{
"db": dbs, "db": dbs,
"view": selConn.KeyView,
} }
return return
} }

1
backend/types/connection.go
View File

@ -15,6 +15,7 @@ type ConnectionConfig struct {
ExecTimeout int `json:"execTimeout,omitempty" yaml:"exec_timeout,omitempty"` ExecTimeout int `json:"execTimeout,omitempty" yaml:"exec_timeout,omitempty"`
DBFilterType string `json:"dbFilterType" yaml:"db_filter_type,omitempty"` DBFilterType string `json:"dbFilterType" yaml:"db_filter_type,omitempty"`
DBFilterList []int `json:"dbFilterList" yaml:"db_filter_list,omitempty"` DBFilterList []int `json:"dbFilterList" yaml:"db_filter_list,omitempty"`
KeyView int `json:"keyView,omitempty" yaml:"key_view,omitempty"`
LoadSize int `json:"loadSize,omitempty" yaml:"load_size,omitempty"` LoadSize int `json:"loadSize,omitempty" yaml:"load_size,omitempty"`
MarkColor string `json:"markColor,omitempty" yaml:"mark_color,omitempty"` MarkColor string `json:"markColor,omitempty" yaml:"mark_color,omitempty"`
SSL ConnectionSSL `json:"ssl,omitempty" yaml:"ssl,omitempty"` SSL ConnectionSSL `json:"ssl,omitempty" yaml:"ssl,omitempty"`

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

@ -7,6 +7,7 @@ import useDialog, { ConnDialogType } from 'stores/dialog'
import Close from '@/components/icons/Close.vue' import Close from '@/components/icons/Close.vue'
import useConnectionStore from 'stores/connections.js' import useConnectionStore from 'stores/connections.js'
import FileOpenInput from '@/components/common/FileOpenInput.vue' import FileOpenInput from '@/components/common/FileOpenInput.vue'
import { KeyViewType } from '@/consts/key_view_type.js'
/** /**
* Dialog for new or edit connection * Dialog for new or edit connection
@ -258,37 +259,47 @@ const onClose = () => {
:rules="generalFormRules()" :rules="generalFormRules()"
:show-require-mark="false" :show-require-mark="false"
label-placement="top"> label-placement="top">
<n-form-item :label="$t('dialogue.connection.conn_name')" path="name" required> <n-grid :x-gap="10">
<n-input <n-form-item-gi
v-model:value="generalForm.name" :label="$t('dialogue.connection.conn_name')"
:placeholder="$t('dialogue.connection.name_tip')" /> :span="24"
</n-form-item> path="name"
<n-form-item v-if="!isEditMode" :label="$t('dialogue.connection.group')" required> required>
<n-select v-model:value="generalForm.group" :options="groupOptions" /> <n-input
</n-form-item> v-model:value="generalForm.name"
<n-form-item :label="$t('dialogue.connection.addr')" path="addr" required> :placeholder="$t('dialogue.connection.name_tip')" />
<n-input </n-form-item-gi>
v-model:value="generalForm.addr" <n-form-item-gi
:placeholder="$t('dialogue.connection.addr_tip')" /> v-if="!isEditMode"
<n-text style="width: 40px; text-align: center">:</n-text> :label="$t('dialogue.connection.group')"
<n-input-number :span="24"
v-model:value="generalForm.port" required>
:max="65535" <n-select v-model:value="generalForm.group" :options="groupOptions" />
:min="1" </n-form-item-gi>
style="width: 200px" /> <n-form-item-gi :label="$t('dialogue.connection.addr')" :span="24" path="addr" required>
</n-form-item> <n-input
<n-form-item :label="$t('dialogue.connection.pwd')" path="password"> v-model:value="generalForm.addr"
<n-input :placeholder="$t('dialogue.connection.addr_tip')" />
v-model:value="generalForm.password" <n-text style="width: 40px; text-align: center">:</n-text>
:placeholder="$t('dialogue.connection.pwd_tip')" <n-input-number
show-password-on="click" v-model:value="generalForm.port"
type="password" /> :max="65535"
</n-form-item> :min="1"
<n-form-item :label="$t('dialogue.connection.usr')" path="username"> style="width: 200px" />
<n-input </n-form-item-gi>
v-model:value="generalForm.username" <n-form-item-gi :label="$t('dialogue.connection.pwd')" :span="12" path="password">
:placeholder="$t('dialogue.connection.usr_tip')" /> <n-input
</n-form-item> v-model:value="generalForm.password"
:placeholder="$t('dialogue.connection.pwd_tip')"
show-password-on="click"
type="password" />
</n-form-item-gi>
<n-form-item-gi :label="$t('dialogue.connection.usr')" :span="12" path="username">
<n-input
v-model:value="generalForm.username"
:placeholder="$t('dialogue.connection.usr_tip')" />
</n-form-item-gi>
</n-grid>
</n-form> </n-form>
</n-tab-pane> </n-tab-pane>
@ -337,6 +348,16 @@ const onClose = () => {
</template> </template>
</n-input-number> </n-input-number>
</n-form-item-gi> </n-form-item-gi>
<n-form-item-gi :label="$t('dialogue.connection.advn.key_view')" :span="12">
<n-radio-group v-model:value="generalForm.keyView">
<n-radio-button
:label="$t('dialogue.connection.advn.key_view_tree')"
:value="KeyViewType.Tree" />
<n-radio-button
:label="$t('dialogue.connection.advn.key_view_list')"
:value="KeyViewType.List" />
</n-radio-group>
</n-form-item-gi>
<n-form-item-gi :label="$t('dialogue.connection.advn.load_size')" :span="12"> <n-form-item-gi :label="$t('dialogue.connection.advn.load_size')" :span="12">
<n-input-number v-model:value="generalForm.loadSize" :min="0" /> <n-input-number v-model:value="generalForm.loadSize" :min="0" />
</n-form-item-gi> </n-form-item-gi>
@ -403,20 +424,20 @@ const onClose = () => {
<n-form-item :label="$t('dialogue.connection.ssl.cert_file')"> <n-form-item :label="$t('dialogue.connection.ssl.cert_file')">
<file-open-input <file-open-input
v-model:value="generalForm.ssl.certFile" v-model:value="generalForm.ssl.certFile"
:placeholder="$t('dialogue.connection.ssl.cert_file_tip')" :disabled="!generalForm.ssl.enable"
:disabled="!generalForm.ssl.enable" /> :placeholder="$t('dialogue.connection.ssl.cert_file_tip')" />
</n-form-item> </n-form-item>
<n-form-item :label="$t('dialogue.connection.ssl.key_file')"> <n-form-item :label="$t('dialogue.connection.ssl.key_file')">
<file-open-input <file-open-input
v-model:value="generalForm.ssl.keyFile" v-model:value="generalForm.ssl.keyFile"
:placeholder="$t('dialogue.connection.ssl.key_file_tip')" :disabled="!generalForm.ssl.enable"
:disabled="!generalForm.ssl.enable" /> :placeholder="$t('dialogue.connection.ssl.key_file_tip')" />
</n-form-item> </n-form-item>
<n-form-item :label="$t('dialogue.connection.ssl.ca_file')"> <n-form-item :label="$t('dialogue.connection.ssl.ca_file')">
<file-open-input <file-open-input
v-model:value="generalForm.ssl.caFile" v-model:value="generalForm.ssl.caFile"
:placeholder="$t('dialogue.connection.ssl.ca_file_tip')" :disabled="!generalForm.ssl.enable"
:disabled="!generalForm.ssl.enable" /> :placeholder="$t('dialogue.connection.ssl.ca_file_tip')" />
</n-form-item> </n-form-item>
</n-form> </n-form>
</n-tab-pane> </n-tab-pane>
@ -467,8 +488,8 @@ const onClose = () => {
<n-form-item v-if="sshLoginType === 'pkfile'" :label="$t('dialogue.connection.ssh.pkfile')"> <n-form-item v-if="sshLoginType === 'pkfile'" :label="$t('dialogue.connection.ssh.pkfile')">
<file-open-input <file-open-input
v-model:value="generalForm.ssh.pkFile" v-model:value="generalForm.ssh.pkFile"
:placeholder="$t('dialogue.connection.ssh.pkfile_tip')" :disabled="!generalForm.ssh.enable"
:disabled="!generalForm.ssh.enable" /> :placeholder="$t('dialogue.connection.ssh.pkfile_tip')" />
</n-form-item> </n-form-item>
<n-form-item v-if="sshLoginType === 'pkfile'" :label="$t('dialogue.connection.ssh.passphrase')"> <n-form-item v-if="sshLoginType === 'pkfile'" :label="$t('dialogue.connection.ssh.passphrase')">
<n-input <n-input

25
frontend/src/components/sidebar/BrowserPane.vue
View File

@ -63,11 +63,12 @@ const filterTypeOptions = computed(() => {
return options return options
}) })
const viewType = ref(0) // forbid dynamic switch key view due to performance issues
const onSwitchView = (selectView) => { // const viewType = ref(0)
const { server } = tabStore.currentTab // const onSwitchView = (selectView) => {
connectionStore.switchKeyView(server, selectView) // const { server } = tabStore.currentTab
} // connectionStore.switchKeyView(server, selectView)
// }
</script> </script>
<template> <template>
@ -91,13 +92,13 @@ const onSwitchView = (selectView) => {
</div> </div>
<!-- bottom function bar --> <!-- bottom function bar -->
<div class="nav-pane-bottom flex-box-h"> <div class="nav-pane-bottom flex-box-h">
<switch-button <!-- <switch-button-->
v-model:value="viewType" <!-- v-model:value="viewType"-->
:icons="[TreeView, ListView]" <!-- :icons="[TreeView, ListView]"-->
:t-tooltips="['interface.tree_view', 'interface.list_view']" <!-- :t-tooltips="['interface.tree_view', 'interface.list_view']"-->
stroke-width="4" <!-- stroke-width="4"-->
unselect-stroke-width="3" <!-- unselect-stroke-width="3"-->
@update:value="onSwitchView" /> <!-- @update:value="onSwitchView" />-->
<icon-button :icon="Status" size="20" stroke-width="4" t-tooltip="interface.status" @click="onInfo" /> <icon-button :icon="Status" size="20" stroke-width="4" t-tooltip="interface.status" @click="onInfo" />
<icon-button :icon="Refresh" size="20" stroke-width="4" t-tooltip="interface.reload" @click="onRefresh" /> <icon-button :icon="Refresh" size="20" stroke-width="4" t-tooltip="interface.reload" @click="onRefresh" />
<div class="flex-item-expand" /> <div class="flex-item-expand" />

5
frontend/src/langs/en.json
View File

@ -48,8 +48,6 @@
"disconnect_all": "Disconnect all", "disconnect_all": "Disconnect all",
"status": "Status", "status": "Status",
"filter": "Filter", "filter": "Filter",
"tree_view": "Tree View",
"list_view": "List View",
"sort_conn": "Sort Connections", "sort_conn": "Sort Connections",
"new_conn_title": "New Connection", "new_conn_title": "New Connection",
"open_db": "Open Database", "open_db": "Open Database",
@ -151,6 +149,9 @@
"dbfilter_hide_title": "Select the Databases to Hide", "dbfilter_hide_title": "Select the Databases to Hide",
"dbfilter_input": "Input Database Index", "dbfilter_input": "Input Database Index",
"dbfilter_input_tip": "Press Enter to confirm", "dbfilter_input_tip": "Press Enter to confirm",
"key_view": "Default Key View",
"key_view_tree": "Tree View",
"key_view_list": "List View",
"load_size": "Size of Keys Per Load", "load_size": "Size of Keys Per Load",
"mark_color": "Mark Color" "mark_color": "Mark Color"
}, },

5
frontend/src/langs/zh-cn.json
View File

@ -48,8 +48,6 @@
"disconnect_all": "断开所有连接", "disconnect_all": "断开所有连接",
"status": "状态", "status": "状态",
"filter": "筛选", "filter": "筛选",
"tree_view": "树视图",
"list_view": "列表视图",
"sort_conn": "调整连接顺序", "sort_conn": "调整连接顺序",
"new_conn_title": "新建连接", "new_conn_title": "新建连接",
"open_db": "打开数据库", "open_db": "打开数据库",
@ -151,6 +149,9 @@
"dbfilter_hide_title": "需要隐藏的数据库", "dbfilter_hide_title": "需要隐藏的数据库",
"dbfilter_input": "输入数据库索引", "dbfilter_input": "输入数据库索引",
"dbfilter_input_tip": "按回车确认", "dbfilter_input_tip": "按回车确认",
"key_view": "默认键视图",
"key_view_tree": "树形列表",
"key_view_list": "平铺列表",
"load_size": "单次加载键数量", "load_size": "单次加载键数量",
"mark_color": "标记颜色" "mark_color": "标记颜色"
}, },

4
frontend/src/stores/connections.js
View File

@ -236,6 +236,7 @@ const useConnectionStore = defineStore('connections', {
execTimeout: 60, execTimeout: 60,
dbFilterType: 'none', dbFilterType: 'none',
dbFilterList: [], dbFilterList: [],
keyView: KeyViewType.Tree,
loadSize: 10000, loadSize: 10000,
markColor: '', markColor: '',
ssl: { ssl: {
@ -435,7 +436,7 @@ const useConnectionStore = defineStore('connections', {
// if (connNode == null) { // if (connNode == null) {
// throw new Error('no such connection') // throw new Error('no such connection')
// } // }
const { db } = data const { db, view = KeyViewType.Tree } = data
if (isEmpty(db)) { if (isEmpty(db)) {
throw new Error('no db loaded') throw new Error('no db loaded')
} }
@ -456,6 +457,7 @@ const useConnectionStore = defineStore('connections', {
}) })
} }
this.databases[name] = dbs this.databases[name] = dbs
this.viewType[name] = view
}, },
/** /**