From 31dbeb8666fdd83bc91797c031e40bd75402b906 Mon Sep 17 00:00:00 2001 From: wangziyi Date: Mon, 29 Jul 2024 18:43:18 +0800 Subject: [PATCH 1/4] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=95=B0=E6=8D=AE?= =?UTF-8?q?=E6=8C=89=E5=B0=8F=E6=95=B0=E7=82=B9=E5=AF=B9=E9=BD=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: wangziyi --- ide/src/base-ui/table/lit-table.ts | 45 ++++++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) diff --git a/ide/src/base-ui/table/lit-table.ts b/ide/src/base-ui/table/lit-table.ts index 167485ff..f485b256 100644 --- a/ide/src/base-ui/table/lit-table.ts +++ b/ide/src/base-ui/table/lit-table.ts @@ -67,6 +67,7 @@ export class LitTable extends HTMLElement { private _mode = TableMode.Expand; private columnResizeEnable: boolean = true; private _isSearch: boolean = false; + private maxLength: number = 0; constructor() { super(); @@ -164,6 +165,28 @@ export class LitTable extends HTMLElement { } set recycleDataSource(value) { + // 处理数据按小数点位置对齐 + if (value && value.length) { + // 找出数字部分的最大长度 + value.forEach((item: any) => { + // 提取数字部分(包括小数点) + if (item.durFormat) { + const match = item.durFormat.match(/^(\d+(\.\d+)?)/); + if (match && match[1]) { + // 计算长度(包括小数点) + const length = match[1].length; + this.maxLength = Math.max(this.maxLength, length); + } + } + if (item.percent) { + const match = item.percent.match(/^(\d+(\.\d+)?)/); + if (match && match[1]) { + const length = match[1].length; + this.maxLength = Math.max(this.maxLength, length); + } + } + }) + } if (this.tableElement) { this.isScrollXOutSide = this.tableElement!.scrollWidth > this.tableElement!.clientWidth; this.isRecycleList = true; @@ -1583,6 +1606,28 @@ export class LitTable extends HTMLElement { if (rowObject.data.rowName === 'cpu-profiler' && dataIndex === 'symbolName') { (child as HTMLElement).innerHTML = ''; } else { + //@ts-ignore + if (rowObject.data.durFormat) { //ebpf泳道下的analysis页 + // 提取数字部分(包括小数点) + if (dataIndex === 'durFormat') { + // @ts-ignore + const match = text.match(/^(\d+(\.\d+)?)(.*)$/); + if (match && match[1] && match[3]) { + // 计算需要添加的空格数 + const padding = '\xa0\xa0'.repeat(this.maxLength - match[1].length); + // 构造新的durFormat字符串 + text = padding + match[1] + match[3]; + } + } + if(dataIndex === 'percent'){ + // @ts-ignore + const match = text.match(/^(\d+(\.\d+)?)(.*)$/); + if (match && match[1]) { + const padding = '\xa0\xa0'.repeat(this.maxLength - match[1].length); + text = padding + match[1]; + } + } + } //@ts-ignore (child as HTMLElement).innerHTML = text; } //@ts-ignore -- Gitee From bf03e52f8495b6483f57f81772843b73876950e3 Mon Sep 17 00:00:00 2001 From: wangyujie Date: Tue, 30 Jul 2024 15:24:22 +0800 Subject: [PATCH 2/4] =?UTF-8?q?feat:record=20new=20trace=E6=90=9C=E7=B4=A2?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4=EF=BC=8C=E6=94=AF=E6=8C=81?= =?UTF-8?q?=E6=89=8B=E5=8A=A8=E6=90=9C=E7=B4=A2=E8=BF=9B=E7=A8=8B,native?= =?UTF-8?q?=20memory=E5=8E=BB=E6=8E=89ALL-Process?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: wangyujie --- ide/src/base-ui/select/LitSelectHtml.ts | 2 +- .../trace/component/setting/SpAllocations.ts | 2 +- .../trace/component/setting/SpArkTs.html.ts | 4 +- ide/src/trace/component/setting/SpArkTs.ts | 34 +++-- .../trace/component/setting/SpFFRTConfig.ts | 2 - .../component/setting/SpHilogRecord.html.ts | 4 +- .../trace/component/setting/SpHilogRecord.ts | 33 ++--- .../component/setting/SpHisysEvent.html.ts | 8 +- .../trace/component/setting/SpHisysEvent.ts | 118 +++++++++--------- .../component/setting/SpSdkConfig.html.ts | 4 +- .../trace/component/setting/SpSdkConfig.ts | 25 ++-- .../component/setting/SpVmTracker.html.ts | 4 +- .../trace/component/setting/SpVmTracker.ts | 34 +++-- 13 files changed, 148 insertions(+), 126 deletions(-) diff --git a/ide/src/base-ui/select/LitSelectHtml.ts b/ide/src/base-ui/select/LitSelectHtml.ts index 785ebaa1..069c8603 100644 --- a/ide/src/base-ui/select/LitSelectHtml.ts +++ b/ide/src/base-ui/select/LitSelectHtml.ts @@ -258,7 +258,7 @@ export const selectVHtmlStr = ` position: relative; overflow: visible; cursor: pointer; - border-radius: 2px; + border-radius: 16px; outline: none; -webkit-user-select:none ; -moz-user-select:none; diff --git a/ide/src/trace/component/setting/SpAllocations.ts b/ide/src/trace/component/setting/SpAllocations.ts index 52bda968..091d1241 100644 --- a/ide/src/trace/component/setting/SpAllocations.ts +++ b/ide/src/trace/component/setting/SpAllocations.ts @@ -518,7 +518,7 @@ export class SpAllocations extends BaseElement { Cmd.getProcess().then((processList: string[]): void => { this.processId?.dataSource(processList, ''); if (processList.length > 0) { - this.processId?.dataSource(processList, 'ALL-Process'); + this.processId?.dataSource(processList, ''); } else { this.processId?.dataSource([], ''); } diff --git a/ide/src/trace/component/setting/SpArkTs.html.ts b/ide/src/trace/component/setting/SpArkTs.html.ts index ff474484..142fa8b4 100644 --- a/ide/src/trace/component/setting/SpArkTs.html.ts +++ b/ide/src/trace/component/setting/SpArkTs.html.ts @@ -131,8 +131,8 @@ lit-switch { Process Record process - +
diff --git a/ide/src/trace/component/setting/SpArkTs.ts b/ide/src/trace/component/setting/SpArkTs.ts index 94629c1d..fb993c35 100644 --- a/ide/src/trace/component/setting/SpArkTs.ts +++ b/ide/src/trace/component/setting/SpArkTs.ts @@ -25,10 +25,11 @@ import { SpCheckDesBox } from './SpCheckDesBox'; import LitSwitch from '../../../base-ui/switch/lit-switch'; import { SpApplication } from '../../SpApplication'; import { SpArkTsHtml } from './SpArkTs.html'; +import { LitSelectV } from '../../../base-ui/select/LitSelectV'; @element('sp-ark-ts') export class SpArkTs extends BaseElement { - private processInput: LitAllocationSelect | undefined | null; + private processInput: LitSelectV | undefined | null; private spCheckDesBox: SpCheckDesBox | undefined | null; private radioBox: LitRadioBox | undefined | null; private interval: HTMLInputElement | undefined | null; @@ -111,24 +112,31 @@ export class SpArkTs extends BaseElement { initElements(): void { this.interval = this.shadowRoot?.querySelector('#interval'); - this.processInput = this.shadowRoot?.querySelector('lit-allocation-select'); - let processInput = this.processInput?.shadowRoot?.querySelector('.multipleSelect') as HTMLDivElement; + this.processInput = this.shadowRoot?.querySelector('lit-select-v'); + let processInput = this.processInput?.shadowRoot?.querySelector('input') as HTMLDivElement; this.cpuSwitch = this.shadowRoot?.querySelector('#cpu-switch') as LitSwitch; processInput!.addEventListener('mousedown', () => { - if (SpRecordTrace.serialNumber === '') { - this.processInput!.processData = []; - this.processInput!.initData(); + if (this.startSamp && (SpRecordTrace.serialNumber === '')) { + this.processInput!.dataSource([], ''); } }); processInput!.addEventListener('mouseup', () => { - if (SpRecordTrace.serialNumber === '') { - this.processInput!.processData = []; - this.processInput!.initData(); + if (this.startSamp) { + if (SpRecordTrace.serialNumber === '') { + this.processInput!.dataSource([], ''); + } else { + Cmd.getDebugProcess().then((processList) => { + if (processList.length > 0) { + this.processInput!.dataSource(processList, ''); + } else { + this.processInput!.dataSource([], ''); + } + }); + } + processInput!.removeAttribute('readonly'); } else { - Cmd.getDebugProcess().then((processList) => { - this.processInput!.processData = processList; - this.processInput!.initData(); - }); + processInput!.setAttribute('readonly', 'readonly'); + return; } }); this.litSwitch = this.shadowRoot?.querySelector('lit-switch') as LitSwitch; diff --git a/ide/src/trace/component/setting/SpFFRTConfig.ts b/ide/src/trace/component/setting/SpFFRTConfig.ts index 86c6e66c..fc23522b 100644 --- a/ide/src/trace/component/setting/SpFFRTConfig.ts +++ b/ide/src/trace/component/setting/SpFFRTConfig.ts @@ -195,7 +195,6 @@ export class SpFFRTConfig extends BaseElement { Cmd.getPackage().then((packageList: string[]): void => { let finalDataList = packageList.map(str => str.replace(/\t/g, '')); if (finalDataList.length > 0) { - processInputEl.readOnly = true; startupPNameEl.dataSource(finalDataList, 'ALL-Process'); } else { startupPNameEl.dataSource([], ''); @@ -261,7 +260,6 @@ export class SpFFRTConfig extends BaseElement { Cmd.getProcess().then((processList: string[]): void => { selectInputEl.dataSource(processList, ''); if (processList.length > 0) { - processInputEl.readOnly = true; selectInputEl.dataSource(processList, 'ALL-Process'); } else { selectInputEl.dataSource([], ''); diff --git a/ide/src/trace/component/setting/SpHilogRecord.html.ts b/ide/src/trace/component/setting/SpHilogRecord.html.ts index d0454da9..a2f1c6cc 100644 --- a/ide/src/trace/component/setting/SpHilogRecord.html.ts +++ b/ide/src/trace/component/setting/SpHilogRecord.html.ts @@ -92,9 +92,9 @@ export const SpHiLogRecordHtml = ` Process Record process
- - +
diff --git a/ide/src/trace/component/setting/SpHilogRecord.ts b/ide/src/trace/component/setting/SpHilogRecord.ts index 1c3f87c4..628c23a2 100644 --- a/ide/src/trace/component/setting/SpHilogRecord.ts +++ b/ide/src/trace/component/setting/SpHilogRecord.ts @@ -23,11 +23,12 @@ import { Cmd } from '../../../command/Cmd'; import { LitAllocationSelect } from '../../../base-ui/select/LitAllocationSelect'; import { LitSelect } from '../../../base-ui/select/LitSelect'; import { SpHiLogRecordHtml } from './SpHilogRecord.html'; +import { LitSelectV } from '../../../base-ui/select/LitSelectV'; @element('sp-hi-log') export class SpHilogRecord extends BaseElement { private vmTrackerSwitch: LitSwitch | undefined | null; - private processSelectEl: LitAllocationSelect | undefined | null; + private processSelectEl: LitSelectV | undefined | null; private logsSelectEl: LitSelect | undefined | null; get recordHilog(): boolean { @@ -47,7 +48,7 @@ export class SpHilogRecord extends BaseElement { initElements(): void { this.vmTrackerSwitch = this.shadowRoot?.querySelector('.hilog-switch') as LitSwitch; - this.processSelectEl = this.shadowRoot?.querySelector('.record-process-select') as LitAllocationSelect; + this.processSelectEl = this.shadowRoot?.querySelector('.record-process-select') as LitSelectV; this.logsSelectEl = this.shadowRoot?.querySelector('.record-logs-select') as LitSelect; let hiLogConfigList = this.shadowRoot?.querySelectorAll('.hilog-config-top'); this.vmTrackerSwitch.addEventListener('change', () => { @@ -62,20 +63,24 @@ export class SpHilogRecord extends BaseElement { }); } }); - let processInputEl = this.processSelectEl.shadowRoot?.querySelector('.multipleSelect') as HTMLInputElement; + let processInputEl = this.processSelectEl.shadowRoot?.querySelector('input') as HTMLInputElement; processInputEl.addEventListener('mousedown', () => { - if (SpRecordTrace.serialNumber === '') { - this.processSelectEl!.processData = []; - this.processSelectEl!.initData(); + if (this.recordHilog) { + if ((SpRecordTrace.serialNumber === '')) { + this.processSelectEl!.dataSource([], ''); + } else { + Cmd.getProcess().then((processList) => { + if (processList.length > 0) { + this.processSelectEl!.dataSource(processList, 'ALL-Process'); + } else { + this.processSelectEl!.dataSource([], ''); + } + }); + } + processInputEl!.removeAttribute('readonly'); } else { - Cmd.getProcess().then((processList) => { - if (processList.length > 0 && this.recordHilog) { - processInputEl!.setAttribute('readonly', 'readonly'); - } - processList.unshift('ALL-Process'); - this.processSelectEl!.processData = processList; - this.processSelectEl!.initData(); - }); + processInputEl!.setAttribute('readonly', 'readonly'); + return; } }); } diff --git a/ide/src/trace/component/setting/SpHisysEvent.html.ts b/ide/src/trace/component/setting/SpHisysEvent.html.ts index 6df54d17..0afe05d6 100644 --- a/ide/src/trace/component/setting/SpHisysEvent.html.ts +++ b/ide/src/trace/component/setting/SpHisysEvent.html.ts @@ -88,17 +88,17 @@ export const SpHiSysEventHtml = `