From ce1b9b706f1e71398246ec0e039ec2d3b5a05903 Mon Sep 17 00:00:00 2001
From: Lykin <137850705+tiny-craft@users.noreply.github.com>
Date: Sat, 3 Feb 2024 15:24:18 +0800
Subject: [PATCH] perf: add drag and drop text option in preferences. #140
---
backend/types/preferences.go | 2 +
.../content_value/ContentEditor.vue | 42 ++++---------------
.../content_value/ContentEntryEditor.vue | 4 --
.../content_value/ContentValueString.vue | 4 --
.../components/dialogs/PreferencesDialog.vue | 10 ++++-
frontend/src/langs/en-us.json | 3 +-
frontend/src/langs/zh-cn.json | 3 +-
frontend/src/stores/preferences.js | 9 ++++
8 files changed, 33 insertions(+), 44 deletions(-)
diff --git a/backend/types/preferences.go b/backend/types/preferences.go
index 4646974..fc6bb8b 100644
--- a/backend/types/preferences.go
+++ b/backend/types/preferences.go
@@ -29,6 +29,7 @@ func NewPreferences() Preferences {
FontSize: consts.DEFAULT_FONT_SIZE,
ShowLineNum: true,
ShowFolding: true,
+ DropText: true,
},
Cli: PreferencesCli{
FontSize: consts.DEFAULT_FONT_SIZE,
@@ -67,6 +68,7 @@ type PreferencesEditor struct {
FontSize int `json:"fontSize" yaml:"font_size"`
ShowLineNum bool `json:"showLineNum" yaml:"show_line_num"`
ShowFolding bool `json:"showFolding" yaml:"show_folding"`
+ DropText bool `json:"dropText" yaml:"drop_text"`
}
type PreferencesCli struct {
diff --git a/frontend/src/components/content_value/ContentEditor.vue b/frontend/src/components/content_value/ContentEditor.vue
index eeaa696..3986bbb 100644
--- a/frontend/src/components/content_value/ContentEditor.vue
+++ b/frontend/src/components/content_value/ContentEditor.vue
@@ -18,14 +18,6 @@ const props = defineProps({
loading: {
type: Boolean,
},
- showLineNum: {
- type: Boolean,
- default: true,
- },
- showFolding: {
- type: Boolean,
- default: true,
- },
border: {
type: Boolean,
default: false,
@@ -63,13 +55,14 @@ onMounted(async () => {
// value: props.content,
theme: pref.isDark ? 'rdm-dark' : 'rdm-light',
language: props.language,
- lineNumbers: props.showLineNum ? 'on' : 'off',
+ lineNumbers: pref.showLineNum ? 'on' : 'off',
readOnly: readonlyValue.value,
colorDecorators: true,
accessibilitySupport: 'off',
wordWrap: 'on',
tabSize: 2,
- folding: props.showFolding !== false,
+ folding: pref.showFolding,
+ dragAndDrop: pref.dropText,
fontFamily,
fontSize,
scrollBeyondLastLine: false,
@@ -151,37 +144,20 @@ watch(
)
watch(
- () => pref.editorFont,
- ({ fontSize, fontFamily }) => {
+ () => pref.editor,
+ ({ showLineNum = true, showFolding = true, dropText = true }) => {
if (editorNode != null) {
+ const { fontSize, fontFamily } = pref.editorFont
editorNode.updateOptions({
fontSize,
fontFamily,
- })
- }
- },
-)
-
-watch(
- () => pref.showLineNum,
- (showLineNum) => {
- if (editorNode != null) {
- editorNode.updateOptions({
lineNumbers: showLineNum ? 'on' : 'off',
+ folding: showFolding,
+ dragAndDrop: dropText,
})
}
},
-)
-
-watch(
- () => pref.showFolding,
- (showFolding) => {
- if (editorNode != null) {
- editorNode.updateOptions({
- folding: showFolding !== false,
- })
- }
- },
+ { deep: true },
)
onUnmounted(() => {
diff --git a/frontend/src/components/content_value/ContentEntryEditor.vue b/frontend/src/components/content_value/ContentEntryEditor.vue
index 9c14b38..6989d6a 100644
--- a/frontend/src/components/content_value/ContentEntryEditor.vue
+++ b/frontend/src/components/content_value/ContentEntryEditor.vue
@@ -12,7 +12,6 @@ import WindowClose from '@/components/icons/WindowClose.vue'
import Pin from '@/components/icons/Pin.vue'
import OffScreen from '@/components/icons/OffScreen.vue'
import ContentEditor from '@/components/content_value/ContentEditor.vue'
-import usePreferencesStore from 'stores/preferences.js'
import { toString } from 'lodash'
const props = defineProps({
@@ -47,7 +46,6 @@ const props = defineProps({
const themeVars = useThemeVars()
const browserStore = useBrowserStore()
-const prefStore = usePreferencesStore()
const emit = defineEmits([
'update:field',
'update:value',
@@ -176,8 +174,6 @@ const onSave = () => {
:border="true"
:content="displayValue"
:language="viewLanguage"
- :show-folding="prefStore.showFolding"
- :show-line-num="prefStore.showLineNum"
class="flex-item-expand"
@input="onInput"
@reset="onInput"
diff --git a/frontend/src/components/content_value/ContentValueString.vue b/frontend/src/components/content_value/ContentValueString.vue
index e2534fd..8ded850 100644
--- a/frontend/src/components/content_value/ContentValueString.vue
+++ b/frontend/src/components/content_value/ContentValueString.vue
@@ -12,7 +12,6 @@ import useBrowserStore from 'stores/browser.js'
import { decodeRedisKey } from '@/utils/key_convert.js'
import FormatSelector from '@/components/content_value/FormatSelector.vue'
import ContentEditor from '@/components/content_value/ContentEditor.vue'
-import usePreferencesStore from 'stores/preferences.js'
import { formatBytes } from '@/utils/byte_convert.js'
const props = defineProps({
@@ -35,7 +34,6 @@ const props = defineProps({
const i18n = useI18n()
const themeVars = useThemeVars()
-const prefStore = usePreferencesStore()
/**
*
@@ -205,8 +203,6 @@ defineExpose({
:content="displayValue"
:language="viewLanguage"
:loading="props.loading"
- :show-folding="prefStore.showFolding"
- :show-line-num="prefStore.showLineNum"
class="flex-item-expand"
style="height: 100%"
@input="onInput"
diff --git a/frontend/src/components/dialogs/PreferencesDialog.vue b/frontend/src/components/dialogs/PreferencesDialog.vue
index a5d5381..2860744 100644
--- a/frontend/src/components/dialogs/PreferencesDialog.vue
+++ b/frontend/src/components/dialogs/PreferencesDialog.vue
@@ -181,6 +181,7 @@ const onClose = () => {
placement="left"
tab-style="justify-content: right; font-weight: 420;"
type="line">
+
@@ -257,6 +258,7 @@ const onClose = () => {
+
@@ -294,10 +296,16 @@ const onClose = () => {
{{ $t('preferences.editor.show_folding') }}
+
+
+ {{ $t('preferences.editor.drop_text') }}
+
+
+
@@ -339,7 +347,7 @@ const onClose = () => {
-
+
diff --git a/frontend/src/langs/en-us.json b/frontend/src/langs/en-us.json
index 893dd61..4de4775 100644
--- a/frontend/src/langs/en-us.json
+++ b/frontend/src/langs/en-us.json
@@ -54,7 +54,8 @@
"editor": {
"name": "Editor",
"show_linenum": "Show Line Numbers",
- "show_folding": "Enable Code Folding"
+ "show_folding": "Enable Code Folding",
+ "drop_text": "Allow Drag and Drop Text"
},
"cli": {
"name": "Command Line",
diff --git a/frontend/src/langs/zh-cn.json b/frontend/src/langs/zh-cn.json
index 858bcd3..cf3dca3 100644
--- a/frontend/src/langs/zh-cn.json
+++ b/frontend/src/langs/zh-cn.json
@@ -54,7 +54,8 @@
"editor": {
"name": "编辑器",
"show_linenum": "显示行号",
- "show_folding": "启用代码折叠"
+ "show_folding": "启用代码折叠",
+ "drop_text": "允许拖放文本"
},
"cli": {
"name": "命令行",
diff --git a/frontend/src/stores/preferences.js b/frontend/src/stores/preferences.js
index 85fc01a..06dc119 100644
--- a/frontend/src/stores/preferences.js
+++ b/frontend/src/stores/preferences.js
@@ -58,6 +58,7 @@ const usePreferencesStore = defineStore('preferences', {
fontSize: 14,
showLineNum: true,
showFolding: true,
+ dropText: true,
},
cli: {
fontFamily: [],
@@ -254,6 +255,10 @@ const usePreferencesStore = defineStore('preferences', {
return get(this.editor, 'showFolding', true)
},
+ dropText() {
+ return get(this.editor, 'dropText', true)
+ },
+
keyIconType() {
return get(this.general, 'keyIconStyle', typesIconStyle.SHORT)
},
@@ -283,6 +288,10 @@ const usePreferencesStore = defineStore('preferences', {
if (showFolding === undefined) {
set(data, 'editor.showFolding', true)
}
+ const dropText = get(data, 'editor.dropText')
+ if (dropText === undefined) {
+ set(data, 'editor.dropText', true)
+ }
i18nGlobal.locale.value = this.currentLanguage
}
},