Skip to content

Commit d3e7453

Browse files
committed
implemented financial-data.component component
1 parent ee2b6ff commit d3e7453

File tree

8 files changed

+262
-8
lines changed

8 files changed

+262
-8
lines changed
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
export interface FinancialData {
2+
fetchDate: string;
3+
krsNumber: string;
4+
companyName: string;
5+
netSalesValues: string[];
6+
ebitdaValues: string[];
7+
netProfitOrLossValues: string[];
8+
liabilitesAndProvisionsValues: string[];
9+
equityValues: string[];
10+
totalAssetsValues: string[];
11+
}
Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +0,0 @@
1-
<p>credit-scoring works!</p>

src/app/pages/credit-scoring/credit-scoring.component.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
11
import { Component } from '@angular/core';
2+
import {FormsModule, ReactiveFormsModule} from "@angular/forms";
3+
import {NgIf} from "@angular/common";
24

35
@Component({
46
selector: 'app-credit-scoring',
57
standalone: true,
6-
imports: [],
8+
imports: [
9+
FormsModule,
10+
NgIf,
11+
ReactiveFormsModule
12+
],
713
templateUrl: './credit-scoring.component.html',
814
styleUrl: './credit-scoring.component.css'
915
})
Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
:root {
2+
--background: #395ba8;
3+
--color: #ffffff;
4+
--primary-color: #0f3460;
5+
}
6+
7+
* {
8+
box-sizing: border-box;
9+
}
10+
11+
body {
12+
font-family: "poppins";
13+
background: var(--background);
14+
color: var(--color);
15+
margin: 0;
16+
letter-spacing: 1px;
17+
transition: background 0.2s ease;
18+
}
19+
20+
.center-content {
21+
display: flex;
22+
flex-direction: column;
23+
align-items: center;
24+
justify-content: center;
25+
padding: 20px;
26+
margin: auto;
27+
max-width: 600px;
28+
border: 1px solid hsla(0, 0%, 65%, 0.158);
29+
border-radius: 10px;
30+
box-shadow: 0 0 36px 1px rgba(0, 0, 0, 0.2);
31+
background-color: rgba(133, 72, 72, 0.1);
32+
backdrop-filter: blur(20px);
33+
}
34+
35+
.title {
36+
font-size: 2em;
37+
margin-bottom: 20px;
38+
color: var(--color);
39+
}
40+
41+
form {
42+
width: 100%;
43+
margin-bottom: 20px;
44+
}
45+
46+
input[type="text"] {
47+
width: calc(100% - 20px);
48+
padding: 14.5px;
49+
margin: 10px 0;
50+
color: var(--color);
51+
outline: none;
52+
background-color: rgba(145, 145, 145, 0.12);
53+
border: none;
54+
border-radius: 5px;
55+
font-weight: 500;
56+
letter-spacing: 0.8px;
57+
font-size: 1em;
58+
backdrop-filter: blur(15px);
59+
}
60+
61+
input[type="text"]:focus {
62+
box-shadow: 0 0 16px 1px rgba(0, 0, 0, 0.2);
63+
animation: wobble 0.3s ease-in;
64+
}
65+
66+
button[type="submit"] {
67+
padding: 13px;
68+
background-color: var(--primary-color);
69+
color: var(--color);
70+
border: none;
71+
border-radius: 5px;
72+
font-size: 18px;
73+
letter-spacing: 1.5px;
74+
font-weight: bold;
75+
width: 100%;
76+
cursor: pointer;
77+
transition: all 0.1s ease-in-out;
78+
}
79+
80+
button[type="submit"]:hover {
81+
box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.15);
82+
transform: scale(1.02);
83+
}
84+
85+
div[ngIf="loading"], div[ngIf="error"] {
86+
font-size: 1.2em;
87+
color: #ff0000;
88+
margin-bottom: 20px;
89+
text-align: center;
90+
}
91+
92+
.financial-data {
93+
width: 100%;
94+
background-color: rgba(230, 215, 215, 0.5);
95+
padding: 20px;
96+
border: 1px solid #ddd;
97+
border-radius: 5px;
98+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
99+
}
100+
101+
.financial-data h3 {
102+
margin-bottom: 10px;
103+
color: var(--primary-color);
104+
}
105+
106+
.financial-data p {
107+
margin: 5px 0;
108+
font-size: 1.1em;
109+
color: var(--color);
110+
}
111+
112+
.financial-data ul {
113+
list-style-type: none;
114+
padding: 0;
115+
}
116+
117+
.financial-data li {
118+
background: rgba(255, 255, 255, 0.1);
119+
margin: 5px 0;
120+
padding: 10px;
121+
border-radius: 5px;
122+
color: var(--color);
123+
}
124+
125+
@keyframes wobble {
126+
0% {
127+
transform: scale(1.025);
128+
}
129+
25% {
130+
transform: scale(1);
131+
}
132+
75% {
133+
transform: scale(1.025);
134+
}
135+
100% {
136+
transform: scale(1);
137+
}
138+
}
Lines changed: 56 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,56 @@
1-
<p>financial-data works!</p>
1+
<div class="center-content">
2+
<h2 class="title" style="margin-left: 0">Financial Data</h2>
3+
<form style="font-size: 25px" (ngSubmit)="findFinancialData()">
4+
<input type="text" id="companyKrs" name="companyKrs" [(ngModel)]="companyKrs" placeholder="Enter KRS number">
5+
<button type="submit">Submit</button>
6+
</form>
7+
<div *ngIf="loading">Ładowanie...</div>
8+
<div *ngIf="error">{{ error }}</div>
9+
<div *ngIf="financialData" class="financial-data">
10+
<h3>Company: {{ financialData.companyName }}</h3>
11+
<p>KRS Number: {{ financialData.krsNumber }}</p>
12+
<p>Fetch Date: {{ financialData.fetchDate }}</p>
13+
14+
<ng-container *ngIf="financialData.netSalesValues.length > 0">
15+
<h4>Net Sales Values</h4>
16+
<ul>
17+
<li *ngFor="let value of financialData.netSalesValues">{{ value }}</li>
18+
</ul>
19+
</ng-container>
20+
21+
<ng-container *ngIf="financialData.ebitdaValues.length > 0">
22+
<h4>EBITDA Values</h4>
23+
<ul>
24+
<li *ngFor="let value of financialData.ebitdaValues">{{ value }}</li>
25+
</ul>
26+
</ng-container>
27+
28+
<ng-container *ngIf="financialData.netProfitOrLossValues.length > 0">
29+
<h4>Net Profit Or Loss Values</h4>
30+
<ul>
31+
<li *ngFor="let value of financialData.netProfitOrLossValues">{{ value }}</li>
32+
</ul>
33+
</ng-container>
34+
35+
<ng-container *ngIf="financialData.liabilitesAndProvisionsValues.length > 0">
36+
<h4>Liabilities and Provisions Values</h4>
37+
<ul>
38+
<li *ngFor="let value of financialData.liabilitesAndProvisionsValues">{{ value }}</li>
39+
</ul>
40+
</ng-container>
41+
42+
<ng-container *ngIf="financialData.equityValues.length > 0">
43+
<h4>Equity Values</h4>
44+
<ul>
45+
<li *ngFor="let value of financialData.equityValues">{{ value }}</li>
46+
</ul>
47+
</ng-container>
48+
49+
<ng-container *ngIf="financialData.totalAssetsValues.length > 0">
50+
<h4>Total Assets Values</h4>
51+
<ul>
52+
<li *ngFor="let value of financialData.totalAssetsValues">{{ value }}</li>
53+
</ul>
54+
</ng-container>
55+
</div>
56+
</div>

