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

fix: disable loading indicator when preferences dialog display 

fix: replace regex match with self-parse for parse node key
This commit is contained in:
tiny-craft 2023-08-18 17:57:02 +08:00
parent 86adf17514
commit 803c9c1a50
2 changed files with 105 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

147
frontend/src/components/dialogs/PreferencesDialog.vue
View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { ref, watch, nextTick } from 'vue' import { ref, watch } from 'vue'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import useDialog from 'stores/dialog' import useDialog from 'stores/dialog'
import usePreferencesStore from 'stores/preferences.js' import usePreferencesStore from 'stores/preferences.js'
@ -34,7 +34,7 @@ watch(
() => dialogStore.preferencesDialogVisible, () => dialogStore.preferencesDialogVisible,
(visible) => { (visible) => {
if (visible) { if (visible) {
nextTick().then(initPreferences) initPreferences()
} }
}, },
) )
@ -72,84 +72,75 @@ const onClose = () => {
preset="dialog" preset="dialog"
transform-origin="center" transform-origin="center"
> >
<n-spin :show="loading"> <!-- FIXME: set loading will slow down appear animation of dialog in linux -->
<n-tabs v-model:value="tab" animated type="line"> <!-- <n-spin :show="loading"> -->
<n-tab-pane :tab="$t('general')" display-directive="show" name="general"> <n-tabs v-model:value="tab" animated type="line">
<n-form <n-tab-pane :tab="$t('general')" display-directive="show" name="general">
:label-width="formLabelWidth" <n-form
:model="prefStore.general" :disabled="loading"
:show-require-mark="false" :label-width="formLabelWidth"
label-align="right" :model="prefStore.general"
label-placement="left" :show-require-mark="false"
> label-align="right"
<n-form-item :label="$t('theme')" required> label-placement="left"
<n-radio-group v-model:value="prefStore.general.theme" name="theme" size="medium"> >
<n-radio-button <n-form-item :label="$t('theme')" required>
v-for="opt in prefStore.themeOption" <n-radio-group v-model:value="prefStore.general.theme" name="theme" size="medium">
:key="opt.value" <n-radio-button v-for="opt in prefStore.themeOption" :key="opt.value" :value="opt.value">
:value="opt.value" {{ opt.label }}
> </n-radio-button>
{{ opt.label }} </n-radio-group>
</n-radio-button> </n-form-item>
</n-radio-group> <n-form-item :label="$t('language')" required>
</n-form-item> <n-select
<n-form-item :label="$t('language')" required> v-model:value="prefStore.general.language"
<n-select :options="prefStore.langOption"
v-model:value="prefStore.general.language" filterable
:options="prefStore.langOption" />
filterable </n-form-item>
/> <n-form-item :label="$t('font')" required>
</n-form-item> <n-select v-model:value="prefStore.general.font" :options="prefStore.fontOption" filterable />
<n-form-item :label="$t('font')" required> </n-form-item>
<n-select <n-form-item :label="$t('font_size')">
v-model:value="prefStore.general.font" <n-input-number v-model:value="prefStore.general.fontSize" :max="65535" :min="1" />
:options="prefStore.fontOption" </n-form-item>
filterable <n-form-item :label="$t('proxy')">
/> <n-space>
</n-form-item> <n-checkbox v-model:checked="prefStore.general.useSysProxy">
<n-form-item :label="$t('font_size')"> {{ $t('use_system_proxy') }}
<n-input-number v-model:value="prefStore.general.fontSize" :max="65535" :min="1" />
</n-form-item>
<n-form-item :label="$t('proxy')">
<n-space>
<n-checkbox v-model:checked="prefStore.general.useSysProxy">
{{ $t('use_system_proxy') }}
</n-checkbox>
<n-checkbox v-model:checked="prefStore.general.useSysProxyHttp">
{{ $t('use_system_proxy_http') }}
</n-checkbox>
</n-space>
</n-form-item>
<n-form-item :label="$t('update')">
<n-checkbox v-model:checked="prefStore.general.checkUpdate">
{{ $t('auto_check_update') }}
</n-checkbox> </n-checkbox>
</n-form-item> <n-checkbox v-model:checked="prefStore.general.useSysProxyHttp">
</n-form> {{ $t('use_system_proxy_http') }}
</n-tab-pane> </n-checkbox>
</n-space>
</n-form-item>
<n-form-item :label="$t('update')">
<n-checkbox v-model:checked="prefStore.general.checkUpdate">
{{ $t('auto_check_update') }}
</n-checkbox>
</n-form-item>
</n-form>
</n-tab-pane>
<n-tab-pane :tab="$t('editor')" display-directive="show" name="editor"> <n-tab-pane :tab="$t('editor')" display-directive="show" name="editor">
<n-form <n-form
:label-width="formLabelWidth" :disabled="loading"
:model="prefStore.editor" :label-width="formLabelWidth"
:show-require-mark="false" :model="prefStore.editor"
label-align="right" :show-require-mark="false"
label-placement="left" label-align="right"
> label-placement="left"
<n-form-item :label="$t('font')" required> >
<n-select <n-form-item :label="$t('font')" required>
v-model:value="prefStore.editor.font" <n-select v-model:value="prefStore.editor.font" :options="prefStore.fontOption" filterable />
:options="prefStore.fontOption" </n-form-item>
filterable <n-form-item :label="$t('font_size')">
/> <n-input-number v-model:value="prefStore.editor.fontSize" :max="65535" :min="1" />
</n-form-item> </n-form-item>
<n-form-item :label="$t('font_size')"> </n-form>
<n-input-number v-model:value="prefStore.editor.fontSize" :max="65535" :min="1" /> </n-tab-pane>
</n-form-item> </n-tabs>
</n-form> <!-- </n-spin> -->
</n-tab-pane>
</n-tabs>
</n-spin>
<template #action> <template #action>
<div class="flex-item-expand"> <div class="flex-item-expand">

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

@ -1,5 +1,20 @@
import { defineStore } from 'pinia' import { defineStore } from 'pinia'
import { endsWith, get, isEmpty, join, remove, size, slice, sortedIndexBy, split, sumBy, toUpper, uniq } from 'lodash' import {
endsWith,
findLastIndex,
get,
isEmpty,
join,
lastIndexOf,
remove,
size,
slice,
sortedIndexBy,
split,
sumBy,
toUpper,
uniq,
} from 'lodash'
import { import {
AddHashField, AddHashField,
AddListItem, AddListItem,
@ -803,20 +818,27 @@ const useConnectionStore = defineStore('connections', {
* @return {DatabaseItem|null} * @return {DatabaseItem|null}
*/ */
getNode(key) { getNode(key) {
const matches = key.match(/^(?<server>\w+)(?:\/db(?<db>\d+))?(?:#(?<key>[\w/]+))?$/) const p1 = split(key, '#', 1)
if (matches) { let redisKey = null
const { server, db, key } = matches.groups // parse server and db index
if (db != null) { const idx = p1[0].lastIndexOf('/db')
const dbIndex = parseInt(db) if (idx < 0) {
const nodeMap = this._getNodeMap(server, dbIndex) return null
if (key != null) { }
return nodeMap.get(key) const server = p1[0].substring(0, idx)
} else { const db = parseInt(p1[0].substring(idx + 3))
return this.databases[server][dbIndex] if (isNaN(db)) {
} return null
} }
if (size(p1) > 1) {
// contains redis key
redisKey = p1[1]
const nodeMap = this._getNodeMap(server, db)
return nodeMap.get(key)
} else {
return this.databases[server][db]
} }
return null
}, },
/** /**