Recv/public/src/route/admin/CodeDetail.vue

127 lines
3.5 KiB
Vue

<template>
<div id="code">
<div v-if="code !== null">
<form class="pure-form pure-form-aligned">
<fieldset>
<div class="pure-control-group" v-if="code.id">
<label for="codeId">{{ $t('admin.codes.detail.code') }}</label>
<input id="codeId" type="text" readonly :value="code.id" class="pure-input-2-3">
</div>
<div class="pure-control-group" v-if="code.id">
<label for="user">{{ $t('admin.codes.detail.owner') }}</label>
<input id="user" type="text" readonly :value="code.username" class="pure-input-2-3">
</div>
<div class="pure-control-group" v-if="code.id">
<label for="created">{{ $t('admin.codes.detail.created') }}</label>
<input id="created" type="text" readonly :value="code.created | formatDateTime" class="pure-input-2-3">
</div>
<div class="pure-control-group">
<label for="description">{{ $t('admin.codes.detail.description') }}</label>
<input id="description" type="text" v-model="code.description" class="pure-input-2-3">
</div>
<div class="pure-form-description">
{{ $t('admin.codes.detail.descriptionHint' )}}
</div>
<!--
<div class="pure-control-group">
<label for="expiration">{{ $t('admin.codes.detail.expiration') }}</label>
<input id="expiration" type="text" :value="code.expiration" class="pure-input-2-3">
</div>
-->
<div class="pure-control-group">
<label for="message">{{ $t('admin.codes.detail.message') }}</label>
<textarea id="message" type="text" v-model="code.message" class="pure-input-2-3" rows="10"></textarea>
</div>
<div class="pure-form-description">
{{ $t('admin.codes.detail.messageHint' )}}
</div>
<div class="pure-controls">
<button class="pure-button pure-button-primary" @click="save" :disabled="saving">{{ $t('admin.save') }} <fa icon="spinner" pulse v-if="saving"></fa></button>
<router-link to="/admin/codes" class="pure-button">{{ $t('admin.cancel') }}</router-link>
</div>
</fieldset>
</form>
</div>
</div>
</template>
<script>
import axios from 'axios';
import shared from '../../shared';
export default {
data()
{
return {
code: null,
saving: false
};
},
props: ['codeParam'],
created()
{
var self = this;
if (self.codeParam)
{
axios.get('/admin/codes/' + encodeURIComponent(self.codeParam), {
headers: {
Authorization: 'Bearer ' + shared.adminToken
}
})
.then((response) =>
{
self.code = response.data;
})
.catch((error) => { shared.$emit('apiError', error, this.$router) });
}
else
{
self.code = {
expiration: null,
message: null
};
}
},
methods: {
save()
{
var self = this;
self.saving = true;
axios.post('/admin/codes', {
id: self.code.id,
expiration: self.code.expiration,
description: self.code.description,
message: self.code.message
}, {
headers: {
Authorization: 'Bearer ' + shared.adminToken
}
})
.then((response) =>
{
this.$router.push('/admin/codes');
})
.catch((error) => { shared.$emit('apiError', error, this.$router) })
.then(() =>
{
self.saving = false;
});
}
}
}
</script>
<style lang="scss">
</style>