feat: set shortcuts

Author: Novout

packages/app/src/components/page/editor/project/preferences/container/EditorProjectPreferencesContainerKeyboard.vue

@@ -75,33 +75,46 @@
       <EditorProjectPreferencesKeyboardItem
         :title="t('editor.aside.configuration.autosave')"
         shortcut="CTRL + S"
-      />
+      >
+        <InputBoolean v-model="SHORTCUTS.ctrlS"  />
+      </EditorProjectPreferencesKeyboardItem>
       <EditorProjectPreferencesKeyboardItem
         :title="t('editor.aside.configuration.cloudAutosave')"
         shortcut="CTRL + SHIFT + S"
       />
       <EditorProjectPreferencesKeyboardItem
         :title="t('editor.bar.pdf.generate')"
         shortcut="CTRL + SHIFT + P"
-      />
+      >
+      <InputBoolean v-model="SHORTCUTS.ctrlShiftP"  />
+    </EditorProjectPreferencesKeyboardItem>
       <EditorProjectPreferencesKeyboardItem
         :title="t('editor.bar.epub.generate')"
         shortcut="CTRL + SHIFT + E"
-      />
+      >
+      <InputBoolean v-model="SHORTCUTS.ctrlShiftE"  />
+      </EditorProjectPreferencesKeyboardItem>
       <EditorProjectPreferencesKeyboardItem
         :title="t('editor.bar.html.generate')"
         shortcut="CTRL + SHIFT + H"
-      />
+      >
+        <InputBoolean v-model="SHORTCUTS.ctrlShiftH"  />
+      </EditorProjectPreferencesKeyboardItem>
       <EditorProjectPreferencesKeyboardItem
         :title="t('editor.bar.txt.generate')"
         shortcut="CTRL + SHIFT + T"
-      />
+      >
+        <InputBoolean v-model="SHORTCUTS.ctrlShiftT"  />
+      </EditorProjectPreferencesKeyboardItem>
     </div>
   </EditorProjectPreferencesContainerSlot>
 </template>
 
 <script setup lang="ts">
+  import { useShortcutsStore } from '@/store/shortcuts'
   import { useI18n } from 'vue-i18n'
 
+  const SHORTCUTS = useShortcutsStore()
+
   const { t } = useI18n()
 </script>

packages/app/src/components/page/editor/project/preferences/keyboard/EditorProjectPreferencesKeyboardItem.vue

@@ -3,9 +3,12 @@
     class="flex flex-row font-bold justify-between text-theme-text-2 items-center w-full my-2"
   >
     <h3>{{ props.title }}</h3>
-    <p class="px-2 py-1 rounded-full text-theme-text-2 shadow-lg w-24">
-      {{ props.shortcut }}
-    </p>
+    <div class="flex items-center gap-4">
+      <p class="px-2 py-1 rounded-full text-theme-text-2 shadow-lg w-24">
+        {{ props.shortcut }}
+      </p>
+      <slot ></slot>
+    </div>
   </div>
 </template>
 

packages/app/src/use/storage/storage.ts

@@ -16,13 +16,15 @@ import { useDefines } from '../defines'
 import { useDOCXStore } from '@/store/docx'
 import { useUtils } from '../utils'
 import { useI18n } from 'vue-i18n'
+import { useShortcutsStore } from '@/store/shortcuts'
 
 export const useStorage = () => {
   const PROJECT = useProjectStore()
   const CONTEXT = useContextStore()
   const EDITOR = useEditorStore()
   const PDF = usePDFStore()
   const DOCX = useDOCXStore()
+  const SHORTCUTS = useShortcutsStore()
 
   const env = useEnv()
   const emitter = useEmitter()
@@ -313,6 +315,7 @@ export const useStorage = () => {
         normalize: {},
       },
       docx: DOCX.$state,
+      shortcuts: SHORTCUTS.$state
     }
   }
 

packages/types/src/project.ts

@@ -2,6 +2,7 @@ import { ContextState } from './context'
 import { DOCXState } from './docx'
 import { EditorState } from './editor'
 import { PDFState } from './pdf'
+import { ShortcutsState } from './shortcuts'
 import { ID } from './utils'
 
 export type ProjectType = 'creative' | 'blank' | 'only-annotations'
@@ -208,6 +209,7 @@ export interface ProjectObject {
   editor: EditorState
   pdf: PDFState
   docx: DOCXState
+  shortcuts: ShortcutsState
 }
 
 export interface ProjectStateBetterWrite {