src/api/index.ts

@@ -1,11 +1,4 @@
-import {
+import { cSite, LoginResponse, Site, token } from "./types";
-  AccessPoint,
-  AccessPointCreateResponse,
-  cSite,
-  LoginResponse,
-  Site,
-  token,
-} from "./types";
 import { get as idbGet, set as idbSet, del as idbDel } from "idb-keyval";
 
 export * from "./types";
@@ -106,36 +99,5 @@ export async function getSites(): Promise<Site[]> {
 }
 
 export async function createSite(site: Site) {
-  return request<cSite>(
+  return request<cSite>("/sites", { auth: true, method: HTTPMethod.POST }, site);
-    "/sites",
-    { auth: true, method: HTTPMethod.POST },
-    site
-  );
-}
-
-export async function getAccessPointDetails(
-  sideID?: number
-): Promise<AccessPoint[]> {
-  const endpoint = `${sideID ? "/sites/" + sideID : ""}/aps`;
-  return request<AccessPoint[]>(endpoint, {
-    auth: true,
-    method: HTTPMethod.GET,
-  });
-}
-
-export async function getAccessPointByID(id: number): Promise<AccessPoint> {
-  return request<AccessPoint>(`/aps/${id}`, {
-    auth: true,
-    method: HTTPMethod.GET,
-  });
-}
-
-export async function createAccessPoint(
-  ap: AccessPoint
-): Promise<AccessPointCreateResponse> {
-  return request<AccessPointCreateResponse>(
-    "/aps",
-    { auth: true, method: HTTPMethod.POST },
-    ap
-  );
 }

src/api/types.ts

@@ -19,26 +19,3 @@ export interface Site {
 export interface cSite {
   "site-id": number;
 }
-
-export interface AccessPoint {
-  id: number;
-  site_id: number;
-  ap_name: string;
-  serialnumber: string;
-  comment: string;
-  group: string;
-  location: string;
-  mac_address: string;
-  model: string;
-  appointment: Date;
-  new_switchport_id?: any;
-  new_userport_id?: any;
-  old_switchport_id?: any;
-  old_userport_id?: any;
-  registered_user_id?: any;
-  timestamp_registered?: any;
-}
-
-export interface AccessPointCreateResponse {
-  "ap-id": number;
-}

src/components/VNav.vue

@@ -146,10 +146,6 @@ export default {
         name: "Settings",
         to: "Settings",
       },
-      {
-        name: "AccessPoints",
-        to: "AccessPoints",
-      },
     ]);
     const route = useRoute();
     const activeRoute = computed(() => route.name);

src/router/index.ts

@@ -1,12 +1,11 @@
-import { createWebHistory, createRouter, RouteRecordRaw } from "vue-router";
+import { createWebHistory, createRouter } from "vue-router";
 import Home from "../views/Home.vue";
 const Settings = () => import("../views/Settings.vue");
 const Login = () => import("../views/Login.vue");
 const Sites = () => import("../views/Sites.vue");
-const AccessPoints = () => import("../views/AccessPoints.vue");
 import { isLoggedIn } from "../api";
 
