mirror of
https://github.com/hay-kot/homebox.git
synced 2024-12-22 06:46:32 +00:00
cleanup
This commit is contained in:
parent
682774c9ce
commit
630fe83de5
5 changed files with 184 additions and 146 deletions
frontend
|
@ -1,9 +1,10 @@
|
||||||
{
|
{
|
||||||
"arrowParens": "avoid",
|
"arrowParens": "avoid",
|
||||||
"semi": true,
|
"semi": true,
|
||||||
"tabWidth": 4,
|
"tabWidth": 2,
|
||||||
"useTabs": true,
|
"useTabs": false,
|
||||||
"vueIndentScriptAndStyle": true,
|
"vueIndentScriptAndStyle": true,
|
||||||
"singleQuote": true,
|
"singleQuote": true,
|
||||||
"trailingComma": "es5"
|
"trailingComma": "es5",
|
||||||
|
"printWidth": 120
|
||||||
}
|
}
|
|
@ -15,4 +15,8 @@ export class UserApi extends BaseAPI {
|
||||||
public self() {
|
public self() {
|
||||||
return this.http.get<Result<User>>(UrlBuilder('/users/self'));
|
return this.http.get<Result<User>>(UrlBuilder('/users/self'));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public logout() {
|
||||||
|
return this.http.post<object, void>(UrlBuilder('/users/logout'), {});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -54,11 +54,7 @@ export class Requests {
|
||||||
return method === Method.POST || method === Method.PUT;
|
return method === Method.POST || method === Method.PUT;
|
||||||
}
|
}
|
||||||
|
|
||||||
private async do<T>(
|
private async do<T>(method: Method, url: string, payload: Object = {}): Promise<TResponse<T>> {
|
||||||
method: Method,
|
|
||||||
url: string,
|
|
||||||
payload: Object = {}
|
|
||||||
): Promise<TResponse<T>> {
|
|
||||||
const args: RequestInit = {
|
const args: RequestInit = {
|
||||||
method,
|
method,
|
||||||
headers: {
|
headers: {
|
||||||
|
@ -83,7 +79,13 @@ export class Requests {
|
||||||
this.logger(response);
|
this.logger(response);
|
||||||
}
|
}
|
||||||
|
|
||||||
const data = await response.json();
|
const data: T = await (async () => {
|
||||||
|
try {
|
||||||
|
return await response.json();
|
||||||
|
} catch (e) {
|
||||||
|
return {} as T;
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
|
||||||
return {
|
return {
|
||||||
status: response.status,
|
status: response.status,
|
||||||
|
|
|
@ -1,20 +1,10 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { useUserApi } from '@/composables/use-api';
|
import { useUserApi } from '@/composables/use-api';
|
||||||
|
import { useAuthStore } from '@/store/auth';
|
||||||
useHead({
|
useHead({
|
||||||
title: 'Homebox | Home',
|
title: 'Homebox | Home',
|
||||||
});
|
});
|
||||||
|
|
||||||
const links = [
|
|
||||||
{
|
|
||||||
name: 'Home',
|
|
||||||
href: '/home',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Logout',
|
|
||||||
href: '/logout',
|
|
||||||
last: true,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
const api = useUserApi();
|
const api = useUserApi();
|
||||||
|
|
||||||
const user = ref({});
|
const user = ref({});
|
||||||
|
@ -26,24 +16,50 @@
|
||||||
user.value = data.item;
|
user.value = data.item;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const authStore = useAuthStore();
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
async function logout() {
|
||||||
|
const { error } = await authStore.logout(api);
|
||||||
|
|
||||||
|
if (error) {
|
||||||
|
console.error(error);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
router.push('/');
|
||||||
|
}
|
||||||
|
|
||||||
|
const links = [
|
||||||
|
{
|
||||||
|
name: 'Home',
|
||||||
|
href: '/home',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Logout',
|
||||||
|
action: logout,
|
||||||
|
last: true,
|
||||||
|
},
|
||||||
|
];
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<section class="max-w-7xl mx-auto">
|
<section class="max-w-7xl mx-auto">
|
||||||
<header class="sm:px-6 py-2 lg:p-14 sm:py-6">
|
<header class="sm:px-6 py-2 lg:p-14 sm:py-6">
|
||||||
<h2
|
<h2 class="mt-1 text-4xl font-bold tracking-tight text-gray-200 sm:text-5xl lg:text-6xl">Homebox</h2>
|
||||||
class="mt-1 text-4xl font-bold tracking-tight text-gray-200 sm:text-5xl lg:text-6xl"
|
<div class="ml-1 text-lg text-gray-400 space-x-2">
|
||||||
>
|
|
||||||
Homebox
|
|
||||||
</h2>
|
|
||||||
<div class="ml-1 text-lg text-gray-400 space-x-2 italic">
|
|
||||||
<template v-for="link in links">
|
<template v-for="link in links">
|
||||||
<router-link
|
<router-link
|
||||||
class="hover:text-base-content transition-color duration-200"
|
v-if="!link.action"
|
||||||
|
class="hover:text-base-content transition-color duration-200 italic"
|
||||||
:to="link.href"
|
:to="link.href"
|
||||||
>
|
>
|
||||||
{{ link.name }}
|
{{ link.name }}
|
||||||
</router-link>
|
</router-link>
|
||||||
|
<button v-else @click="link.action" class="hover:text-base-content transition-color duration-200 italic">
|
||||||
|
{{ link.name }}
|
||||||
|
</button>
|
||||||
<span v-if="!link.last"> / </span>
|
<span v-if="!link.last"> / </span>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
import { UserApi } from '@/api/user';
|
||||||
import { defineStore } from 'pinia';
|
import { defineStore } from 'pinia';
|
||||||
|
|
||||||
export const useAuthStore = defineStore('auth', {
|
export const useAuthStore = defineStore('auth', {
|
||||||
|
@ -18,4 +19,18 @@ export const useAuthStore = defineStore('auth', {
|
||||||
return state.expires < new Date();
|
return state.expires < new Date();
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
actions: {
|
||||||
|
async logout(api: UserApi) {
|
||||||
|
const result = await api.logout();
|
||||||
|
|
||||||
|
if (result.error) {
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.token = '';
|
||||||
|
this.expires = '';
|
||||||
|
|
||||||
|
return result;
|
||||||
|
},
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue