Add Addresses, Services Pages

client/src/App.vue

@@ -12,7 +12,8 @@ let navState = $ref(NavState.Open);
 const navRoutes = {
   "/": { icon: IDashboard, caption: "Dashboard" },
   "/firewall/rules": { icon: IRule, caption: "Rules" },
-  "/addresses": { icon: IAddress, caption: "Addresses" },
+  "/object/addresses": { icon: IAddress, caption: "Addresses" },
+  "/object/services": { icon: IAddress, caption: "Services" },
 };
 
 enum AuthState { Unauthenticated, MfaRequired, Authenticated };

client/src/pages/object/Addresses.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { apiCall } from "../../api";
+
+let addresses = $ref([]);
+const columns = [
+  {heading: 'Name', path: 'name'},
+  {heading: 'Type', path: 'type'},
+  {heading: 'Value', path: 'value'},
+  {heading: 'Comment', path: 'comment'},
+];
+
+async function load(){
+  let res = await apiCall("Object.GetAddresses", {});
+  if (res.Error === null) {
+    addresses = res.Data.Addresses;
+    console.debug("addresses", addresses);
+  } else {
+    console.debug("error", res);
+  }
+}
+
+onMounted(async() => {
+  load();
+});
+
+</script>
+
+<template>
+  <div>
+    <PageHeader title="Addresses">
+      <button @click="load">Load Addresses</button>
+    </PageHeader>
+    <NiceTable :columns="columns" v-model:data="addresses"/>
+  </div>
+</template>

client/src/pages/object/Services.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { apiCall } from "../../api";
+
+let services = $ref([]);
+const columns = [
+  {heading: 'Name', path: 'name'},
+  {heading: 'Type', path: 'type'},
+  {heading: 'Value', path: 'value'},
+  {heading: 'Comment', path: 'comment'},
+];
+
+async function load(){
+  let res = await apiCall("Object.GetServices", {});
+  if (res.Error === null) {
+    services = res.Data.Services;
+    console.debug("services", services);
+  } else {
+    console.debug("error", res);
+  }
+}
+
+onMounted(async() => {
+  load();
+});
+
+</script>
+
+<template>
+  <div>
+    <PageHeader title="services">
+      <button @click="load">Load Services</button>
+    </PageHeader>
+    <NiceTable :columns="columns" v-model:data="services"/>
+  </div>
+</template>