speatzle/nfsense
1
0
Fork 0
mirror of https://github.com/speatzle/nfsense.git synced 2025-05-11 02:48:21 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add Interfaces Page

Browse source
This commit is contained in:
Samuel Lorch 2023-03-31 18:36:35 +02:00
parent a0cfd62232
commit 1caac10d32
2 changed files with 55 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
client/src/App.vue
View file

@ -5,6 +5,7 @@ import { authenticate, logout, checkAuthentication, setup } from "./api";
import IDashboard from '~icons/ri/dashboard-2-line';
import IRule from '~icons/material-symbols/rule-folder-outline-sharp';
import IAddress from '~icons/eos-icons/ip';
import IEthernet from '~icons/bi/ethernet';
import IService from '~icons/material-symbols/home-repair-service';
import ISNAT from '~icons/mdi/arrow-expand-right';
import IDNAT from '~icons/mdi/arrow-collapse-right';
@ -17,6 +18,7 @@ const navRoutes = {
"/firewall/forwardrules": { icon: IRule, caption: "Rules" },
"/firewall/sourcenatrules": { icon: ISNAT, caption: "SNAT" },
"/firewall/destinationnatrules": { icon: IDNAT, caption: "DNAT" },
"/network/interfaces": { icon: IEthernet, caption: "Interfaces" },
"/object/addresses": { icon: IAddress, caption: "Addresses" },
"/object/services": { icon: IService, caption: "Services" },
};

53
client/src/pages/network/Interfaces.vue Normal file
View file

@ -0,0 +1,53 @@
<script setup lang="ts">
import { apiCall } from "../../api";
let interfaces = $ref({});
const columns = [
{heading: 'Name', path: 'name'},
{heading: 'Type', path: 'type'},
{heading: 'Members', path: 'members'},
{heading: 'Addressing Mode', path: 'addressing_mode'},
{heading: 'Address', path: 'address'},
];
const displayData = $computed(() => {
let data: any;
data = [];
for (const name in interfaces) {
data.push({
name,
type: interfaces[name].type,
addressing_mode: interfaces[name].addressing_mode,
address: interfaces[name].address,
comment: interfaces[name].comment,
});
}
return data;
});
function getServicePortRange(s:any): string {
if (s.dport_end) {
return s.dport_start + "-" + s.dport_end;
}
return s.dport_start;
}
async function load(){
let res = await apiCall("Network.GetInterfaces", {});
if (res.Error === null) {
console.debug("interfaces", res.Data.Interfaces);
interfaces = res.Data.Interfaces;
} else {
console.debug("error", res);
}
}
onMounted(async() => {
load();
});
</script>
<template>
<TableView title="Interfaces" :columns="columns" :load-data="load" v-model:data="displayData" :table-props="{sort:true, sortSelf: true}"/>
</template>