Browse Source

菜单支持显示快捷键

master
Cmen 3 years ago
parent
commit
84c64a4022
  1. 29
      src/editor/Menu/File.tsx
  2. 6
      src/editor/Menu/MenuGroup.tsx
  3. 6
      src/editor/Menu/style.less
  4. 3
      src/store/GlobalController.ts

29
src/editor/Menu/File.tsx

@ -7,10 +7,31 @@ const FileMenu = () => {
{...{ {...{
name: "文件", name: "文件",
items: [ items: [
{ name: "打开GeoJSON", onClick: globalController.openGeoJSON }, {
{ name: "打开工程", onClick: globalController.openProject }, name: "打开GeoJSON",
{ name: "保存GeoJSON", onClick: globalController.saveGeoJSON }, onClick: globalController.openGeoJSON,
{ name: "保存工程", onClick: globalController.saveProject }, hotkey: "Alt+O",
},
{
name: "打开工程",
onClick: globalController.openProject,
hotkey: "Ctrl+O",
},
{
name: "暂存工程",
onClick: globalController.saveTemp,
hotkey: "Alt+S",
},
{
name: "保存GeoJSON",
onClick: globalController.saveGeoJSON,
hotkey: "Ctrl+S",
},
{
name: "保存工程",
onClick: globalController.saveProject,
hotkey: "Ctrl+Alt+S",
},
], ],
}} }}
/> />

6
src/editor/Menu/MenuGroup.tsx

@ -3,6 +3,7 @@ import { Menu, Dropdown } from "antd";
export type MenuItemConfig = { export type MenuItemConfig = {
name: string; name: string;
onClick: () => void; onClick: () => void;
hotkey?: string;
}; };
export type MenuConfig = { export type MenuConfig = {
@ -14,15 +15,16 @@ const MenuGroup = (props: MenuConfig) => {
const menu = ( const menu = (
<Menu> <Menu>
{props.items.map((item, index) => ( {props.items.map((item, index) => (
<Menu.Item key={index} onClick={item.onClick}> <Menu.Item key={index} onClick={item.onClick} className="menu-item">
{item.name} {item.name}
<span className="menu-item-hot-key">{item.hotkey}</span>
</Menu.Item> </Menu.Item>
))} ))}
</Menu> </Menu>
); );
return ( return (
<Dropdown overlay={menu} trigger={["click"]}> <Dropdown overlay={menu}>
<span className="menu-title">{props.name}</span> <span className="menu-title">{props.name}</span>
</Dropdown> </Dropdown>
); );

6
src/editor/Menu/style.less

@ -1,3 +1,9 @@
.menu-title{ .menu-title{
cursor: pointer; cursor: pointer;
}
.menu-item{
width: 240px;
}
.menu-item-hot-key{
float: right;
} }

3
src/store/GlobalController.ts

@ -80,6 +80,7 @@ export class GlobelController implements IGlobalController {
} }
private _registerHotkeys() { private _registerHotkeys() {
// 保存
registerHotkey("s", { callback: this.saveGeoJSON, ctrl: true }); registerHotkey("s", { callback: this.saveGeoJSON, ctrl: true });
registerHotkey("s", { registerHotkey("s", {
callback: this.saveProject, callback: this.saveProject,
@ -87,7 +88,9 @@ export class GlobelController implements IGlobalController {
alt: true, alt: true,
}); });
registerHotkey("s", { callback: this.saveTemp, alt: true }); registerHotkey("s", { callback: this.saveTemp, alt: true });
// 清空
registerHotkey("c", { callback: this.clearEditor, alt: true }); registerHotkey("c", { callback: this.clearEditor, alt: true });
//
registerHotkey("o", { callback: this.openGeoJSON, alt: true }); registerHotkey("o", { callback: this.openGeoJSON, alt: true });
registerHotkey("o", { registerHotkey("o", {
callback: this.openProject, callback: this.openProject,

Loading…
Cancel
Save