fix some dialog background on light theme

This commit is contained in:
lesion
2022-09-07 11:48:19 +02:00
parent e0d3b107a5
commit 4c6295351b
3 changed files with 68 additions and 68 deletions

View File

@@ -1,10 +1,10 @@
<template lang='pug'>
v-container
v-card-title {{$t('common.announcements')}}
v-card-title {{ $t('common.announcements') }}
v-card-subtitle(v-html="$t('admin.announcement_description')")
v-dialog(v-model='dialog' width='800px' :fullscreen='$vuetify.breakpoint.xsOnly')
v-card
v-card-title {{$t('admin.new_announcement')}}
v-card-title {{ $t('admin.new_announcement') }}
v-card-text.px-0
v-form(v-model='valid' ref='announcement' @submit.prevent='save' lazy-validation)
v-text-field.col-12(v-model='announcement.title'
@@ -14,21 +14,21 @@ v-container
border no-save max-height='400px' :placeholder="$t('common.description')")
v-card-actions
v-spacer
v-btn(@click='dialog=false' color='error') {{$t('common.cancel')}}
v-btn(@click='save' color='primary' :disabled='!valid || loading' :loading='loading') {{$t(`common.${editing?'save':'send'}`)}}
v-btn(@click='dialog = false' color='error' outlined) {{ $t('common.cancel') }}
v-btn(@click='save' color='primary' :disabled='!valid || loading' :loading='loading' outlined) {{ $t(`common.${editing ? 'save' : 'send'}`) }}
v-btn(@click='openDialog' text color='primary') <v-icon v-text='mdiPlus'></v-icon> {{$t('common.add')}}
v-btn(@click='openDialog' text color='primary') <v-icon v-text='mdiPlus'></v-icon> {{ $t('common.add') }}
v-card-text
v-data-table(
v-if='announcements.length'
:footer-props='{ prevIcon: mdiChevronLeft, nextIcon: mdiChevronRight }'
:headers='headers'
:items='announcements')
v-if='announcements.length'
:footer-props='{ prevIcon: mdiChevronLeft, nextIcon: mdiChevronRight }'
:headers='headers'
:items='announcements')
template(v-slot:item.actions='{ item }')
v-btn(text small @click.stop='toggle(item)'
:color='item.visible?"warning":"success"') {{item.visible?$t('common.disable'):$t('common.enable')}}
v-btn(text small @click='edit(item)' color='primary') {{$t('common.edit')}}
v-btn(text small @click='remove(item)' color='error') {{$t('common.delete')}}
:color='item.visible ? "warning" : "success"') {{ item.visible ? $t('common.disable') : $t('common.enable') }}
v-btn(text small @click='edit(item)' color='primary') {{ $t('common.edit') }}
v-btn(text small @click='remove(item)' color='error') {{ $t('common.delete') }}
</template>
<script>
import { mapActions } from 'vuex'
@@ -39,7 +39,7 @@ import { mdiPlus, mdiChevronRight, mdiChevronLeft } from '@mdi/js'
export default {
components: { Editor, Announcement },
data () {
data() {
return {
mdiPlus, mdiChevronRight, mdiChevronLeft,
valid: false,
@@ -54,32 +54,32 @@ export default {
announcement: { title: '', announcement: '' }
}
},
async mounted () {
async mounted() {
this.announcements = await this.$axios.$get('/announcements')
},
methods: {
...mapActions(['setAnnouncements']),
edit (announcement) {
edit(announcement) {
this.announcement.title = announcement.title
this.announcement.announcement = announcement.announcement
this.announcement.id = announcement.id
this.editing = true
this.dialog = true
},
openDialog () {
openDialog() {
this.announcement = { title: '', announcement: '' }
this.dialog = true
this.$nextTick(() => this.$refs.announcement.reset())
},
async toggle (announcement) {
async toggle(announcement) {
try {
announcement.visible = !announcement.visible
await this.$axios.$put(`/announcements/${announcement.id}`, announcement)
this.announcements = this.announcements.map(a => a.id === announcement.id ? announcement : a)
this.setAnnouncements(cloneDeep(this.announcements.filter(a => a.visible)))
} catch (e) {}
} catch (e) { }
},
async remove (announcement) {
async remove(announcement) {
const ret = await this.$root.$confirm('admin.delete_announcement_confirm')
if (!ret) { return }
this.$axios.delete(`/announcements/${announcement.id}`)
@@ -88,7 +88,7 @@ export default {
this.announcements = this.announcements.filter(a => a.id !== announcement.id)
})
},
async save () {
async save() {
if (!this.$refs.announcement.validate()) { return }
this.loading = true
try {