mirror of
https://github.com/PhaseII-eAmusement-Network/PhaseWeb3-Vue.git
synced 2026-07-19 01:06:02 -05:00
Add data tables to admin dash view
This commit is contained in:
parent
aa1d978dd6
commit
b2d308297a
|
|
@ -6,6 +6,7 @@ import CardBox from "@/components/CardBox.vue";
|
|||
import CardBoxWidget from "@/components/CardBoxWidget.vue";
|
||||
import LayoutAuthenticated from "@/layouts/LayoutAuthenticated.vue";
|
||||
import SectionTitleLine from "@/components/SectionTitleLine.vue";
|
||||
import GeneralTable from "@/components/GeneralTable.vue";
|
||||
|
||||
import { APIAdminDashboard } from "@/stores/api/admin";
|
||||
const dashboardData = ref({});
|
||||
|
|
@ -20,6 +21,99 @@ onMounted(async () => {
|
|||
console.log("Failed to fetch admin data:", error);
|
||||
}
|
||||
});
|
||||
|
||||
const eventHeaders = [
|
||||
{
|
||||
text: "Timestamp",
|
||||
value: "timestamp",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "IP Address",
|
||||
value: "data.ip",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "Game",
|
||||
value: "data.model",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "PCBID",
|
||||
value: "data.pcbid",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "Name",
|
||||
value: "data.name",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "Value",
|
||||
value: "data.value",
|
||||
width: 120,
|
||||
},
|
||||
];
|
||||
|
||||
const transactionHeaders = [
|
||||
{
|
||||
text: "Timestamp",
|
||||
value: "timestamp",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "PCBID",
|
||||
value: "data.pcbid",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "Delta",
|
||||
value: "data.delta",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "Remaining Balance",
|
||||
value: "data.balance",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
text: "Reason",
|
||||
value: "data.reason",
|
||||
width: 120,
|
||||
},
|
||||
];
|
||||
|
||||
function formatTransactions(events) {
|
||||
var formattedItems = [];
|
||||
for (var item of events) {
|
||||
if (item.type == "paseli_transaction") {
|
||||
if (item.timestamp) {
|
||||
const date = new Date(item.timestamp * 1000);
|
||||
item.timestamp = date.toLocaleString();
|
||||
}
|
||||
|
||||
formattedItems.push(item);
|
||||
}
|
||||
}
|
||||
|
||||
return formattedItems;
|
||||
}
|
||||
|
||||
function formatEvents(events) {
|
||||
var formattedItems = [];
|
||||
for (var item of events) {
|
||||
if (item.type == "pcbevent") {
|
||||
if (item.timestamp) {
|
||||
const date = new Date(item.timestamp * 1000);
|
||||
item.timestamp = date.toLocaleString();
|
||||
}
|
||||
|
||||
formattedItems.push(item);
|
||||
}
|
||||
}
|
||||
|
||||
return formattedItems;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -79,8 +173,36 @@ onMounted(async () => {
|
|||
/>
|
||||
</div>
|
||||
|
||||
<SectionTitleLine :icon="mdiFlagCheckered" title="Recent Errors" />
|
||||
<CardBox> </CardBox>
|
||||
<SectionTitleLine :icon="mdiFlagCheckered" title="Recent PCB Events" />
|
||||
<CardBox has-table>
|
||||
<div
|
||||
class="bg-white dark:bg-slate-900/95 rounded-2xl lg:flex lg:justify-between"
|
||||
>
|
||||
<div class="w-full">
|
||||
<GeneralTable
|
||||
:headers="eventHeaders"
|
||||
:items="formatEvents(dashboardData?.audit)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CardBox>
|
||||
|
||||
<SectionTitleLine
|
||||
:icon="mdiFlagCheckered"
|
||||
title="Recent PASELI Transactions"
|
||||
/>
|
||||
<CardBox has-table>
|
||||
<div
|
||||
class="bg-white dark:bg-slate-900/95 rounded-2xl lg:flex lg:justify-between"
|
||||
>
|
||||
<div class="w-full">
|
||||
<GeneralTable
|
||||
:headers="transactionHeaders"
|
||||
:items="formatTransactions(dashboardData?.audit)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</CardBox>
|
||||
</template>
|
||||
</SectionMain>
|
||||
</LayoutAuthenticated>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user