index.ts 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. import hotkeys from "hotkeys-js";
  2. import { ModuleControl } from "queenjs";
  3. import { EditorModule } from "../../module";
  4. type IHotKeyItem = {
  5. hotKey: string;
  6. action: (this: EditorModule, key: string) => void;
  7. };
  8. export class HotKeyCtrl extends ModuleControl<EditorModule> {
  9. // 热键配置
  10. hotKeys = this.defineHotKeys([
  11. // 取消选中
  12. {
  13. hotKey: "esc",
  14. action() {
  15. this.actions.pickComp("");
  16. },
  17. },
  18. // 切换到父组件
  19. {
  20. hotKey: "ctrl+up",
  21. action() {
  22. this.actions.pickParentComp(this.store.currCompId);
  23. },
  24. },
  25. // 删除当前组件
  26. {
  27. hotKey: "Backspace,del",
  28. action() {
  29. this.actions.removeComp(this.store.currCompId);
  30. },
  31. },
  32. {
  33. hotKey: "q,w,a,s,d,e",
  34. action(key) {
  35. // this.actions.removeComp(this.store.currCompId);
  36. // console.log("image hot key down", key);
  37. this.actions.handleImageHotKey(key);
  38. },
  39. },
  40. // 回退
  41. {
  42. hotKey: "ctrl+z",
  43. action() {
  44. if (!this.controls.historyCtrl.state.enable) return;
  45. this.controls.historyCtrl.history.undo();
  46. },
  47. },
  48. // 重做
  49. {
  50. hotKey: "ctrl+shift+z",
  51. action() {
  52. if (!this.controls.historyCtrl.state.enable) return;
  53. this.controls.historyCtrl.history.redo();
  54. },
  55. }, //移动
  56. {
  57. hotKey: "up,down,left,right",
  58. action(key) {
  59. console.log("move key down", key);
  60. this.actions.handleSelectMoving(key);
  61. },
  62. },
  63. ]);
  64. init() {
  65. const { module, hotKeys } = this;
  66. hotkeys(
  67. hotKeys.map((d) => d.hotKey).join(","),
  68. module.moduleName,
  69. function (event, handler) {
  70. event.preventDefault();
  71. const hotAct = hotKeys.find((d) =>
  72. d.hotKey.split(",").includes(handler.key)
  73. );
  74. hotAct?.action.call(module, handler.key);
  75. }
  76. );
  77. hotkeys.setScope(module.moduleName);
  78. }
  79. destroy() {
  80. hotkeys.deleteScope(this.module.moduleName);
  81. }
  82. defineHotKeys<T extends IHotKeyItem[]>(hotKeys: T) {
  83. return hotKeys;
  84. }
  85. }