manager/orion-visor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 同步终端交互配置项.

Browse Source
This commit is contained in:
lijiahangmax
2024-01-12 00:30:18 +08:00
parent cacc7de364
commit 6c0ad50b4e
7 changed files with 103 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
orion-ops-ui/src/views/host/terminal/components/view-setting/block-setting-item.vue
View File

@@ -64,5 +64,8 @@
:deep(.arco-input-wrapper) {
background-color: var(--color-fill-3)
}
:deep(.arco-select) {
background-color: var(--color-fill-3)
}
}
</style>

42
orion-ops-ui/src/views/host/terminal/components/view-setting/terminal-interact-block.vue
View File

@@ -14,9 +14,7 @@
<!-- 快速滚动 -->
<block-setting-item label="快速滚动" desc="alt + 鼠标滚轮快速滚动">
<a-switch type="round"
v-model="formModel.fastScrollModifier"
checked-value="alt"
unchecked-value="none" />
v-model="formModel.fastScrollModifier" />
</block-setting-item>
<!-- 点击移动光标 -->
<block-setting-item label="点击移动光标" desc="alt + 鼠标左键可以切换光标位置">
@@ -57,7 +55,7 @@
<!-- 启用右键菜单 -->
<block-setting-item label="启用右键菜单" desc="右键终端将打开自定义菜单, 启用后需要关闭右键粘贴">
<a-switch type="round"
v-model="formModel.pasteAutoTrim" />
v-model="formModel.enableRightClickMenu" />
</block-setting-item>
</a-row>
<a-row class="mb16" align="stretch" :gutter="16">
@@ -67,7 +65,7 @@
v-model="formModel.enableBell" />
</block-setting-item>
<!-- 单词分隔符 -->
<block-setting-item label="单词分隔符" desc="在终端中双击文本将使用该分隔符进行分割">
<block-setting-item label="单词分隔符" desc="在终端中双击文本将使用该分隔符进行分割 (一般不用修改)">
<a-input size="small"
v-model="formModel.wordSeparator"
placeholder="单词分隔符"
@@ -85,26 +83,24 @@
</script>
<script lang="ts" setup>
// 快速滚动 fastScrollModifier
// 点击移动光标 altClickMovesCursor
// 右键选中词条 rightClickSelectsWord
// 自动将选中内容复制到剪切板 selectionChangeCopy onSelectionChange
// 复制时删除空格 pasteAutoTrim
// 粘贴时删除空格 copyAutoTrim
// 右键粘贴 rightClickPaste
// 启用右键菜单 enableRightClickMenu
// 启用响铃 enableBell
// 单词分隔符 /\()"'` -.,:;<>~!@#$%^&*|+=[]{}~?│ wordSeparator
import { ref } from 'vue';
import type { TerminalInteractSetting } from '@/store/modules/terminal/types';
import { ref, watch } from 'vue';
import { useTerminalStore } from '@/store';
import { PreferenceItem } from '@/store/modules/terminal';
import BlockSettingItem from './block-setting-item.vue';
const formModel = ref<Record<string, any>>({});
const { preference, updateTerminalPreference } = useTerminalStore();
const formModel = ref<TerminalInteractSetting>({ ...preference.interactSetting });
// 监听内容变化
watch(formModel, (v) => {
if (!v) {
return;
}
// 同步
updateTerminalPreference(PreferenceItem.INTERACT_SETTING, formModel.value, true);
}, { deep: true });
</script>

30
orion-ops-ui/src/views/host/terminal/components/view-setting/terminal-plugins-block.vue
View File

@@ -10,11 +10,9 @@
<div class="terminal-setting-body setting-body">
<a-row class="mb16" align="stretch" :gutter="16">
<!-- 超链接插件 -->
<block-setting-item label="超链接插件" desc="自动检测 http url 并可以点击">
<block-setting-item label="超链接插件" desc="自动检测 http(https) url 并可以点击">
<a-switch type="round"
v-model="formModel.enableWeblinkPlugin"
checked-value="alt"
unchecked-value="none" />
v-model="formModel.enableWeblinkPlugin" />
</block-setting-item>
<!-- WebGL 渲染插件 -->
<block-setting-item label="WebGL 渲染插件" desc="使用 WebGL 加速渲染终端 (建议开启, 若无法开启终端请关闭)">
@@ -40,16 +38,24 @@
</script>
<script lang="ts" setup>
// fixme
// 自动检测 url 并可以点击 enableWeblinkPlugin
// 启用 webgl 支持 enableWebglPlugin
// 支持显示图片 使用 sixel 打开图片 enableImagePlugin
import { ref } from 'vue';
import type { TerminalPluginsSetting } from '@/store/modules/terminal/types';
import { ref, watch } from 'vue';
import { useTerminalStore } from '@/store';
import { PreferenceItem } from '@/store/modules/terminal';
import BlockSettingItem from './block-setting-item.vue';
const formModel = ref<Record<string, any>>({});
const { preference, updateTerminalPreference } = useTerminalStore();
const formModel = ref<TerminalPluginsSetting>({ ...preference.pluginsSetting });
// 监听内容变化
watch(formModel, (v) => {
if (!v) {
return;
}
// 同步
updateTerminalPreference(PreferenceItem.PLUGINS_SETTING, formModel.value, true);
}, { deep: true });
</script>

25
orion-ops-ui/src/views/host/terminal/components/view-setting/terminal-session-block.vue
View File

@@ -22,7 +22,7 @@
size="small"
:min="1"
:max="10000"
placeholder="缓冲区行数"
placeholder="缓冲区行数 默认 1000 行"
allow-clear
hide-button />
</block-setting-item>
@@ -38,19 +38,26 @@
</script>
<script lang="ts" setup>
import type { TerminalSessionSetting } from '@/store/modules/terminal/types';
import { ref, watch } from 'vue';
import { useDictStore, useTerminalStore } from '@/store';
import { PreferenceItem } from '@/store/modules/terminal';
import { terminalEmulationTypeKey } from '../../types/terminal.const';
import BlockSettingItem from './block-setting-item.vue';
const { toOptions } = useDictStore();
const { preference, updateTerminalPreference } = useTerminalStore();
// TODO
// terminalEmulationType: xterm 256color
// scrollBackLine 保存在缓冲区的行数 1000
const formModel = ref<TerminalSessionSetting>({ ...preference.sessionSetting });
import { ref } from 'vue';
import BlockSettingItem from './block-setting-item.vue';
import { useDictStore } from '@/store';
const formModel = ref<Record<string, any>>({});
// 监听内容变化
watch(formModel, (v) => {
if (!v) {
return;
}
// 同步
updateTerminalPreference(PreferenceItem.SESSION_SETTING, formModel.value, true);
}, { deep: true });
</script>