refs #3301 Rewrite Modal with composition API

This commit is contained in:
AkiraFukushima 2022-05-03 18:52:08 +09:00
parent c2d0c42dbb
commit fc8c9eafb5
No known key found for this signature in database
GPG Key ID: B6E51BAC4DE1A957
2 changed files with 30 additions and 22 deletions

View File

@ -13,7 +13,6 @@
</el-row> </el-row>
</el-header> </el-header>
<el-container> <el-container>
<div></div>
<el-aside width="240px" class="menu"> <el-aside width="240px" class="menu">
<el-menu <el-menu
:default-active="activeRoute()" :default-active="activeRoute()"

View File

@ -11,18 +11,19 @@
</div> </div>
</template> </template>
<script> <script lang="ts">
import { mapState } from 'vuex' import { defineComponent, computed } from 'vue'
import NewToot from './Modals/NewToot' import { useStore } from '@/store'
import Jump from './Modals/Jump' import NewToot from './Modals/NewToot.vue'
import ImageViewer from './Modals/ImageViewer' import Jump from './Modals/Jump.vue'
import ListMembership from './Modals/ListMembership' import ImageViewer from './Modals/ImageViewer.vue'
import AddListMember from './Modals/AddListMember' import ListMembership from './Modals/ListMembership.vue'
import MuteConfirm from './Modals/MuteConfirm' import AddListMember from './Modals/AddListMember.vue'
import Shortcut from './Modals/Shortcut' import MuteConfirm from './Modals/MuteConfirm.vue'
import Report from './Modals/Report' import Shortcut from './Modals/Shortcut.vue'
import Report from './Modals/Report.vue'
export default { export default defineComponent({
name: 'modals', name: 'modals',
components: { components: {
NewToot, NewToot,
@ -34,15 +35,23 @@ export default {
Shortcut, Shortcut,
Report Report
}, },
computed: { setup() {
...mapState({ const store = useStore()
newTootModal: state => state.TimelineSpace.Modals.NewToot.modalOpen, const newTootModal = computed(() => store.state.TimelineSpace.Modals.NewToot.modalOpen)
jumpModal: state => state.TimelineSpace.Modals.Jump.modalOpen, const jumpModal = computed(() => store.state.TimelineSpace.Modals.Jump.modalOpen)
reportModal: state => state.TimelineSpace.Modals.Report.modalOpen, const reportModal = computed(() => store.state.TimelineSpace.Modals.Report.modalOpen)
muteConfirmModal: state => state.TimelineSpace.Modals.MuteConfirm.modalOpen, const muteConfirmModal = computed(() => store.state.TimelineSpace.Modals.MuteConfirm.modalOpen)
addListMemberModal: state => state.TimelineSpace.Modals.AddListMember.modalOpen, const addListMemberModal = computed(() => store.state.TimelineSpace.Modals.AddListMember.modalOpen)
listMembershipModal: state => state.TimelineSpace.Modals.ListMembership.modalOpen const listMembershipModal = computed(() => store.state.TimelineSpace.Modals.ListMembership.modalOpen)
return {
newTootModal,
jumpModal,
reportModal,
muteConfirmModal,
addListMemberModal,
listMembershipModal
}
}
}) })
}
}
</script> </script>