diff --git a/package.json b/package.json index a7d2d12c8..5cdb8ccc4 100644 --- a/package.json +++ b/package.json @@ -90,9 +90,9 @@ "worker-loader": "^3.0.8" }, "dependencies": { - "@blueprintjs/core": "^3.50.2", - "@blueprintjs/popover2": "^0.12.2", - "@blueprintjs/table": "^3.9.2", + "@blueprintjs/core": "^3.51.0", + "@blueprintjs/popover2": "^0.12.5", + "@blueprintjs/table": "^3.9.9", "@types/react-virtualized-auto-sizer": "^1.0.1", "@types/react-window": "^1.8.5", "blueimp-md5": "^2.19.0", diff --git a/src/UI/Components/Common/Confirm.tsx b/src/UI/Components/Common/Confirm.tsx index a70e0cdc0..5ac8bec18 100644 --- a/src/UI/Components/Common/Confirm.tsx +++ b/src/UI/Components/Common/Confirm.tsx @@ -1,32 +1,33 @@ -import { Alert, Button, Card, Classes, Intent, Overlay } from '@blueprintjs/core'; +import { Alert, Button, Card, Classes, Intent, Keys, Overlay } from '@blueprintjs/core'; import { observer } from 'mobx-react'; import * as React from 'react'; import * as ReactDOM from 'react-dom'; -import { KeyBoard } from '../../../Common/KeyEnum'; class Confirm { private _container: HTMLDivElement; - constructor() + private constructor() { - let container = document.createElement('div'); - container.className = "confirm"; - document.body.append(container); - this._container = container; + this._container = document.createElement('div'); + this._container.className = "confirm"; } - static CreateConfirm() + + private static _SingleInstance: Confirm; + static GetInstance(): Confirm { - return new Confirm(); + if (this._SingleInstance) return this._SingleInstance; + this._SingleInstance = new Confirm; + return this._SingleInstance; } + close() { ReactDOM.unmountComponentAtNode(this._container); - this._container.remove(); } async show(option: { message: string | string[]; hasCancel?: boolean; }): Promise { - return new Promise((res: (boolean) => void) => + return new Promise((res: (ok: boolean) => void) => { ReactDOM.render( this.close()} />, this._container); }); @@ -60,11 +61,13 @@ export class CommonConfirm extends React.Component }; componentDidMount() { - document.addEventListener('keydown', this.handleKeydown); + document.addEventListener('keydown', this.keydown, true); + document.addEventListener("keyup", this.keyup, true); } componentWillUnmount() { - document.removeEventListener('keydown', this.handleKeydown); + document.removeEventListener('keydown', this.keydown, true); + document.addEventListener("keyup", this.keyup, true); } render() { @@ -72,6 +75,7 @@ export class CommonConfirm extends React.Component icon="warning-sign" isOpen={true} confirmButtonText="确认" + canEscapeKeyCancel={true} cancelButtonText={this.props.hasCancel ? "取消" : ""} intent={Intent.SUCCESS} onConfirm={this.confirm} @@ -92,18 +96,27 @@ export class CommonConfirm extends React.Component this.props.res(false); this.props.close(); }; - private handleKeydown = (e: KeyboardEvent) => + + //因为WebCAD在按键按下时就响应命令,又因为blueprint响应了按键弹起的时间,导致我们响应完命令后,弹起空格后响应了blueprint的点击事件,为了使我们按下按键立即响应的机制成立,我们hack了blueprint.现在blueprint的这个UI也不会响应按键抬起,同时键盘按下时也立即响应确认(无法用空格或者回车响应取消) + private keydown = (e: KeyboardEvent) => { - e.stopPropagation(); - if (e.keyCode === KeyBoard.Escape) - { - this.cancel(); - } - else if (e.keyCode === KeyBoard.Enter) + if (Keys.isKeyboardClick(e.keyCode)) { + e.preventDefault(); + e.stopPropagation(); + this.confirm(); } }; + + private keyup(e: KeyboardEvent) + { + if (Keys.isKeyboardClick(e.keyCode)) + { + e.preventDefault(); + e.stopPropagation(); + } + } } @@ -118,6 +131,20 @@ interface ICommonOverLayProps class CommonOverLay extends React.Component { + //避免响应按键到inputhint + componentDidMount() + { + document.addEventListener('keydown', this.keydown); + } + componentWillUnmount() + { + document.removeEventListener('keydown', this.keydown); + } + keydown = (e: KeyboardEvent) => + { + e.stopPropagation(); + }; + renderMessage = () => { if (typeof this.props.message === 'string') @@ -172,5 +199,4 @@ class CommonOverLay extends React.Component } } - -export const AppConfirm = Confirm.CreateConfirm(); +export const AppConfirm = Confirm.GetInstance(); diff --git a/src/UI/Components/SourceManage/ReplaceOrRename.tsx b/src/UI/Components/SourceManage/ReplaceOrRename.tsx index e900bed3f..77f54c7f0 100644 --- a/src/UI/Components/SourceManage/ReplaceOrRename.tsx +++ b/src/UI/Components/SourceManage/ReplaceOrRename.tsx @@ -10,6 +10,22 @@ interface Operation cancel?: () => void; } export class ReplaceOrRename extends React.Component{ + + //避免响应按键到inputhint + componentDidMount() + { + document.addEventListener('keydown', this.keydown); + } + componentWillUnmount() + { + document.removeEventListener('keydown', this.keydown); + } + keydown = (e: KeyboardEvent) => + { + if (this.props.isOpen) + e.stopPropagation(); + }; + render() { return ( @@ -47,6 +63,7 @@ export class ReplaceOrRename extends React.Component{