kaverti/frontend
5
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

stuff

Browse source
This commit is contained in:
Troplo 2021-01-22 00:20:07 +11:00
parent 80a52bdcec
commit b981cbdafe
6 changed files with 257 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/components/Navbar.vue
View file

@ -327,24 +327,17 @@
</b-button>
</div>
</b-navbar-item>
<b-navbar-item v-if="$store.state.user.username">
<div class="navbar-item has-dropdown is-hoverable is-info">
<a class="navbar-link">
<p>{{$store.state.user.username}}</p>
</a>
<div class="navbar-dropdown">
<b-navbar-item tag="router-link" :to="'/u/' + $store.state.user.username">{{$t('navbar.user.profile')}}</b-navbar-item>
<b-navbar-item @click="settingsModal = true">{{$t('navbar.user.settings')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/transactions">{{$t('navbar.user.transactions')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/character">{{$t('navbar.user.avatar')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/creations">{{$t('navbar.user.creations')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/downloads">{{$t('navbar.user.downloads')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/admin" v-if="$store.state.user.admin">{{$t('navbar.user.admin')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/friends"><b-tag class="is-info" rounded> 1</b-tag>&nbsp; {{$t('navbar.user.friends')}}</b-navbar-item>
<b-navbar-item @click="logout()">{{$t('navbar.user.logout')}}</b-navbar-item>
</div>
</div>
</b-navbar-item>
<b-navbar-dropdown class="is-hoverable navbar-item" :label="$store.state.user.username">
<b-navbar-item tag="router-link" :to="'/u/' + $store.state.user.username">{{$t('navbar.user.profile')}}</b-navbar-item>
<b-navbar-item @click="settingsModal = true">{{$t('navbar.user.settings')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/transactions">{{$t('navbar.user.transactions')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/character">{{$t('navbar.user.avatar')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/creations">{{$t('navbar.user.creations')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/downloads">{{$t('navbar.user.downloads')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/admin" v-if="$store.state.user.admin">{{$t('navbar.user.admin')}}</b-navbar-item>
<b-navbar-item tag="router-link" to="/friends"><b-tag class="is-info" rounded> 1</b-tag>&nbsp; {{$t('navbar.user.friends')}}</b-navbar-item>
<b-navbar-item @click="logout()">{{$t('navbar.user.logout')}}</b-navbar-item>
</b-navbar-dropdown>
</div>
<b-navbar-item v-if="loading">
<div class="fa-1x">

11
src/router/index.js
View file

@ -93,6 +93,17 @@ const routes = [
name: 'MarketplaceItem',
component: route('MarketplaceItem')
},
{
path: '/friends',
redirect: '/friends/accepted',
name: 'Friends',
component: route('Friends')
},
{
path: '/friends/:category',
name: 'Friends',
component: route('Friends')
},
{
path: '/stats',
name: 'Stats',

210
src/views/Friends.vue Normal file
View file

@ -0,0 +1,210 @@
<template>
<main class="section">
<h1 class="title has-text-centered">{{name}}</h1>
<div class="tabs is-centered">
<ul>
<router-link tag="li" :to="'/friends/pendingCanAccept'" exact><a>{{ $t('friends.pendingCanAccept') }}</a></router-link>
<router-link tag="li" :to="'/friends/accepted'" exact><a>{{ $t('friends.accepted') }}</a></router-link>
<router-link tag="li" :to="'/friends/pending'" exact><a>{{ $t('friends.pending') }}</a></router-link>
</ul>
</div>
<div class="columns is-multiline">
<div class="column is-3 has-text-centered" v-for='(friend) in friends' :key='"friend-" + friend.id'>
<h1 class="title has-text-centered">{{friend.friend2.username}}</h1>
<div class="box">
<img :src="'https://cdn.kaverti.com/user/avatars/full/' + friend.friend2.picture + '.png'"><br>
<b-button class="is-warning has-text-centered is-centered is-center" v-if="friend.type === 'pending'"><i class="fas fa-minus"></i>&nbsp;Cancel Friend Request</b-button>
<b-button class="is-warning has-text-centered is-centered is-center" v-if="friend.type === 'pendingCanAccept'"><i class="fas fa-minus"></i>&nbsp;Deny Friend Request</b-button>
<b-button class="is-success has-text-centered is-centered is-center" v-if="friend.type === 'pendingCanAccept'"><i class="fas fa-plus"></i>&nbsp;Accept Friend Request</b-button>
<b-button class="is-danger has-text-centered is-centered is-center" v-if="friend.type === 'accepted'"><i class="fas fa-minus"></i>&nbsp;Remove Friend</b-button>
</div>
</div>
</div>
</main>
</template>
<script>
import AjaxErrorHandler from "../../assets/js/errorHandler";
export default {
name: 'Friends',
data() {
return {
friends: [],
name: 'Requests to you',
loading: true,
category: this.$route.params.category
}
},
watch: {
$route () {
this.loading = true
this.friends = []
this.offset = 0
this.category = this.$route.params.category
if(this.category === 'pendingCanAccept') {
this.name = "Requests to you"
} else if(this.category === 'pending') {
this.name = "Requests from you"
} else if(this.category === 'accepted') {
this.name = "Accepted Requests"
} else {
this.name = "Unknown"
}
this.getItems()
}
},
methods: {
removeFriend (username) {
this.axios
.put(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + '/' + 'relationships/remove', {
friend: username
})
.then(() => {
this.getItems()
})
.catch(e => {
this.refreshFriend()
this.description.loading = false
AjaxErrorHandler(this.$store)(e, error => {
this.description.error = error.message
})
this.axios
.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + `/` + `relationships/get/${this.$route.params.username}`)
.then(res => this.relationship = res.data, this.refreshFriend())
.catch(e => {
this.refreshFriend()
let invalidId = e.response.data.errors.find(error => {
return error.name === 'accountDoesNotExist'
})
if(invalidId) {
this.$store.commit('set404Page', true)
} else {
AjaxErrorHandler(this.$store)(e)
}
})
})
},
doRelationship () {
this.axios
.post(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + '/' + 'relationships/send', {
friend: this.$route.params.username
})
.then(() => {
this.refreshFriend()
this.description.loading = false
this.axios
.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + `/` + `relationships/get/${this.$route.params.username}`)
.then(res => this.relationship = res.data)
.catch(e => {
let invalidId = e.response.data.errors.find(error => {
return error.name === 'accountDoesNotExist'
})
if(invalidId) {
this.$store.commit('set404Page', true)
} else {
AjaxErrorHandler(this.$store)(e)
}
})
})
.catch(e => {
this.refreshFriend()
this.description.loading = false
AjaxErrorHandler(this.$store)(e)
this.axios
.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + `/` + `relationships/get/${this.$route.params.username}`)
.then(res => this.relationship = res.data)
.catch(e => {
let invalidId = e.response.data.errors.find(error => {
return error.name === 'accountDoesNotExist'
})
if(invalidId) {
this.$store.commit('set404Page', true)
} else {
AjaxErrorHandler(this.$store)(e)
}
})
})
},
doRelationshipAccept () {
this.axios
.put(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + '/' + 'relationships/accept', {
friend: this.$route.params.username
})
.then(() => {
this.refreshFriend()
this.description.loading = false
this.axios
.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + `/` + `relationships/get/${this.$route.params.username}`)
.then(res => this.relationship = res.data)
.catch(e => {
let invalidId = e.response.data.errors.find(error => {
return error.name === 'accountDoesNotExist'
})
if(invalidId) {
this.$store.commit('set404Page', true)
} else {
AjaxErrorHandler(this.$store)(e)
}
})
})
.catch(e => {
this.refreshFriend()
this.description.loading = false
AjaxErrorHandler(this.$store)(e, error => {
this.description.error = error.message
})
this.axios
.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + `/` + `relationships/get/${this.$route.params.username}`)
.then(res => this.relationship = res.data)
.catch(e => {
let invalidId = e.response.data.errors.find(error => {
return error.name === 'accountDoesNotExist'
})
if(invalidId) {
this.$store.commit('set404Page', true)
} else {
AjaxErrorHandler(this.$store)(e)
}
})
})
},
getItems () {
this.loading = true
this.axios
.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + '/' + 'relationships/getAll/' + this.category)
.then(res => {
this.friends = res.data.rows
this.loading = false
})
.catch((e) => {
this.loading = false
AjaxErrorHandler(this.$store)(e)
})
},
},
mounted() {
this.loading = true
this.friends = []
this.offset = 0
this.category = this.$route.params.category
if(this.category === 'pendingCanAccept') {
this.name = "Requests to you"
} else if(this.category === 'pending') {
this.name = "Requests from you"
} else if(this.category === 'accepted') {
this.name = "Accepted Requests"
} else {
this.name = "Unknown"
}
this.getItems()
}
}
</script>

5
src/views/Marketplace.vue
View file

@ -1,6 +1,6 @@
<template>
<main class="section">
<div class="column" style="float: left;">
<div class="column">
<nav class="panel">
<p class="panel-heading">
{{ $t('marketplace.filter') }} ({{category}})
@ -29,6 +29,7 @@
Most popular
</a>
</nav>
<br>
</div>
<div class="columns is-multiline" v-if="!loading">
<div v-if="!items.length" class="column">
@ -43,8 +44,8 @@
@loadNext='getItems(false)'
>
<div class="column is-3" style="float: left;" v-for='(item) in items' :key='"marketplace-" + item.id'>
<router-link :to="'/m/' + item.id" class="subtitle">{{item.name}}</router-link>
<div class="box">
<router-link :to="'/m/' + item.id" class="subtitle">{{item.name}}</router-link>
<img :src="'https://cdn.kaverti.com/marketplace/avatars/' + item.previewFile + '.png'" width="40%">
<div class="buttons is-centered is-center">
<b-button class="is-info" v-if="!item.saleEnabled">{{$t('user.inventoryTab.buyNow')}} <img style="vertical-align: middle" src="https://cdn.kaverti.com/icons/koins-white.svg" width="8%">{{item.price}}</b-button>

13
src/views/User.vue
View file

@ -10,7 +10,7 @@
<div class="column is-4 is-vcentered has-text-centered">
<h1 class="title">{{user.username}}&nbsp;<Badges :username="user.username" :system="user.system" :hidden="user.hidden" :admin="user.admin" :booster="user.booster" :bot="user.bot"></Badges></h1>
<div class="box">
<img :src="'https://cdn.kaverti.com/user/avatars/full/' + $store.state.user.avatar + '.png'" :alt="$store.state.user.username + '\'s avatar'" width="70%">
<img :src="'https://cdn.kaverti.com/user/avatars/full/' + $store.state.user.avatar + '.png'" :alt="$store.state.user.username + '\'s avatar'" width=25%>
</div>
<div class="buttons is-centered">
<b-button @click="doRelationship" class="is-success" v-if="relationships.type === 'notFriends' && user.username !== $store.state.user.username"><i class="fas fa-plus"></i> &nbsp;{{$t('relationships.notFriends')}}</b-button>
@ -78,8 +78,15 @@ export default {
}
},
watch: {
$route (to) {
this.selected = this.getIndexFromRoute(to.path)
'$route.params.username' () {
this.user = [{
username: "Loading",
description: "Loading",
createdAt: "2020-01-01T00:00:00.000Z"
}]
this.relationship = false
this.relationships.type = ''
this.fetchData()
}
},
computed: {

17
src/views/UserFriends.vue
View file

@ -1,9 +1,16 @@
<template>
<main>
<div class="column" v-if="!friends.length">
<i class="far fa-times-square large-icon"></i>
<h1 class="subtitle">This user doesn't have any friends yet, how about you send them a friend request?</h1>
<b-button>Send {{$route.params.username}} a friend request</b-button>
<div class="columns is-multiline">
<div class="column" v-if="!friends.length">
<i class="far fa-times-square large-icon"></i>
<h1 class="subtitle">This user doesn't have any friends yet, how about you send them a friend request?</h1>
</div>
<div class="column is-4" v-for='(friend) in friends' :key='"friend-" + friend.id'>
<div class="box">
<router-link :to="'/u/' + friend.friend2.username" class="subtitle">{{friend.friend2.username}}</router-link><br>
<img width=30% :src="'https://cdn.kaverti.com/user/avatars/headshot/' + friend.friend2.picture + '.png'">
</div>
</div>
</div>
</main>
</template>
@ -22,7 +29,7 @@ export default {
this.axios
.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + `/` + 'relationships/user/' + this.$route.params.username)
.then(res => {
this.inventory = res.data.Inventories
this.friends = res.data
})
.catch(e => {
let invalidId = e.response.data.errors.find(error => {