!207 命令面板：呼出时滚动到上一次选择，失去焦点后消失

Merge pull request !207 from 肖诗雅/cmdPanel_restore

src/DatabaseServices/CommandServer.ts

@@ -32,4 +32,19 @@ export class CommandServer
         let store = await IndexedDbStore.CADStore();
         return await store.Get(StoreName.Command, c) as ICommand;
     }
+
+    //保存滚动条高度
+    m_LastScrollTop: number;
+    async SetLastScrollTop(scrollTop: number)
+    {
+        this.m_LastScrollTop = scrollTop;
+        let store = await IndexedDbStore.CADStore();
+        store.Put(StoreName.FileId, "scrollTop", scrollTop);
+    }
+    async GetLastScrollTop()
+    {
+        let store = await IndexedDbStore.CADStore();
+        this.m_LastScrollTop = await store.Get(StoreName.FileId, "scrollTop");
+        return this.m_LastScrollTop;
+    }
 }

src/UI/Components/CommandPanel/commandPanel.tsx

@@ -6,6 +6,8 @@ import { ICommand, CommandList } from './CommandList';
 import { CommandItem } from './CommandItem';
 import { Singleton } from '../../../Common/Singleton';
 import { CommandServer } from '../../../DatabaseServices/CommandServer';
+import { app } from '../../../ApplicationServices/Application';
+import { end } from 'xaop';
 
 interface CommandPanelState
 {
@@ -35,10 +37,28 @@ export class CommandPanel extends React.Component<{}, CommandPanelState>
             ]
         };
     }
+    //获取最后一次滚动条位置
+    GetLastScrollTop()
+    {
+        let cserver = Singleton.GetInstance(CommandServer);
+        if (cserver.m_LastScrollTop)
+            this.scrollCard.scrollTop = cserver.m_LastScrollTop;
+    }
+    componentDidUpdate()
+    {
+        this.GetLastScrollTop();
+    }
     componentDidMount()
     {
         this.initCommandData();
         this.inputEl.focus();
+        this.GetLastScrollTop();
+        app.m_Editor.m_MaskManage.events.push(
+            end(app.m_Editor.m_MaskManage, app.m_Editor.m_MaskManage.OnFocusEvent, () =>
+            {
+                app.m_Editor.m_ModalManage.Clear();
+            })
+        )
     }
     async initCommandData()
     {
@@ -54,11 +74,13 @@ export class CommandPanel extends React.Component<{}, CommandPanelState>
             this.searchList.push(c);
         }
     }
-    handleTabsClick = () =>
+    handleTabsClick = async () =>
     {
+        let cserver = Singleton.GetInstance(CommandServer);
         let elc = this.ulRef.querySelector(`#${this.id}`) as HTMLElement;
         if (elc)
             this.scrollCard.scrollTop = elc.offsetTop - elc.offsetHeight * 2 - 55;
+        await cserver.SetLastScrollTop(this.scrollCard.scrollTop);
     }
     render()
     {
@@ -138,10 +160,12 @@ export class CommandPanel extends React.Component<{}, CommandPanelState>
                         <div
                             ref={el => this.scrollCard = el}
                             className="bp3-card bp3-elevation-0"
-                            onScroll={() =>
+                            onScroll={async () =>
                             {
+                                let cserver = Singleton.GetInstance(CommandServer);
                                 let index = Math.floor(this.scrollCard.scrollTop / 60);
                                 this.id = this.searchRes[index].typeId;
+                                await cserver.SetLastScrollTop(this.scrollCard.scrollTop);
                             }}
                         >
                             <ul className={Classes.LIST_UNSTYLED}

src/UI/Components/Modal/MaskManage.tsx

@@ -7,6 +7,7 @@
 export class MaskManage
 {
     public m_Masking: HTMLElement;
+    events: Function[] = [];
     constructor()
     {
         //蒙版层
@@ -48,5 +49,7 @@ export class MaskManage
         this.m_Masking.style.display = "none";
         this.m_Masking.style.opacity = "0.3";
         this.m_Masking.style.zIndex = "0";
+        this.events.forEach(f => f());
+        this.events.length = 0;
     }
 }

src/UI/Components/Modal/ModalStyle/CommandModal.less

@@ -1,3 +1,7 @@
+#commandPanel .bp3-dialog
+{
+    margin-bottom: 0;
+}
 #commandPanel .bp3-dialog-body
 {
     display: flex;