Merge branch 'main' into add_ci

This commit is contained in:
Alexander Detsch 2021-04-04 16:39:54 +02:00
commit 41f19acd8c
7 changed files with 167 additions and 19 deletions

View file

@ -1,4 +1,11 @@
import { cSite, LoginResponse, Site, token } from "./types";
import {
AccessPoint,
AccessPointCreateResponse,
cSite,
LoginResponse,
Site,
token,
} from "./types";
import { get as idbGet, set as idbSet, del as idbDel } from "idb-keyval";
export * from "./types";
@ -99,5 +106,36 @@ export async function getSites(): Promise<Site[]> {
}
export async function createSite(site: Site) {
return request<cSite>("/sites", { auth: true, method: HTTPMethod.POST }, site);
return request<cSite>(
"/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
);
}

View file

@ -19,3 +19,26 @@ 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;
}

View file

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

View file

@ -1,11 +1,12 @@
import { createWebHistory, createRouter } from "vue-router";
import { createWebHistory, createRouter, RouteRecordRaw } 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 = [
const routes: RouteRecordRaw[] = [
{
path: "/",
name: "Home",
@ -27,6 +28,12 @@ const routes = [
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({

View file

@ -0,0 +1,67 @@
<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>

View file

@ -57,7 +57,7 @@ export default {
required: false,
},
},
async setup(props) {
async setup(props: { logout?: string }) {
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();
}

View file

@ -2,24 +2,21 @@
<div
class="dark:text-white container mx-auto h-full flex justify-center items-center"
>
<table class="table-fixed shadow-lg">
<table class="table-auto shadow-lg">
<thead>
<tr>
<th
class="w-1/2 bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4"
>
<th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
Name
</th>
<th
class="w-1/4 bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4"
>
<th class="bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4">
ID
</th>
<th
class="w-1/4 bg-blue-100 dark:bg-blue-900 border text-left px-8 py-4"
>
<th class="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>
@ -27,6 +24,18 @@
<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>
@ -77,7 +86,7 @@ export default {
async setup() {
const sites = ref<Site[]>([]);
async function getSites() {
apiGetSites().then((s) => void (sites.value = s));
await apiGetSites().then((s) => void (sites.value = s));
}
await getSites();
@ -92,8 +101,8 @@ export default {
let newSite = await apiCreateSite(site);
console.log(newSite);
await getSites();
newSiteName.value = ""
newDefaultPrefix.value = ""
newSiteName.value = "";
newDefaultPrefix.value = "";
} catch (e) {
console.log(e);
}