1
1
mirror of https://github.com/Fabio286/antares.git synced 2025-06-05 21:59:22 +02:00

feat: list of available shortcuts in settings window

This commit is contained in:
2022-08-08 16:44:40 +02:00
parent 8bb5bb93cf
commit 44bb75bc60
4 changed files with 110 additions and 29 deletions

View File

@ -289,6 +289,9 @@
</div>
</div>
<div v-show="selectedTab === 'shortcuts'" class="panel-body py-4">
<ModalSettingsShortcuts />
</div>
<div v-show="selectedTab === 'update'" class="panel-body py-4">
<ModalSettingsUpdate />
</div>
@ -333,6 +336,7 @@ import { useFocusTrap } from '@/composables/useFocusTrap';
import { localesNames } from '@/i18n/supported-locales';
import ModalSettingsUpdate from '@/components/ModalSettingsUpdate.vue';
import ModalSettingsChangelog from '@/components/ModalSettingsChangelog.vue';
import ModalSettingsShortcuts from '@/components/ModalSettingsShortcuts.vue';
import BaseTextEditor from '@/components/BaseTextEditor.vue';
import BaseSelect from '@/components/BaseSelect.vue';
import { AvailableLocale } from '@/i18n';

View File

@ -0,0 +1,65 @@
<template>
<div class="p-relative">
<div class="container workspace-query-results">
<div class="table table-hover">
<div class="thead">
<div class="tr text-uppercase">
<div class="th no-border">
<div>
{{ t('word.event') }}
</div>
</div>
<div class="th no-border" style="width: 100%">
<div>
{{ t('word.key', 2) }}
</div>
</div>
</div>
</div>
<div class="tbody">
<div
v-for="(shortcut, i) in shortcuts"
:key="i"
class="tr"
tabindex="0"
>
<div class="td py-1">
{{ shortcut.description }}
</div>
<div class="td py-1" v-html="parseKeys(shortcut.keys)" />
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
import { useSettingsStore } from '@/stores/settings';
const { t } = useI18n();
const isMacOS = process.platform === 'darwin';
const settingsStore = useSettingsStore();
const { shortcuts } = storeToRefs(settingsStore);
const parseKeys = (keys: {[key: number]: string}[]) => {
return (keys as string[]).map(k => (
k.split('+')
.map(sk => (
`<code class="text-bold">${sk}</code>`
)))
.join('+')
.replaceAll('CommandOrControl', isMacOS ? 'CMD' : 'CTRL')
).join(', ');
};
</script>
<style scoped>
.table .td {
border-right: 3px solid;
border-bottom: 3px solid;
}
</style>