From 34495a4e59babf5c1fae42e0a33baefb0e6d3b49 Mon Sep 17 00:00:00 2001 From: zhangzepeng Date: Wed, 22 Nov 2023 17:25:00 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E2=80=99esc=E9=94=AE=E5=8A=9F=E8=83=BD?= =?UTF-8?q?=E5=88=A0=E9=99=A4=20git=20commit=20-sm=20=E2=80=99esc=E9=94=AE?= =?UTF-8?q?=E5=8A=9F=E8=83=BD=E5=88=A0=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: zhangzepeng --- ide/src/trace/component/SpSystemTrace.ts | 82 +++++++++++------------- 1 file changed, 39 insertions(+), 43 deletions(-) diff --git a/ide/src/trace/component/SpSystemTrace.ts b/ide/src/trace/component/SpSystemTrace.ts index 956d81aa..b7cd2be0 100644 --- a/ide/src/trace/component/SpSystemTrace.ts +++ b/ide/src/trace/component/SpSystemTrace.ts @@ -114,7 +114,7 @@ function dpr() { return window.devicePixelRatio || 1; } - + export class CurrentSlicesTime { startTime: number | undefined; endTime: number | undefined; @@ -204,19 +204,19 @@ export class SpSystemTrace extends BaseElement { set flagList(list: Array) { this._flagList = list; } - //节流处理 - throttle(fn: Function, t: number, ev?: any ): Function { + //节流处理 + throttle(fn: Function, t: number, ev?: any): Function { let timerId: any = null; - return ()=> { + return () => { if (!timerId) { timerId = setTimeout(function () { - if(ev){ - fn(ev); - }else{ + if (ev) { + fn(ev); + } else { fn(); - } + } timerId = null; - }, t); + }, t); this.times.add(timerId); } }; @@ -224,23 +224,23 @@ export class SpSystemTrace extends BaseElement { // 防抖处理 debounce(fn: Function, ms: number, ev?: any): Function { let timerId: undefined | number; - return ()=>{ - if(timerId){ + return () => { + if (timerId) { window.clearTimeout(timerId); - }else{ - timerId = window.setTimeout(()=>{ - if(ev){ - fn(ev); - }else{ + } else { + timerId = window.setTimeout(() => { + if (ev) { + fn(ev); + } else { fn(); - } + } timerId = undefined; }, ms); this.times.add(timerId); } } } - + async makeVsyncLine() { if (this._isVsync) { const range = this.timerShaftEL?.rangeRuler?.range; @@ -2004,11 +2004,11 @@ export class SpSystemTrace extends BaseElement { documentOnKeyDown = (ev: KeyboardEvent) => { document.removeEventListener('keyup', this.documentOnKeyUp); - this.debounce(this.continueSearch , 250 , ev )(); + this.debounce(this.continueSearch, 250, ev)(); document.addEventListener('keyup', this.documentOnKeyUp); }; - documentOnKeyPress = (ev: KeyboardEvent) => { + documentOnKeyPress = (ev: KeyboardEvent) => { if (!this.loadTraceCompleted) return; let keyPress = ev.key.toLocaleLowerCase(); TraceRow.isUserInteraction = true; @@ -2176,7 +2176,7 @@ export class SpSystemTrace extends BaseElement { }; // 一直按着回车键的时候执行搜索功能 - private continueSearch = (ev: KeyboardEvent)=>{ + private continueSearch = (ev: KeyboardEvent) => { if (ev.key === 'Enter') { if (ev.shiftKey) { this.dispatchEvent( @@ -2193,23 +2193,19 @@ export class SpSystemTrace extends BaseElement { }) ); } - } + } } - + documentOnKeyUp = (ev: KeyboardEvent) => { - if(this.times.size > 0){ - for(let timerId of this.times){ - clearTimeout(timerId); - } - } + if (this.times.size > 0) { + for (let timerId of this.times) { + clearTimeout(timerId); + } + } - if(ev.key.toLocaleLowerCase() === '?'){ + if (ev.key.toLocaleLowerCase() === '?') { document.querySelector('body > sp-application')!.shadowRoot!.querySelector('#sp-keyboard')!.style.visibility = 'visible'; } - if(ev.key.toLocaleLowerCase() === 'escape'){ - document.querySelector('body > sp-application')!.shadowRoot!.querySelector('#sp-keyboard')!.style.visibility = 'hidden'; - document.querySelector('body > sp-application')!.shadowRoot!.querySelector('#sp-welcome')!.style.visibility = 'visible'; - } if (!this.loadTraceCompleted) return; let keyPress = ev.key.toLocaleLowerCase(); if (keyPress === 'v') { @@ -2232,24 +2228,24 @@ export class SpSystemTrace extends BaseElement { TraceRow.isUserInteraction = false; this.observerScrollHeightEnable = false; this.keyboardEnable && this.timerShaftEL!.documentOnKeyUp(ev); - if (ev.code == 'Enter') { - document.removeEventListener('keydown', this.documentOnKeyDown); + if (ev.code == 'Enter') { + document.removeEventListener('keydown', this.documentOnKeyDown); if (ev.shiftKey) { this.dispatchEvent( new CustomEvent('previous-data', { - detail: {}, - composed: false, + detail: {}, + composed: false, }) ); } else { this.dispatchEvent( new CustomEvent('next-data', { - detail: {}, - composed: false, + detail: {}, + composed: false, }) ); } - document.addEventListener('keydown', this.documentOnKeyDown); + document.addEventListener('keydown', this.documentOnKeyDown); } if (ev.ctrlKey) { @@ -3796,7 +3792,7 @@ export class SpSystemTrace extends BaseElement { this.addEventListener('mouseup', this.documentOnMouseUp); this.addEventListener('mouseout', this.documentOnMouseOut); - document.addEventListener('keydown', this.documentOnKeyDown ); + document.addEventListener('keydown', this.documentOnKeyDown); document.addEventListener('keypress', this.documentOnKeyPress); document.addEventListener('keyup', this.documentOnKeyUp); document.addEventListener('contextmenu', this.onContextMenuHandler); @@ -4503,8 +4499,8 @@ export class SpSystemTrace extends BaseElement { procedurePool.clearCache(); Utils.clearData(); InitAnalysis.getInstance().isInitAnalysis = true; - procedurePool.submitWithName('logic0', 'clear', {}, undefined, (res: any) => {}); - procedurePool.submitWithName('logic1', 'clear', {}, undefined, (res: any) => {}); + procedurePool.submitWithName('logic0', 'clear', {}, undefined, (res: any) => { }); + procedurePool.submitWithName('logic1', 'clear', {}, undefined, (res: any) => { }); this.times.clear(); } -- Gitee From c508e636224f9e97822c394500640ba4a2ed8ff4 Mon Sep 17 00:00:00 2001 From: zhangzepeng Date: Fri, 24 Nov 2023 09:53:29 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E2=80=99shift+mbug=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit git commit -sm ’shift+mbug修改 Signed-off-by: zhangzepeng --- ide/src/base-ui/table/LitPageTable.ts | 2 +- ide/src/base-ui/table/lit-table.ts | 2 +- .../component/trace/sheet/TabPaneCurrent.ts | 151 +++++++++--------- 3 files changed, 81 insertions(+), 74 deletions(-) diff --git a/ide/src/base-ui/table/LitPageTable.ts b/ide/src/base-ui/table/LitPageTable.ts index 5bf5f914..0e78442e 100644 --- a/ide/src/base-ui/table/LitPageTable.ts +++ b/ide/src/base-ui/table/LitPageTable.ts @@ -385,7 +385,7 @@ export class LitPageTable extends BaseElement { height: 15px; } .mouse-select{ - background-color: var(--dark-background6,#DEEDFF); + background-color: var(--dark-background6,#a2c4ed); } .mouse-in{ background-color: var(--dark-background6,#DEEDFF); diff --git a/ide/src/base-ui/table/lit-table.ts b/ide/src/base-ui/table/lit-table.ts index a85f196e..c239c771 100644 --- a/ide/src/base-ui/table/lit-table.ts +++ b/ide/src/base-ui/table/lit-table.ts @@ -255,7 +255,7 @@ export class LitTable extends HTMLElement { background: var(--dark-background1,#f5f5f5) } .mouse-select{ - background-color: var(--dark-background6,#DEEDFF); + background-color: var(--dark-background6,#a2c4ed); } .mouse-in{ background-color: var(--dark-background6,#DEEDFF); diff --git a/ide/src/trace/component/trace/sheet/TabPaneCurrent.ts b/ide/src/trace/component/trace/sheet/TabPaneCurrent.ts index d42578d4..09cbe2bc 100644 --- a/ide/src/trace/component/trace/sheet/TabPaneCurrent.ts +++ b/ide/src/trace/component/trace/sheet/TabPaneCurrent.ts @@ -30,44 +30,41 @@ export class TabPaneCurrent extends BaseElement { initElements(): void { this.systemTrace = document - .querySelector('body > sp-application')?. - shadowRoot!.querySelector('#sp-system-trace'); - this.shadowRoot - ?.querySelector('#text') - ?.addEventListener('keyup', (event: any) => { - event.stopPropagation(); - if (event.keyCode == '13') { - if (this.slicesTime) { - window.publish(window.SmartEvent.UI.KeyboardEnable, { - enable: true, - }); - this.slicesTime.text = event?.target.value; - document.dispatchEvent( - new CustomEvent('slices-change', { - detail: this.slicesTime, - }) - ); - } + .querySelector('body > sp-application') + ?.shadowRoot!.querySelector('#sp-system-trace'); + this.shadowRoot?.querySelector('#text')?.addEventListener('keyup', (event: any) => { + event.stopPropagation(); + if (event.keyCode == '13') { + if (this.slicesTime) { + window.publish(window.SmartEvent.UI.KeyboardEnable, { + enable: true, + }); + this.slicesTime.text = event?.target.value; + document.dispatchEvent( + new CustomEvent('slices-change', { + detail: this.slicesTime, + }) + ); } + } + }); + this.shadowRoot?.querySelector('#text')?.addEventListener('blur', (event: any) => { + (window as any).flagInputFocus = false; + window.publish(window.SmartEvent.UI.KeyboardEnable, { + enable: true, }); - this.shadowRoot - ?.querySelector('#text') - ?.addEventListener('blur', (event: any) => { - (window as any).flagInputFocus = false; - window.publish(window.SmartEvent.UI.KeyboardEnable, { - enable: true, - }); - }); - this.shadowRoot - ?.querySelector('#text') - ?.addEventListener('focus', (event: any) => { - (window as any).flagInputFocus = true; - window.publish(window.SmartEvent.UI.KeyboardEnable, { - enable: false, - }); + }); + this.shadowRoot?.querySelector('#text')?.addEventListener('focus', (event: any) => { + (window as any).flagInputFocus = true; + window.publish(window.SmartEvent.UI.KeyboardEnable, { + enable: false, }); + }); this.panelTable = this.shadowRoot!.querySelector('.notes-editor-panel'); this.panelTable!.addEventListener('row-click', (evt: any) => { + if (evt.detail.data.startTime === undefined) { + return; + } // 点击表格某一行后，背景变色 // @ts-ignore let data = evt.detail.data; @@ -82,28 +79,23 @@ export class TabPaneCurrent extends BaseElement { } this.systemTrace?.timerShaftEL!.sportRuler!.draw(); }); - // 如果点击RemoveAll，隐藏所有卡尺，清空数组，隐藏tab页 - if (data.operate.innerHTML === 'RemoveAll') { - this.systemTrace!.slicesList = []; - let slicesTimeList = [...this.slicesTimeList]; - for (let i = 0; i < slicesTimeList.length; i++) { - slicesTimeList[i].hidden = true; - document.dispatchEvent(new CustomEvent('slices-change', { detail: slicesTimeList[i] })); - } - this.slicesTimeList = []; - } }); - - // 当鼠标移出panel时重新加载备注信息 - this.systemTrace?.shadowRoot?.querySelector('trace-sheet')?.addEventListener('mouseout', (event: any) => { - let tr = this.panelTable!.shadowRoot!.querySelectorAll('.tr') as NodeListOf; - // 第一个tr是移除全部，所以跳过，从第二个tr开始，和this.slicesTimeList数组的第一个对应……，所以i从1开始，在this.slicesTimeList数组中取值时用i-1 - for (let i = 1; i < tr.length; i++) { - tr[i].querySelector('#text-input')!.value = this.slicesTimeList[i - 1].text; - } - event.stopPropagation(); - }, { capture: true }); + this.systemTrace?.shadowRoot?.querySelector('trace-sheet')?.addEventListener( + 'mouseout', + (event: any) => { + if (this.slicesTimeList.length === 0) { + return; + } + let tr = this.panelTable!.shadowRoot!.querySelectorAll('.tr') as NodeListOf; + // 第一个tr是移除全部，所以跳过，从第二个tr开始，和this.slicesTimeList数组的第一个对应……，所以i从1开始，在this.slicesTimeList数组中取值时用i-1 + for (let i = 1; i < tr.length; i++) { + tr[i].querySelector('#text-input')!.value = this.slicesTimeList[i - 1].text; + } + event.stopPropagation(); + }, + { capture: true } + ); } public setCurrentSlicesTime(slicesTime: SlicesTime): void { @@ -156,7 +148,7 @@ export class TabPaneCurrent extends BaseElement { slice.endTime ); color!.value = slice.color; - text!.value = slice.text; + text.value = slice.text; slice.selected === true ? (sliceData.isSelected = true) : (sliceData.isSelected = false); this.tableDataSource.push(sliceData); } @@ -181,24 +173,38 @@ export class TabPaneCurrent extends BaseElement { /** * 修改卡尺颜色事件和移除卡尺的事件处理 */ - private eventHandler(): void { + private eventHandler(): void { + let tr = this.panelTable!.shadowRoot!.querySelectorAll('.tr') as NodeListOf; + tr[0].querySelector('.removeAll')!.addEventListener('click', (evt: any) => { + this.systemTrace!.slicesList = []; + let slicesTimeList = [...this.slicesTimeList]; + for (let i = 0; i < slicesTimeList.length; i++) { + slicesTimeList[i].hidden = true; + document.dispatchEvent(new CustomEvent('slices-change', { detail: slicesTimeList[i] })); + } + this.slicesTimeList = []; + return; + }); + // 更新备注信息 this.panelTable!.addEventListener('click', (event: any) => { - let tr = this.panelTable!.shadowRoot!.querySelectorAll('.tr') as NodeListOf; + if (this.slicesTimeList.length === 0) { + return; + } for (let i = 1; i < tr.length; i++) { let inputValue = tr[i].querySelector('#text-input')!.value; - if (this.tableDataSource[i].startTime === this.slicesTimeList[i - 1].startTime && - this.tableDataSource[i].endTime === this.slicesTimeList[i - 1].endTime) { + if ( + this.tableDataSource[i].startTime === this.slicesTimeList[i - 1].startTime && + this.tableDataSource[i].endTime === this.slicesTimeList[i - 1].endTime + ) { this.slicesTimeList[i - 1].text = inputValue; document.dispatchEvent(new CustomEvent('slices-change', { detail: this.slicesTimeList[i - 1] })); // 旗子颜色改变时，重绘泳道图 this.systemTrace?.refreshCanvas(true); } } - // event.stopPropagation(); }); - let tr = this.panelTable!.shadowRoot!.querySelectorAll('.tr') as NodeListOf; // 第一个tr是移除全部，所以跳过，从第二个tr开始，和this.slicesTimeList数组的第一个对应……，所以i从1开始，在this.slicesTimeList数组中取值时用i-1 for (let i = 1; i < tr.length; i++) { // 修改颜色 @@ -223,9 +229,9 @@ export class TabPaneCurrent extends BaseElement { // // 点击色块修改颜色 tr[i].querySelector('#text-input')?.addEventListener('keyup', (event: any) => { if ( - this.tableDataSource[i].startTime === this.slicesTimeList[i - 1].startTime - && this.tableDataSource[i].endTime === this.slicesTimeList[i - 1].endTime - && event.keyCode == '13' + this.tableDataSource[i].startTime === this.slicesTimeList[i - 1].startTime && + this.tableDataSource[i].endTime === this.slicesTimeList[i - 1].endTime && + event.keyCode == '13' ) { this.systemTrace!.slicesList = this.slicesTimeList || []; this.slicesTimeList[i - 1].text = event?.target.value; @@ -233,7 +239,7 @@ export class TabPaneCurrent extends BaseElement { enable: true, }); document.dispatchEvent(new CustomEvent('slices-change', { detail: this.slicesTimeList[i - 1] })); - + this.systemTrace?.refreshCanvas(true); } event.stopPropagation(); @@ -243,12 +249,14 @@ export class TabPaneCurrent extends BaseElement { (window as any).flagInputFocus = false; window.publish(window.SmartEvent.UI.KeyboardEnable, { enable: true, - }); - if ( this.tableDataSource[i].startTime === this.slicesTimeList[i - 1].startTime - && this.tableDataSource[i].endTime === this.slicesTimeList[i - 1].endTime) { + }); + if ( + this.tableDataSource[i].startTime === this.slicesTimeList[i - 1].startTime && + this.tableDataSource[i].endTime === this.slicesTimeList[i - 1].endTime + ) { this.slicesTimeList[i - 1].text = event?.target.value; document.dispatchEvent(new CustomEvent('slices-change', { detail: this.slicesTimeList[i - 1] })); - + this.systemTrace?.refreshCanvas(true); } event.stopPropagation(); @@ -258,13 +266,13 @@ export class TabPaneCurrent extends BaseElement { (window as any).flagInputFocus = true; window.publish(window.SmartEvent.UI.KeyboardEnable, { enable: false, - }); + }); let tr = this.panelTable!.shadowRoot!.querySelectorAll('.tr') as NodeListOf; // 第一个tr是移除全部，所以跳过，从第二个tr开始，和this.flagList数组的第一个对应……，所以i从1开始，在this.flagList数组中取值时用i-1 for (let i = 1; i < tr.length; i++) { tr[i].querySelector('#text-input')!.value = this.slicesTimeList[i - 1].text; } - }); + }); // 点击remove按钮移除 tr[i]!.querySelector('.remove')?.addEventListener('click', (event: any) => { @@ -275,8 +283,7 @@ export class TabPaneCurrent extends BaseElement { this.slicesTimeList[i - 1].hidden = true; this.systemTrace!.slicesList = this.slicesTimeList || []; document.dispatchEvent(new CustomEvent('slices-change', { detail: this.slicesTimeList[i - 1] })); - this.slicesTimeList.splice(this.slicesTimeList.indexOf(this.slicesTimeList[i - 1]), 1); - // 移除时更新表格内容 + // 移除时更新表格内容 this.setTableData(); } event.stopPropagation(); -- Gitee