financial-assistant

1
import { TableData } from "../../contracts/interfaces";
2
import DataType from "../../contracts/types";
3
import EventObserver from "../../observer/observer";
4

5
class KnowledgeBase {
6
  public tag: HTMLDivElement;
7
  public buttonsTag: HTMLDivElement;
8
  public contentTag: HTMLDivElement;
9
  private tbody: HTMLTableSectionElement;
10

11
  constructor() {
12
    this.tag = document.createElement("div");
13
    this.tag.classList.add("base__wrapper");
14

15
    this.buttonsTag = document.createElement("div");
16
    this.buttonsTag.classList.add("base__buttons");
17

18
    this.contentTag = document.createElement("div");
19
    this.contentTag.classList.add("base__content", "hidden");
20

21
    const table = document.createElement("table");
22
    table.classList.add("table");
23

24
    this.tbody = document.createElement("tbody");
25

26
    table.appendChild(this.tbody);
27
    this.contentTag.appendChild(table);
28
    this.tag.append(this.buttonsTag, this.contentTag);
29
  }
30

31
  private renderEmptyPage(): void {
32
    const h1: HTMLHeadingElement = document.createElement("h1");
33
    h1.classList.add("header");
34
    h1.textContent = "Извините, по выбранной категории нет данных";
35

36
    this.buttonsTag.appendChild(h1);
37
  }
38

39
  public fillTable(rows: TableData[] | []): void {
40
    while (this.tbody.firstChild) {
41
      this.tbody.removeChild(this.tbody.firstChild);
42
    }
43

44
    rows.forEach((row) => {
45
      const { title, description, link } = row;
46
      const descWithBr = description
47
        .replace(/\n/g, "<br>")
48
        .replace(/\*\*(.*?)\*\*/g, "<b>$1</b>")
49
        .replace(/\-/g, "	•");
50

51
      const tr = document.createElement("tr");
52
      const tTitle = document.createElement("th");
53
      const tDesc = document.createElement("td");
54
      tDesc.classList.add("table__description");
55

56
      const tLink = document.createElement("td");
57
      tLink.classList.add("table__link");
58
      const a = document.createElement("a");
59

60
      a.href = link;
61
      a.target = "_blank";
62
      a.appendChild(tLink);
63

64
      tTitle.textContent = title;
65
      tDesc.innerHTML = descWithBr;
66
      tLink.textContent = "Ссылка на документ";
67

68
      tr.append(tTitle, tDesc, a);
69

70
      this.tbody.appendChild(tr);
71
    });
72
  }
73

74
  public drawButtons(items: DataType[] | [], isList?: boolean): void {
75
    while (this.buttonsTag.firstChild) {
76
      this.buttonsTag.removeChild(this.buttonsTag.firstChild);
77
    }
78

79
    if (items.length === 0) {
80
      this.renderEmptyPage();
81
      return;
82
    }
83

84
    items.forEach((item) => {
85
      const a: HTMLAnchorElement = document.createElement("a");
86
      a.id = String(item.id);
87

88
      const button: HTMLDivElement = document.createElement("div");
89
      this.buttonsTag.className = "base__buttons";
90
      this.contentTag.classList.add("hidden");
91

92
      button.className = "button";
93
      button.textContent = item.nameRus;
94

95
      a.appendChild(button);
96
      this.buttonsTag.appendChild(a);
97

98
      if (isList) {
99
        this.buttonsTag.className = "base__buttons_list";
100
        this.contentTag.classList.remove("hidden");
101
        button.className = "button__thin";
102
      }
103
    });
104
  }
105
}
106

107
export default KnowledgeBase;
108