src/app/pages/financial-data/financial-data.component.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ describe('FinancialDataComponent', () => {
1111
imports: [FinancialDataComponent]
1212
})
1313
.compileComponents();
14-
14+
1515
fixture = TestBed.createComponent(FinancialDataComponent);
1616
component = fixture.componentInstance;
1717
fixture.detectChanges();
Lines changed: 49 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,58 @@
1-
import { Component } from '@angular/core';
1+
import {Component} from '@angular/core';
2+
import {HttpClient, HttpClientModule, HttpHeaders} from '@angular/common/http';
3+
import {FormsModule} from '@angular/forms';
4+
import {CommonModule, NgIf} from '@angular/common';
5+
import {FinancialData} from '../FinancialData.interface';
26

37
@Component({
48
selector: 'app-financial-data',
59
standalone: true,
6-
imports: [],
10+
imports: [
11+
FormsModule,
12+
HttpClientModule,
13+
NgIf,
14+
CommonModule
15+
],
716
templateUrl: './financial-data.component.html',
8-
styleUrl: './financial-data.component.css'
17+
styleUrls: ['./financial-data.component.css']
918
})
1019
export class FinancialDataComponent {
20+
companyKrs: string = '';
21+
financialData: FinancialData | null = null;
22+
loading: boolean = false;
23+
error: string | null = null;
1124

25+
constructor(private http: HttpClient) {
26+
}
27+
28+
findFinancialData() {
29+
if (!this.companyKrs) {
30+
this.error = "Please enter a valid KRS number.";
31+
return;
32+
}
33+
this.loading = true;
34+
this.error = null;
35+
36+
const url = `http://localhost:8080/financialData/${this.companyKrs}`;
37+
const token = sessionStorage.getItem('token');
38+
39+
if (!token) {
40+
this.error = "Authentication token is missing.";
41+
this.loading = false;
42+
return;
43+
}
44+
45+
const headers = new HttpHeaders().set('Authorization', `Bearer ${token}`);
46+
47+
this.http.get<FinancialData>(url, {headers}).subscribe({
48+
next: (data) => {
49+
this.financialData = data;
50+
this.loading = false;
51+
},
52+
error: (err) => {
53+
this.error = "Failed to load financial data. " + (err.error?.message || '');
54+
this.loading = false;
55+
}
56+
});
57+
}
1258
}

src/app/pages/login/login.component.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
21
<section class="container">
32
<div class="login-container">
43
<div class="circle circle-one"></div>

0 commit comments

Comments
 (0)