118 lines
3.3 KiB
Vue
118 lines
3.3 KiB
Vue
<template>
|
|
<div id="codes">
|
|
<router-link to="codes/add" class="pure-button pure-button-primary">{{ $t('admin.codes.add') }}</router-link>
|
|
|
|
<div v-if="codes !== null">
|
|
<div class="pure-g list-header">
|
|
<div class="pure-u-9-24"><span class="text">{{ $t('admin.codes.list.code') }}</span></div>
|
|
<div class="pure-u-9-24"><span class="text" v-if="hasAuth('viewAllCodes')">{{ $t('admin.codes.list.owner') }}</span></div>
|
|
<div class="pure-u-1-4"><span class="text">{{ $t('admin.codes.list.actions') }}</span></div>
|
|
</div>
|
|
|
|
<div v-for="code in codes" class="list">
|
|
<div class="pure-g row">
|
|
<div class="pure-u-9-24">
|
|
<span class="text code"><router-link :to="'codes/edit/' + encodeURIComponent(code.id)">{{ code.id }}</router-link></span>
|
|
<span class="text description" v-if="code.description">{{ code.description }}</span>
|
|
</div>
|
|
<div class="pure-u-9-24">
|
|
<span class="text" v-if="hasAuth('viewAllCodes')" :class="{ userDeleted: !code.username }">
|
|
{{ code.username || $t('admin.codes.list.userDeleted') }}
|
|
</span>
|
|
</div>
|
|
<div class="pure-u-1-4">
|
|
<button class="pure-button"v-if="confirmDelete == code.id" @click.prevent="cancelDelete"><fa icon="ban"></fa></button>
|
|
<button class="pure-button" :class="{ confirmDelete: confirmDelete == code.id }" @click.prevent="deleteClick(code.id)"><fa icon="trash-alt"></fa></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if="codes.length == 0" class="nodata">
|
|
{{ $t('admin.empty') }}
|
|
</div>
|
|
</div>
|
|
|
|
<div v-else class="loading">
|
|
{{ $t('admin.loading') }}
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import axios from 'axios';
|
|
import shared from '../../shared';
|
|
|
|
export default {
|
|
data()
|
|
{
|
|
return {
|
|
codes: null,
|
|
confirmDelete: null
|
|
};
|
|
},
|
|
|
|
created()
|
|
{
|
|
var self = this;
|
|
|
|
axios.get('/admin/codes', {
|
|
headers: {
|
|
Authorization: 'Bearer ' + shared.adminToken
|
|
}
|
|
})
|
|
.then((response) =>
|
|
{
|
|
self.codes = _.orderBy(response.data, ['created'], ['desc']);
|
|
})
|
|
.catch((error) => { shared.$emit('apiError', error, this.$router) });
|
|
},
|
|
|
|
|
|
methods: {
|
|
hasAuth(token)
|
|
{
|
|
return shared.user !== null && shared.user.auth.indexOf(token) > -1;
|
|
},
|
|
|
|
|
|
deleteClick(codeId)
|
|
{
|
|
var self = this;
|
|
|
|
if (self.confirmDelete == codeId)
|
|
{
|
|
self.confirmDelete = null;
|
|
|
|
axios.delete('/admin/codes/' + encodeURIComponent(codeId), {
|
|
headers: {
|
|
Authorization: 'Bearer ' + shared.adminToken
|
|
}})
|
|
.then((response) =>
|
|
{
|
|
var index = _.findIndex(self.codes, (item) => { return item.id == codeId; });
|
|
if (index > -1)
|
|
self.codes.splice(index, 1);
|
|
})
|
|
.catch((error) => { shared.$emit('apiError', error, this.$router) });
|
|
}
|
|
else
|
|
{
|
|
self.confirmDelete = codeId;
|
|
}
|
|
},
|
|
|
|
cancelDelete()
|
|
{
|
|
var self = this;
|
|
self.confirmDelete = null;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.description
|
|
{
|
|
display: block;
|
|
}
|
|
</style> |