aboutsummaryrefslogtreecommitdiff
path: root/resources/vue/components/theme/ThemeAddDialog.vue
blob: 9836009ff64cb52c95478f169cd8d4ab6c0ab69d (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<template>
    <StudipDialog
        v-if="displayThemeAddDialog"
        :title="$gettext('Theme hinzufügen')"
        :closeText="$gettext('Schließen')"
        closeClass="cancel"
        height="320"
        width="680"
        @close="showThemeAddDialog(false)"
    >
        <template v-slot:dialogContent>
            <div class="square-button-panel">
                <StudipSquareButton
                    icon="add"
                    :title="$gettext('Neu erstellen')"
                    @click="showThemeAddNewDialog(true)"
                />
                <StudipSquareButton
                    icon="import"
                    :title="$gettext('Aus Datei importieren')"
                    @click="showThemeAddImportDialog(true)"
                />
                <StudipSquareButton
                    icon="copy"
                    :title="$gettext('Duplizieren')"
                    @click="showThemeAddCopyDialog(true)"
                />
            </div>
        </template>
    </StudipDialog>
</template>

<script setup>
import { computed } from 'vue';
import StudipDialog from '../StudipDialog.vue';
import StudipSquareButton from '../StudipSquareButton.vue';
import { useStore } from 'vuex';

const emit = defineEmits(['add']);

const store = useStore();

const displayThemeAddDialog = computed(() => store.getters['theme-settings-module/showThemeAddDialog']);

const showThemeAddDialog = (show) => {
    store.dispatch('theme-settings-module/setShowThemeAddDialog', show);
};
const showThemeAddNewDialog = () => {
    store.dispatch('theme-settings-module/setShowThemeAddDialog', false);
    emit('add');
};
const showThemeAddImportDialog = () => {
    store.dispatch('theme-settings-module/setShowThemeAddDialog', false);
    store.dispatch('theme-settings-module/setShowThemeAddImportDialog', true);
};
const showThemeAddCopyDialog = () => {
    store.dispatch('theme-settings-module/setShowThemeAddDialog', false);
    store.dispatch('theme-settings-module/setShowThemeAddCopyDialog', true);
};
</script>