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';
17
18import '../../base-ui/table/lit-table';
19import { LitProgressBar } from '../../base-ui/progress-bar/LitProgressBar';
20import { SpStatisticsHttpUtil } from '../../statistics/util/SpStatisticsHttpUtil';
21import { queryMetric } from '../database/sql/SqlLite.sql';
22import { SpMetricsHtml } from './SpMetrics.html';
23
24@element('sp-metrics')
25export class SpMetrics extends BaseElement {
26  private selectMetricEl: HTMLSelectElement | undefined;
27  private runButtonEl: HTMLButtonElement | undefined | null;
28  private responseJson: HTMLPreElement | undefined | null;
29  private metricProgressLoad: LitProgressBar | undefined;
30
31  reset(): void {
32    this.selectMetricEl!.selectedIndex = 0;
33    this.responseJson!.textContent = '';
34  }
35
36  initElements(): void {
37    this.metricProgressLoad = this.shadowRoot?.querySelector('.sp-load-metric') as LitProgressBar;
38    this.selectMetricEl = this.shadowRoot?.querySelector('.sql-select') as HTMLSelectElement;
39    this.runButtonEl = this.shadowRoot?.querySelector('.sql-select-button') as HTMLButtonElement;
40    this.responseJson = this.shadowRoot?.querySelector('.response-json') as HTMLPreElement;
41  }
42
43  runClickListener = (): void => {
44    SpStatisticsHttpUtil.addOrdinaryVisitAction({
45      event: 'metrics',
46      action: 'metrics',
47    });
48    this.responseJson!.textContent = '';
49    this.metricProgressLoad!.loading = true;
50    let index = this.selectMetricEl!.selectedIndex;
51    let optionEl = this.selectMetricEl?.querySelectorAll<HTMLOptionElement>('option')[index];
52    if (optionEl && optionEl.value !== '') {
53      queryMetric(optionEl.value).then((result) => {
54        this.metricProgressLoad!.loading = false;
55        this.responseJson!.textContent = result.toString();
56      });
57    } else {
58      this.metricProgressLoad!.loading = false;
59    }
60  };
61
62  connectedCallback(): void {
63    this.runButtonEl?.addEventListener('click', this.runClickListener);
64  }
65
66  disconnectedCallback(): void {
67    this.runButtonEl?.removeEventListener('click', this.runClickListener);
68  }
69
70  initHtml(): string {
71    return SpMetricsHtml;
72  }
73}
74