You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

66 lines
1.9 KiB
Vue

<template>
<div>
<div style="padding: 10px;">
<thread-create v-if="this.with === 'true'" :user_id="this.user_id" @submitted="fetchThreads"></thread-create>
</div>
<h2>Browse Threads</h2>
<div class="card card-body" v-for="thread in threads" v-bind:key="thread.id">
<p v-if="thread.creator != null">{{ thread.creator.name }}</p>
<p v-else>[deleted]</p>
<a v-bind:href="'./test/' + thread.id"><h3>{{ thread.thread_title }}</h3></a>
<button v-if="deleteCheck(thread)" v-on:click="destroyThread(thread.id)" class="btn btn-danger">Delete</button>
</div>
</div>
</template>
<script>
export default {
props: ['user_id', 'with'],
data() {
return {
logged_in: this.user_id,
threads: [],
thread: {
id: '',
thread_title: '',
creator: {
id: '',
name: ''
},
},
thread_id: '',
scroll_flag: true,
edit: false
}
},
created() {
this.fetchThreads();
},
methods: {
fetchThreads() {
fetch("api/threads")
.then(res => res.json())
.then(res => {
this.threads = res.data;
if(this.scroll_flag) {
window.scrollTo(0,document.body.scrollHeight);
} else this.scroll_flag = true;
});
},
deleteCheck(thread) {
return thread.creator != null && this.user_id == thread.creator.id;
},
destroyThread(thread_id) {
fetch("api/thread/destroy/" + thread_id)
//.then(res => res.json())
.then(res => {
this.scroll_flag = false;
this.fetchThreads();
});
}
}
}
</script>