etwas responsible gemacht, posten und commentieren geht profile machen
This commit is contained in:
danielvici123
@@ -39,7 +39,10 @@ const router = useRouter();
|
||||
const post = ref<Post | null>(null);
|
||||
const user = ref<User | null>(null);
|
||||
const comments = ref<Comment[] | null>(null);
|
||||
let post_id = ref();
|
||||
let comment_text = ref();
|
||||
let self_id;
|
||||
|
||||
let post_uuid = ref();
|
||||
|
||||
onMounted(async () => {
|
||||
console.log("PARAMS: "+ route.path);
|
||||
@@ -47,22 +50,21 @@ onMounted(async () => {
|
||||
console.log(pathArray);
|
||||
|
||||
if (pathArray.length > 2) {
|
||||
post_id.value = pathArray[2];
|
||||
post_uuid.value = pathArray[2];
|
||||
console.log("post_id 0: ", post_uuid.value);
|
||||
|
||||
}
|
||||
|
||||
if (!post_id) {
|
||||
if (!post_uuid) {
|
||||
alert('No post selected. Redirecting to feed.');
|
||||
await router.push('/');
|
||||
return;
|
||||
}
|
||||
|
||||
getPost(parseInt(post_id.value));
|
||||
getComment(parseInt(post_id.value));
|
||||
self_id = localStorage.getItem('self_id');
|
||||
getPost(parseInt(post_uuid.value));
|
||||
getComment(parseInt(post_uuid.value));
|
||||
});
|
||||
|
||||
|
||||
|
||||
async function getPost(post_id: any) {
|
||||
try {
|
||||
const post_response = await fetch(`http://localhost:8000/api/post/${post_id}`, { method: 'GET' });
|
||||
@@ -125,27 +127,25 @@ function copyLink(post_id: string | number) {
|
||||
alert("Copied to clipboard");
|
||||
}
|
||||
|
||||
async function addLike(post_id: string | number, user_id: number) {
|
||||
async function addLike() { // Post liken
|
||||
try {
|
||||
post.value.likes++;
|
||||
const response = await fetch(`http://localhost:8000/api/post/${post_id}/like`, {
|
||||
const response_like = await fetch(`http://localhost:8000/api/post/${post_uuid.value}/like`, {
|
||||
method: 'POST',
|
||||
headers: {'content-type': 'application/json'},
|
||||
body: `{"userId":${user_id}}`,
|
||||
body: `{"userId":${self_id}}`,
|
||||
});
|
||||
|
||||
console.log('Antwort-Status:', response.status);
|
||||
|
||||
if (!response.ok) {
|
||||
const errorText = await response.text(); // Versuche, den Fehlertext vom Server zu bekommen
|
||||
if (!response_like.ok) {
|
||||
const errorText = await response_like.text();
|
||||
console.error('Server-Fehlertext:', errorText);
|
||||
post.value.likes--;
|
||||
throw new Error(`HTTP error! status: ${response.status}, text: ${errorText}`);
|
||||
//post.value.likes--;
|
||||
throw new Error(`HTTP error! status: ${response_like.status}, text: ${errorText}`);
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
console.log('Antwort vom Server:', data);
|
||||
const data = await response_like.json();
|
||||
|
||||
console.log("post_id 2: ", post_uuid);
|
||||
return data;
|
||||
} catch (error) {
|
||||
console.error('Fehler beim Liken des Posts:', error);
|
||||
@@ -153,6 +153,54 @@ async function addLike(post_id: string | number, user_id: number) {
|
||||
}
|
||||
}
|
||||
|
||||
async function comment_create_text(comment_text: string) {
|
||||
try {
|
||||
const response = await fetch(`http://localhost:8000/api/post/${post_uuid.value}/comment`, {
|
||||
method: 'POST',
|
||||
headers: {'content-type': 'application/json'},
|
||||
body: `{"userId":${self_id},"text":"${comment_text}"}`,});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if(response.ok) {
|
||||
await getComment(parseInt(post_uuid.value));
|
||||
} else {
|
||||
alert("Error while posting comment.");
|
||||
}
|
||||
return data;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
console.log(comment_text);
|
||||
}
|
||||
|
||||
async function addLike_comment(comment_id: number | string) {
|
||||
try {
|
||||
post.value.likes++;
|
||||
const response_like = await fetch(`http://localhost:8000/api/comment/${comment_id}/like`, {
|
||||
method: 'POST',
|
||||
headers: {'content-type': 'application/json'},
|
||||
body: `{"userId":${self_id}}`,
|
||||
});
|
||||
|
||||
if (!response_like.ok) {
|
||||
const errorText = await response_like.text();
|
||||
console.error('Server-Fehlertext:', errorText);
|
||||
post.value.likes--;
|
||||
throw new Error(`HTTP error! status: ${response_like.status}, text: ${errorText}`);
|
||||
}
|
||||
|
||||
const data = await response_like.json();
|
||||
|
||||
console.log("post_id: ", comment_id);
|
||||
console.log(data);
|
||||
getComment(parseInt(post_uuid.value));
|
||||
return data;
|
||||
} catch (error) {
|
||||
console.error('Fehler beim Liken des Posts:', error);
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -183,11 +231,11 @@ async function addLike(post_id: string | number, user_id: number) {
|
||||
<label class="text-sm m-1 text-weiss" v-if="post.comments != undefined">{{ post.comments }}</label>
|
||||
<label class="text-sm m-1 text-weiss" v-else>Comments disabled</label>
|
||||
</div>
|
||||
<div class="flex items-center" @click="addLike(post.post_uuid, post.user_id)"> <!-- Likes -->
|
||||
<div class="flex items-center" @click="addLike()"> <!-- Likes -->
|
||||
<img alt="" src="../assets/icons/herz.png" class="align-middle">
|
||||
<label class="text-sm m-1 text-weiss">{{ post.likes }}</label>
|
||||
</div>
|
||||
<button @click="copyLink(post_id)" class="text-schwarz pl-1 mx-1 px-1 rounded-lg bg-button-farbe">Share Post</button>
|
||||
<button @click="copyLink(post_uuid)" class="text-schwarz pl-1 mx-1 px-1 rounded-lg bg-button-farbe">Share Post</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -199,13 +247,22 @@ async function addLike(post_id: string | number, user_id: number) {
|
||||
</div>
|
||||
|
||||
<div> <!-- WRITE COMMENTS -->
|
||||
|
||||
<div class="flex border-b-2 border-b-grau2">
|
||||
<img src="../assets/danielvici_pp.png" alt="" class="p-2 rounded-full w-16 h-16">
|
||||
<form class="w-full pr-5">
|
||||
<!-- post_publish ist richtig aber wird falsch angezeigt. File Input geht nicht-->
|
||||
<textarea v-model="comment_text" name="post_text" class="bg-hintergrund-farbe rounded-lg m-2 p-1 focus:outline-none text-grau2 w-full resize-none" rows="3" placeholder="Write something..."></textarea>
|
||||
<div class="">
|
||||
<button id="post_publish" name="post_publishss" class="text-weiss p-1 m-2 rounded-lg py-3 px-5 bg-button-farbe" @click.prevent="comment_create_text(comment_text)" type="button">Post</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div> <!-- VIEW COMMENTS -->
|
||||
<div> <!-- VIEW COMMENTS -->
|
||||
<div v-if="comments && comments.length > 0" class="overflow-y-auto h-screen scrollbar" >
|
||||
<div v-for="c in comments" :key="c.comment_id" class="p-4 border-b border-gray-700">
|
||||
<div class="sm:overflow-y-scroll h-[450px]"> <!-- VIEW COMMENTS -->
|
||||
<ul v-if="comments && comments.length > 0">
|
||||
<li v-for="c in comments" :key="c.comment_id" class="p-4 border-b border-gray-700">
|
||||
<div class="flex">
|
||||
<img src="../assets/default_pp.png" alt="" class="rounded-full w-16 h-16">
|
||||
<div>
|
||||
@@ -218,15 +275,15 @@ async function addLike(post_id: string | number, user_id: number) {
|
||||
</div>
|
||||
<div class="flex"> <!-- POST FOOTER -->
|
||||
|
||||
<div class="flex items-center" @click="addLike(post.post_uuid)"> <!-- Likes -->
|
||||
<div class="flex items-center" @click="addLike_comment(c.comment_id)"> <!-- Likes -->
|
||||
<img alt="" src="../assets/icons/herz.png" class="align-middle">
|
||||
<label class="text-sm m-1 text-weiss">{{ c.likes }}</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div v-else class="p-4 text-gray-400">No comments yet.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user