-const routes: RouteRecordRaw[] = [
+const routes = [
   {
     path: "/",
     name: "Home",
@@ -28,12 +27,6 @@ const routes: RouteRecordRaw[] = [
     component: Login,
     props: (route) => ({ logout: route.query.logout }),
   },
-  {
-    path: "/aps",
-    name: "AccessPoints",
-    component: AccessPoints,
-    props: (route) => ({ site: Number(route.query["site-id"]).valueOf() }),
-  },
 ];
 
 const router = createRouter({

src/views/AccessPoints.vue

@@ -1,67 +0,0 @@
-<template>
-  <div
-    class="dark:text-white container mx-auto h-full flex justify-center items-center"
-  >
-    <table class="table-auto shadow-lg">
-      <thead>
-        <tr>
-          <th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
-            Name
-          </th>
-          <th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
-            Location
-          </th>
-          <th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
-            Model
-          </th>
-          <th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
-            Comment
-          </th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr v-for="ap in aps">
-          <td class="border px-8 py-4">{{ ap.ap_name }}</td>
-          <td class="border px-8 py-4">{{ ap.location }}</td>
-          <td class="border px-8 py-4">{{ ap.model }}</td>
-          <td class="border px-8 py-4">{{ ap.comment }}</td>
-          <td>
-            <!--router-link
-            :to="{ name: 'AccessPoints', query: { 'site-id': site.id } }"
-            class="text-white bg-blue-600 hover:bg-blue-800 px-3 py-2 rounded-md text-sm font-medium"
-          >Show APs</router-link
-          --></td>
-        </tr>
-      </tbody>
-    </table>
-  </div>
-</template>
-
-<script lang="ts">
-import { ref, toRefs } from "vue";
-import { getAccessPointDetails, AccessPoint } from "../api";
-
-export default {
-  name: "AccessPoints",
-  props: {
-    site: {
-      type: Number,
-      required: false,
-    },
-  },
-  async setup(props: { site?: number }) {
-    const { site } = toRefs(props);
-    const aps = ref<AccessPoint[]>([]);
-    async function getAccessPoints() {
-      await getAccessPointDetails(site?.value).then(
-        (a) => void (aps.value = a)
-      );
-    }
-    await getAccessPoints();
-
-    return { aps };
-  },
-};
-</script>
-
-<style scoped></style>

src/views/Login.vue

@@ -57,7 +57,7 @@ export default {
       required: false,
     },
   },
-  async setup(props: { logout?: string }) {
+  async setup(props) {
     const { logout } = toRefs(props);
     const user = ref("");
     const password = ref("");
@@ -73,7 +73,7 @@ export default {
       }
     }
 
-    if (logout?.value !== undefined) {
+    if (logout.value !== undefined) {
       console.log("LOGOUT");
       await apiLogout();
     }

src/views/Sites.vue

@@ -2,21 +2,24 @@
   <div
     class="dark:text-white container mx-auto h-full flex justify-center items-center"
   >
-    <table class="table-auto shadow-lg">
+    <table class="table-fixed shadow-lg">
       <thead>
         <tr>
-          <th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
+          <th
+            class="w-1/2 bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4"
+          >
             Name
           </th>
-          <th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
+          <th
+            class="w-1/4 bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4"
+          >
             ID
           </th>
-          <th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
+          <th
+            class="w-1/4 bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4"
+          >
             Default Prefix
           </th>
-          <th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
-            Actions
-          </th>
         </tr>
       </thead>
       <tbody>
@@ -24,18 +27,6 @@
           <td class="border px-8 py-4">{{ site.name }}</td>
           <td class="border px-8 py-4">{{ site.id }}</td>
           <td class="border px-8 py-4">{{ site.default_prefix }}</td>
-          <td>
-            <!--router-link
-              :to="{ name: 'Login', query: { 'site-id': site.id } }"
-              class="text-white bg-blue-600 hover:bg-blue-800 px-3 py-2 rounded-md text-sm font-medium"
-              >Create AP</router-link
-            -->
-            <router-link
-              :to="{ name: 'AccessPoints', query: { 'site-id': site.id } }"
-              class="text-white bg-blue-600 hover:bg-blue-800 px-3 py-2 rounded-md text-sm font-medium"
-              >Show APs</router-link
-            >
-          </td>
         </tr>
       </tbody>
     </table>
@@ -86,7 +77,7 @@ export default {
   async setup() {
     const sites = ref<Site[]>([]);
     async function getSites() {
-      await apiGetSites().then((s) => void (sites.value = s));
+      apiGetSites().then((s) => void (sites.value = s));
     }
     await getSites();
 
@@ -101,8 +92,8 @@ export default {
         let newSite = await apiCreateSite(site);
         console.log(newSite);
         await getSites();
-        newSiteName.value = "";
+        newSiteName.value = ""
-        newDefaultPrefix.value = "";
+        newDefaultPrefix.value = ""
       } catch (e) {
         console.log(e);
       }