blob: f918232d8288a1facbcda18de2f094d6579f3a70 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
|
import axios from "axios";
import { useContext, useState } from "react";
import { BackendURL } from "../Config";
import { LanguageContext } from "../Locales/Context";
import { GetLocalizedString } from "../Locales/Locales";
import { RangedWeapon } from "../Models/RangedWeapon";
const RangedWeaponsURL = `${BackendURL}/weapons/ranged`;
function WeaponsIndex() {
const lang = useContext(LanguageContext);
const [rangedWeapons, setRangedWeapons] = useState<RangedWeapon[] | null>(null);
useState(() => {
getRangedWeapons().then(data => setRangedWeapons(data));
});
return (
<div className="WeaponsDiv">
<span>
<h1> {GetLocalizedString("Weapons index", lang)} </h1>
</span>
<h2> {GetLocalizedString("Ranged weapons", lang)} </h2>
{generatedRangedWeaponsList(rangedWeapons)}
</div>
);
}
function generatedRangedWeaponsList(rangedWeapons: RangedWeapon[] | null): any {
if (!rangedWeapons) {
return (
<div> </div>
);
}
const categorized = new Map<string, RangedWeapon[]>();
rangedWeapons.forEach(el => {
if (!categorized.has(el.WeaponType)) {
categorized.set(el.WeaponType, new Array<RangedWeapon>());
}
categorized.get(el.WeaponType)?.push(el);
});
const keys = Array.from(categorized.keys());
const list = keys.map(x => {
const elements = categorized.get(x)?.map(w => {
return (
<tr key={w.Id}>
<td> {w.Name} </td>
<td> {w.WeaponType} </td>
<td> {w.Accuracy} </td>
<td> {w.Concealability} </td>
<td> {w.Avaliability} </td>
<td> {w.Damage}({w.Ammunition}) </td>
<td> {w.NumberOfShots} </td>
<td> {w.RateOfFire} </td>
<td> {w.Reliability} </td>
</tr>
)
});
return (
<tbody key={x}>
<tr>
<td className="CategoryName"> {`${x}s`} </td>
</tr>
{elements}
</tbody>
);
});
return (
<table className="WeaponTable">
{list}
</table>
);
}
async function getRangedWeapons(): Promise<RangedWeapon[]> {
try {
const {data, status} = await axios.get<RangedWeapon[]>(
RangedWeaponsURL,
{
headers: { Accept: "application/json" }
}
);
if (status != 200) {
return new Array<RangedWeapon>();
}
return data;
} catch (err) {
console.log(`Failed to get ranged weapons: ${err}`);
return new Array<RangedWeapon>();
}
}
export default WeaponsIndex;
|
