fix table footer and loaading in admin announcements

This commit is contained in:
les 2021-01-24 18:20:29 +01:00
parent 7bf2aba1d2
commit fd1dc5ab91

View file

@ -8,16 +8,18 @@
v-card-text v-card-text
v-form(v-model='valid' ref='announcement') v-form(v-model='valid' ref='announcement')
v-text-field(v-model='announcement.title' :label='$t("common.title")') v-text-field(v-model='announcement.title' :label='$t("common.title")')
Editor.mt-2(v-model='announcement.announcement' Editor.mt-2(v-model='announcement.announcement'
border no-save max-height='400px' :placeholder="$t('common.description')") border no-save max-height='400px' :placeholder="$t('common.description')")
v-card-actions v-card-actions
v-spacer v-spacer
v-btn(@click='dialog=false' color='error') {{$t('common.cancel')}} v-btn(@click='dialog=false' color='error') {{$t('common.cancel')}}
v-btn(@click='save' color='primary') {{$t(`common.${editing?'save':'send'}`)}} v-btn(@click='save' color='primary' :disabled='loading' :loading='loading') {{$t(`common.${editing?'save':'send'}`)}}
v-btn(@click='openDialog' text color='primary') <v-icon>mdi-plus</v-icon> {{$t('common.add')}} v-btn(@click='openDialog' text color='primary') <v-icon>mdi-plus</v-icon> {{$t('common.add')}}
v-card-text v-card-text
v-data-table( v-data-table(
v-if='announcements.length'
:hide-default-footer='announcements.length<10'
:headers='headers' :headers='headers'
:items='announcements') :items='announcements')
template(v-slot:item.actions='{ item }') template(v-slot:item.actions='{ item }')
@ -41,6 +43,7 @@ export default {
dialog: false, dialog: false,
editing: false, editing: false,
announcements: [], announcements: [],
loading: false,
headers: [ headers: [
{ value: 'title', text: 'Title' }, { value: 'title', text: 'Title' },
{ value: 'actions', text: 'Actions', align: 'right' } { value: 'actions', text: 'Actions', align: 'right' }
@ -63,7 +66,7 @@ export default {
openDialog () { openDialog () {
this.announcement = { title: '', announcement: '' } this.announcement = { title: '', announcement: '' }
this.dialog = true this.dialog = true
this.$nextTick( () => this.$refs.announcement.reset() ) this.$nextTick(() => this.$refs.announcement.reset())
}, },
async toggle (announcement) { async toggle (announcement) {
try { try {
@ -75,7 +78,7 @@ export default {
}, },
async remove (announcement) { async remove (announcement) {
const ret = await this.$root.$confirm('admin.delete_announcement_confirm') const ret = await this.$root.$confirm('admin.delete_announcement_confirm')
if (!ret) return if (!ret) { return }
this.$axios.delete(`/announcements/${announcement.id}`) this.$axios.delete(`/announcements/${announcement.id}`)
.then(() => { .then(() => {
this.$root.$message('admin.announcement_remove_ok') this.$root.$message('admin.announcement_remove_ok')
@ -83,6 +86,7 @@ export default {
}) })
}, },
async save () { async save () {
this.loading = true
try { try {
let announcement = null let announcement = null
if (this.editing) { if (this.editing) {
@ -100,6 +104,7 @@ export default {
} catch (e) { } catch (e) {
console.error(e) console.error(e)
} }
this.loading = false
} }
} }
} }