From 7970cc7664c5966cacfcd6ad49a425d4df1328b9 Mon Sep 17 00:00:00 2001
From: "CTFang@WireLab" <ctfang.cs12@nycu.edu.tw>
Date: Mon, 4 Mar 2024 11:41:31 +0000
Subject: [PATCH] Fix: fix charging UI and bugs
---
frontend/src/pages/Charging/ChargingList.tsx | 10 +++++--
frontend/src/pages/SubscriberCreate.tsx | 28 ++++++++++++++++++--
2 files changed, 34 insertions(+), 4 deletions(-)
diff --git a/frontend/src/pages/Charging/ChargingList.tsx b/frontend/src/pages/Charging/ChargingList.tsx
index 32f83a5..fecb0d0 100644
--- a/frontend/src/pages/Charging/ChargingList.tsx
+++ b/frontend/src/pages/Charging/ChargingList.tsx
@@ -35,7 +35,13 @@ const ChargingList: React.FC<{
return (
<>
- <TableCell>{chargingRecordMatch ? chargingRecordMatch.Usage : "-"}</TableCell>
+ <TableCell>
+ {chargingRecordMatch
+ ? props.chargingMethod === "Online"
+ ? chargingRecordMatch.QuotaLeft
+ : chargingRecordMatch.Usage
+ : "-"}
+ </TableCell>
<TableCell>{chargingRecordMatch ? chargingRecordMatch.TotalVol : "-"}</TableCell>
<TableCell>{chargingRecordMatch ? chargingRecordMatch.UlVol : "-"}</TableCell>
<TableCell>{chargingRecordMatch ? chargingRecordMatch.DlVol : "-"}</TableCell>
@@ -73,7 +79,7 @@ const ChargingList: React.FC<{
return (
<Table>
<TableHead>
- <h3>Offline Charging</h3>
+ <h3>{props.chargingMethod} Charging</h3>
<TableRow>
{tableColumnNames.map((colName, idx) => {
return <TableCell key={idx}>{colName}</TableCell>;
diff --git a/frontend/src/pages/SubscriberCreate.tsx b/frontend/src/pages/SubscriberCreate.tsx
index 1a3b99a..9ab7f2c 100644
--- a/frontend/src/pages/SubscriberCreate.tsx
+++ b/frontend/src/pages/SubscriberCreate.tsx
@@ -472,11 +472,21 @@ export default function SubscriberCreate() {
}
};
- const onDnnDelete = (index: number, dnn: string) => {
+ const onDnnDelete = (index: number, dnn: string, slice: string) => {
if (data.SessionManagementSubscriptionData !== undefined) {
delete data.SessionManagementSubscriptionData![index].dnnConfigurations![dnn];
setData({ ...data });
}
+ // Remove all flow-based charging rule in this DNN
+ if (data.ChargingDatas !== undefined) {
+ for (let i = 0; i < data.ChargingDatas!.length; i++) {
+ if (data.ChargingDatas![i].dnn === dnn && data.ChargingDatas![i].snssai === slice) {
+ data.ChargingDatas!.splice(i, 1);
+ i--;
+ }
+ }
+ }
+ setData({ ...data });
};
const onFlowRulesDelete = (dnn: string, flowKey: string, qosRef: number | undefined) => {
@@ -504,6 +514,14 @@ export default function SubscriberCreate() {
}
}
}
+ if (data.ChargingDatas !== undefined) {
+ for (let i = 0; i < data.ChargingDatas!.length; i++) {
+ if (data.ChargingDatas![i].qosRef === qosRef) {
+ data.ChargingDatas!.splice(i, 1);
+ i--;
+ }
+ }
+ }
setData({ ...data });
};
@@ -1722,7 +1740,13 @@ export default function SubscriberCreate() {
<Button
color="secondary"
variant="contained"
- onClick={() => onDnnDelete(index, dnn)}
+ onClick={() =>
+ onDnnDelete(
+ index,
+ dnn,
+ toHex(row.singleNssai!.sst!) + row.singleNssai!.sd!,
+ )
+ }
sx={{
m: 2,
backgroundColor: "red",
--
GitLab