• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (C) 2022 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 *     http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16import { BaseElement, element } from '../../../base-ui/BaseElement';
17import './Top20ThreadCpuUsage';
18import './Top20ThreadRunTime';
19import './Top20ProcessSwitchCount';
20import './Top20ProcessThreadCount';
21import './Top20FrequencyThread';
22import { Top20ThreadCpuUsage } from './Top20ThreadCpuUsage';
23import { Top20ThreadRunTime } from './Top20ThreadRunTime';
24import { Top20ProcessThreadCount } from './Top20ProcessThreadCount';
25import { Top20ProcessSwitchCount } from './Top20ProcessSwitchCount';
26import { Top20FrequencyThread } from './Top20FrequencyThread';
27import { SpStatisticsHttpUtil } from '../../../statistics/util/SpStatisticsHttpUtil';
28import { TabThreadAnalysisHtml } from './TabThreadAnalysis.html';
29
30@element('tab-thread-analysis')
31export class TabThreadAnalysis extends BaseElement {
32  private currentTabID: string | undefined;
33  private currentTab: BaseElement | undefined;
34  private contentDiv: HTMLDivElement | null | undefined;
35  private tab1: HTMLDivElement | null | undefined;
36  private tab2: HTMLDivElement | null | undefined;
37  private tab3: HTMLDivElement | null | undefined;
38  private tab4: HTMLDivElement | null | undefined;
39  private tab5: HTMLDivElement | null | undefined;
40  private top20ThreadCpuUsage: Top20ThreadCpuUsage | undefined | null;
41  private top20ThreadRunTime: Top20ThreadRunTime | undefined | null;
42  private top20ProcessThreadCount: Top20ProcessThreadCount | undefined | null;
43  private top20ProcessSwitchCount: Top20ProcessSwitchCount | undefined | null;
44  private top20FrequencyThread: Top20FrequencyThread | undefined | null;
45
46  initElements(): void {
47    this.contentDiv = this.shadowRoot!.querySelector<HTMLDivElement>('#content');
48    this.tab1 = this.shadowRoot!.querySelector<HTMLDivElement>('#tab1');
49    this.tab2 = this.shadowRoot!.querySelector<HTMLDivElement>('#tab2');
50    this.tab3 = this.shadowRoot!.querySelector<HTMLDivElement>('#tab3');
51    this.tab4 = this.shadowRoot!.querySelector<HTMLDivElement>('#tab4');
52    this.tab5 = this.shadowRoot!.querySelector<HTMLDivElement>('#tab5');
53    this.top20ThreadCpuUsage = this.shadowRoot!.querySelector<Top20ThreadCpuUsage>('#top20_thread_cpu_usage');
54    this.top20ThreadRunTime = this.shadowRoot!.querySelector<Top20ThreadRunTime>('#top20_thread_run_time');
55    this.top20ProcessThreadCount =
56      this.shadowRoot!.querySelector<Top20ProcessThreadCount>('#top20_process_thread_count');
57    this.top20ProcessSwitchCount =
58      this.shadowRoot!.querySelector<Top20ProcessSwitchCount>('#top20_process_switch_count');
59    this.top20FrequencyThread = this.shadowRoot!.querySelector<Top20FrequencyThread>('#top20_frequency_thread');
60
61    this.tab1!.addEventListener('click', (): void => {
62      this.setClickTab(this.tab1!, this.top20ThreadCpuUsage!);
63    });
64    this.tab2!.addEventListener('click', (): void => {
65      this.setClickTab(this.tab2!, this.top20ThreadRunTime!);
66    });
67    this.tab3!.addEventListener('click', (): void => {
68      this.setClickTab(this.tab3!, this.top20ProcessThreadCount!);
69    });
70    this.tab4!.addEventListener('click', (): void => {
71      this.setClickTab(this.tab4!, this.top20ProcessSwitchCount!);
72    });
73    this.tab5!.addEventListener('click', (): void => {
74      this.setClickTab(this.tab5!, this.top20FrequencyThread!);
75    });
76  }
77
78  init(): void {
79    this.top20FrequencyThread!.clearData();
80    this.top20ThreadCpuUsage!.clearData();
81    this.top20ThreadRunTime!.clearData();
82    this.top20ProcessSwitchCount!.clearData();
83    this.top20ProcessThreadCount!.clearData();
84    this.hideCurrentTab();
85    this.currentTabID = undefined;
86    this.setClickTab(this.tab1!, this.top20ThreadCpuUsage!, true);
87  }
88
89  hideCurrentTab(): void {
90    if (this.currentTabID) {
91      let clickTab = this.shadowRoot!.querySelector<HTMLDivElement>(`#${this.currentTabID}`);
92      if (clickTab) {
93        clickTab.className = 'tag_bt';
94      }
95    }
96    if (this.currentTab) {
97      this.currentTab.style.display = 'none';
98    }
99  }
100
101  setClickTab(
102    tab: HTMLDivElement,
103    showContent:
104      | Top20ThreadCpuUsage
105      | Top20ThreadRunTime
106      | Top20ProcessSwitchCount
107      | Top20ProcessThreadCount
108      | Top20FrequencyThread,
109    isInit: boolean = false
110  ): void {
111    if (!isInit) {
112      let event = showContent.id
113        .replace(/_/g, ' ')
114        .toLowerCase()
115        .replace(/( |^)[a-z]/g, (L: string) => L.toUpperCase());
116      SpStatisticsHttpUtil.addOrdinaryVisitAction({
117        event: event,
118        action: 'scheduling_analysis',
119      });
120    }
121    if (this.currentTabID) {
122      let clickTab = this.shadowRoot!.querySelector<HTMLDivElement>(`#${this.currentTabID}`);
123      if (clickTab) {
124        clickTab.className = 'tag_bt';
125      }
126    }
127    tab.className = 'tab_click';
128    if (tab.id !== this.currentTabID) {
129      this.currentTabID = tab.id;
130      if (this.currentTab) {
131        this.currentTab.style.display = 'none';
132      }
133      this.currentTab = showContent;
134      showContent.style.display = 'inline';
135      showContent.init();
136    }
137  }
138
139  initHtml(): string {
140    return TabThreadAnalysisHtml;
141  }
142}
143