93 lines
2.8 KiB
Vue
93 lines
2.8 KiB
Vue
|
<template>
|
||
|
|
<div id="banlist">
|
||
|
|
<h3>Bans ({{pagination.total}})</h3>
|
||
|
|
<div class="message error" v-if="error">{{ error }}</div>
|
||
|
|
<div class="entry" v-else="v-else">
|
||
|
|
<div class="pgn">
|
||
|
|
<span class="pagenum">Page {{ pagination.page }} of {{ pagination.pages }}</span>
|
||
|
|
<div class="button" v-if="pagination.page > 1" v-on:click="getBans(pagination.page - 1)">Previous</div>
|
||
|
|
<div class="button" v-for="n in pagination.pages" v-on:click="getBans(n)" v-bind:class="{active: n == pagination.page}">{{ n }}</div>
|
||
|
|
<div class="button" v-if="pagination.page < pagination.pages" v-on:click="getBans(pagination.page + 1)">Next</div>
|
||
|
|
</div>
|
||
|
|
<div class="list bans">
|
||
|
|
<div class="ban list-item" v-for="ban in bans">
|
||
|
|
<div class="stamps">
|
||
|
|
<div class="noactive" title="Expired" v-if="ban.expired">
|
||
|
|
<i class="fa fa-fw fa-ban"></i>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="info">
|
||
|
|
<div class="section">
|
||
|
|
<span class="key">User</span>
|
||
|
|
<span class="value">{{ ban.user.display_name }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="section">
|
||
|
|
<span class="key">Admin</span>
|
||
|
|
<span class="value">{{ ban.admin.display_name }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="section">
|
||
|
|
<span class="key">Reason</span>
|
||
|
|
<span class="value">{{ ban.reason }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="section">
|
||
|
|
<span class="key">Placed</span>
|
||
|
|
<span class="value">{{ new Date(ban.created_at).toString() }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="section">
|
||
|
|
<span class="key">Expires</span>
|
||
|
|
<span class="value" v-if="ban.expires_at">{{ new Date(ban.expires_at).toString() }}</span>
|
||
|
|
<span class="value" v-else="v-else"><b>This ban is permanent.</b></span>
|
||
|
|
</div>
|
||
|
|
<div class="button remove" @click="pardon(ban.id)">Pardon</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script type="text/javascript">
|
||
|
|
module.exports = {
|
||
|
|
data: function () {
|
||
|
|
return {
|
||
|
|
pagination: {
|
||
|
|
offset: 0,
|
||
|
|
page: 1,
|
||
|
|
pages: 1,
|
||
|
|
perPage: 6,
|
||
|
|
total: 0
|
||
|
|
},
|
||
|
|
error: '',
|
||
|
|
bans: []
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
getBans: function (page) {
|
||
|
|
this.error = ''
|
||
|
|
this.pagination.total = 0
|
||
|
|
this.$http.get('/admin/api/bans?page=' + page).then(data => {
|
||
|
|
if (data.body && data.body.error) {
|
||
|
|
this.error = data.body.error
|
||
|
|
return
|
||
|
|
}
|
||
|
|
|
||
|
|
this.pagination = data.body.page
|
||
|
|
this.bans = data.body.bans
|
||
|
|
})
|
||
|
|
},
|
||
|
|
pardon: function (id) {
|
||
|
|
this.$http.post('/admin/api/ban/pardon/' + id).then(data => {
|
||
|
|
this.getBans(1)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted: function () {
|
||
|
|
this.getBans(1)
|
||
|
|
|
||
|
|
this.$root.$on('reload_bans', () => {
|
||
|
|
this.getBans(1)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|