adamf/web_server
1
1
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

new page layout

Browse Source
This commit is contained in:
Adam French
2025-12-10 00:58:38 +00:00
parent 21eeb351c8
commit b6c9d8d80f
13 changed files with 111 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
nginx/vue/src/components/admin/Login.vue
View File

@@ -1,13 +1,26 @@
<script setup>
import { ref, onMounted } from "vue";
import { ref, onMounted, computed } from "vue";
import { useAuthStore } from "@/stores/auth";
const loggedIn = ref(false);
const auth = useAuthStore();
const username = ref("");
const password = ref("");
const loggedIn = computed(() => Object.keys(auth.user.ID || {}).length > 0);
function handleLogin() {
auth.logIn(username.value, password.value);
}
</script>
<template>
<div v-if="!loggedIn">
<div v-if="loggedIn">
<p>{{ auth.user.ID }}</p>
<p>{{ auth.user.username }}</p>
</div>
<div v-else>
<h1>login</h1>
<textarea>Username</textarea>
<textarea>Password</textarea>
<textarea v-model="username"></textarea>
<textarea type="password" v-model="password"></textarea>
<button @click="handleLogin">Log In</button>
</div>
</template>

10
nginx/vue/src/components/home/Favorites.vue
View File

@@ -1,3 +1,11 @@
<template>
<div></div>
<div>
<img src="/img/epic.jpeg" />
</div>
</template>
<style scoped>
img {
width: 100%;
}
</style>

10
nginx/vue/src/components/home/Feed.vue
View File

@@ -18,5 +18,13 @@ onMounted(() => {
</script>
<template>
<div></div>
<div>
<img src="/img/epic.jpeg" />
</div>
</template>
<style scoped>
img {
width: 100%;
}
</style>

10
nginx/vue/src/components/home/Gym.vue
View File

@@ -1,3 +1,11 @@
<template>
<div></div>
<div>
<img src="/img/epic.jpeg" />
</div>
</template>
<style scoped>
img {
width: 100%;
}
</style>

8
nginx/vue/src/components/home/Intro.vue
View File

@@ -6,6 +6,14 @@
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
</div>
</div>
</template>

10
nginx/vue/src/components/home/Links.vue
View File

@@ -3,19 +3,19 @@
<RouterLink to="/cv">
<img src="/img/stamps/BC7BDBB9-36FF-4DBE-B825-3603BFE00BE0.gif" />
</RouterLink>
<RouterLink to="/login">
<RouterLink to="/admin">
<img src="/img/stamps/BC7BDBB9-36FF-4DBE-B825-3603BFE00BE0.gif" />
</RouterLink>
<RouterLink to="/login">
<RouterLink to="/admin">
<img src="/img/stamps/BC7BDBB9-36FF-4DBE-B825-3603BFE00BE0.gif" />
</RouterLink>
<RouterLink to="/login">
<RouterLink to="/admin">
<img src="/img/stamps/BC7BDBB9-36FF-4DBE-B825-3603BFE00BE0.gif" />
</RouterLink>
<RouterLink to="/login">
<RouterLink to="/admin">
<img src="/img/stamps/BC7BDBB9-36FF-4DBE-B825-3603BFE00BE0.gif" />
</RouterLink>
<RouterLink to="/login">
<RouterLink to="/admin">
<img src="/img/stamps/BC7BDBB9-36FF-4DBE-B825-3603BFE00BE0.gif" />
</RouterLink>
</div>

4
nginx/vue/src/components/home/Listening.vue
View File

@@ -10,9 +10,7 @@ let idx = 0;
async function fetchRecent() {
try {
const res = await axios.get(
"https://adam-french.co.uk/api/spotify/recent",
);
const res = await axios.get("/api/spotify/recent");
songs = res.data;
fetched.value = true;
song.value = songs[0];

10
nginx/vue/src/components/home/Watching.vue
View File

@@ -1,3 +1,11 @@
<template>
<div></div>
<div>
<img src="/img/epic.jpeg" />
</div>
</template>
<style scoped>
img {
width: 100%;
}
</style>

6
nginx/vue/src/stores/auth.js
View File

@@ -4,6 +4,7 @@ import axios from "axios";
export const useAuthStore = defineStore("auth", () => {
const user = ref({});
checkToken();
function logOut() {
user.value = {};
@@ -15,6 +16,7 @@ export const useAuthStore = defineStore("auth", () => {
username,
password,
});
user.value = res.data;
} catch (err) {
console.error(err);
}
@@ -34,7 +36,9 @@ export const useAuthStore = defineStore("auth", () => {
const res = await axios.get("/api/auth/check");
user.value = res.data;
} catch (err) {
console.log(err);
user.value = {};
}
}
return { user, checkToken, logIn, refreshToken, logOut };
});

18
nginx/vue/src/views/Home.vue
View File

@@ -13,15 +13,15 @@ import Watching from "@/components/home/Watching.vue";
<template>
<main class="center-content flex-col">
<div class="a4page-portrait bdr-1 grid">
<Intro class="intro bdr-2" />
<Listening class="listening bdr-2" />
<Stamps class="stamps bdr-2" />
<Feed class="feed bdr-2" />
<Links class="links bdr-2" />
<Collage class="collage bdr-2" />
<Favorites class="favorites bdr-2" />
<Gym class="gym bdr-2" />
<Watching class="watching bdr-2" />
<Intro class="intro bdr-primary bg-primary" />
<Listening class="listening bdr-primary bg-primary" />
<Stamps class="stamps bdr-primary bg-primary" />
<Feed class="feed bdr-primary bg-primary" />
<Links class="links bdr-primary bg-primary" />
<Collage class="collage bdr-primary bg-primary" />
<Favorites class="favorites bdr-primary bg-primary" />
<Gym class="gym bdr-primary bg-primary" />
<Watching class="watching bdr-primary bg-primary" />
</div>
</main>
</template>