40 lines
1.0 KiB
Vue
40 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
import { Message } from "@/store/models/model";
|
|
import { ref, watch, defineProps, PropType } from "vue";
|
|
import Content from "../structure/message/Content.vue";
|
|
import Modal from "./Modal.vue";
|
|
|
|
const props = defineProps({ messageId: { type: Number, require: true }, message: Object as PropType<Message> });
|
|
|
|
const messageId = ref(-1);
|
|
watch(
|
|
() => props.messageId,
|
|
(newMessageId: number | undefined) => {
|
|
if (!newMessageId) return;
|
|
messageId.value = newMessageId;
|
|
},
|
|
);
|
|
</script>
|
|
|
|
<template>
|
|
<div class="main">
|
|
<Modal v-if="messageId != -1" @close-modal="() => $emit('close')">
|
|
<template v-slot:body>
|
|
<div>{{ props.message?.subject ?? "No Object" }}</div>
|
|
<Content type="large" :content="props.message?.content" class="content" />
|
|
</template>
|
|
</Modal>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.main {
|
|
min-width: 700px;
|
|
}
|
|
/* todo define size automatically */
|
|
.content {
|
|
width: 700px;
|
|
height: 700px;
|
|
}
|
|
</style>
|