|
@@ -1,47 +1,46 @@
|
|
|
+<script setup lang="ts">
|
|
|
+import { useStore } from "vuex";
|
|
|
+import { computed, ref } from "vue";
|
|
|
+import { useModalComponents } from "@/vuex_helpers";
|
|
|
+
|
|
|
+const store = useStore();
|
|
|
+
|
|
|
+const activeModals = computed(() => store.state.modalVisibility.activeModals);
|
|
|
+const modals = computed(() => store.state.modalVisibility.modals);
|
|
|
+
|
|
|
+const modalComponents = ref(
|
|
|
+ useModalComponents("components/modals", {
|
|
|
+ editUser: "EditUser.vue",
|
|
|
+ login: "Login.vue",
|
|
|
+ register: "Register.vue",
|
|
|
+ whatIsNew: "WhatIsNew.vue",
|
|
|
+ createStation: "CreateStation.vue",
|
|
|
+ editNews: "EditNews.vue",
|
|
|
+ manageStation: "ManageStation/index.vue",
|
|
|
+ editPlaylist: "EditPlaylist/index.vue",
|
|
|
+ createPlaylist: "CreatePlaylist.vue",
|
|
|
+ report: "Report.vue",
|
|
|
+ viewReport: "ViewReport.vue",
|
|
|
+ bulkActions: "BulkActions.vue",
|
|
|
+ viewApiRequest: "ViewApiRequest.vue",
|
|
|
+ viewPunishment: "ViewPunishment.vue",
|
|
|
+ removeAccount: "RemoveAccount.vue",
|
|
|
+ importAlbum: "ImportAlbum.vue",
|
|
|
+ confirm: "Confirm.vue",
|
|
|
+ editSongs: "EditSongs.vue",
|
|
|
+ editSong: "EditSong/index.vue",
|
|
|
+ viewYoutubeVideo: "ViewYoutubeVideo.vue"
|
|
|
+ })
|
|
|
+);
|
|
|
+</script>
|
|
|
+
|
|
|
<template>
|
|
|
<div>
|
|
|
<div v-for="activeModalUuid in activeModals" :key="activeModalUuid">
|
|
|
<component
|
|
|
- :is="this[modals[activeModalUuid]]"
|
|
|
+ :is="modalComponents[modals[activeModalUuid]]"
|
|
|
:modal-uuid="activeModalUuid"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import { mapState } from "vuex";
|
|
|
-
|
|
|
-import { mapModalComponents } from "@/vuex_helpers";
|
|
|
-
|
|
|
-export default {
|
|
|
- computed: {
|
|
|
- ...mapModalComponents("components/modals", {
|
|
|
- editUser: "EditUser.vue",
|
|
|
- login: "Login.vue",
|
|
|
- register: "Register.vue",
|
|
|
- whatIsNew: "WhatIsNew.vue",
|
|
|
- createStation: "CreateStation.vue",
|
|
|
- editNews: "EditNews.vue",
|
|
|
- manageStation: "ManageStation/index.vue",
|
|
|
- editPlaylist: "EditPlaylist/index.vue",
|
|
|
- createPlaylist: "CreatePlaylist.vue",
|
|
|
- report: "Report.vue",
|
|
|
- viewReport: "ViewReport.vue",
|
|
|
- bulkActions: "BulkActions.vue",
|
|
|
- viewApiRequest: "ViewApiRequest.vue",
|
|
|
- viewPunishment: "ViewPunishment.vue",
|
|
|
- removeAccount: "RemoveAccount.vue",
|
|
|
- importAlbum: "ImportAlbum.vue",
|
|
|
- confirm: "Confirm.vue",
|
|
|
- editSongs: "EditSongs.vue",
|
|
|
- editSong: "EditSong/index.vue",
|
|
|
- viewYoutubeVideo: "ViewYoutubeVideo.vue"
|
|
|
- }),
|
|
|
- ...mapState("modalVisibility", {
|
|
|
- activeModals: state => state.activeModals,
|
|
|
- modals: state => state.modals
|
|
|
- })
|
|
|
- }
|
|
|
-};
|
|
|
-</script>
|