diff options
Diffstat (limited to 'packages/frontend/src/components/MkModalWindow.vue')
| -rw-r--r-- | packages/frontend/src/components/MkModalWindow.vue | 24 |
1 files changed, 12 insertions, 12 deletions
diff --git a/packages/frontend/src/components/MkModalWindow.vue b/packages/frontend/src/components/MkModalWindow.vue index 1fdf0beb26..7e185e8453 100644 --- a/packages/frontend/src/components/MkModalWindow.vue +++ b/packages/frontend/src/components/MkModalWindow.vue @@ -22,7 +22,7 @@ SPDX-License-Identifier: AGPL-3.0-only </template> <script lang="ts" setup> -import { onMounted, onUnmounted } from 'vue'; +import { onMounted, onUnmounted, shallowRef, ref } from 'vue'; import MkModal from './MkModal.vue'; const props = withDefaults(defineProps<{ @@ -44,14 +44,14 @@ const emit = defineEmits<{ (event: 'ok'): void; }>(); -let modal = $shallowRef<InstanceType<typeof MkModal>>(); -let rootEl = $shallowRef<HTMLElement>(); -let headerEl = $shallowRef<HTMLElement>(); -let bodyWidth = $ref(0); -let bodyHeight = $ref(0); +const modal = shallowRef<InstanceType<typeof MkModal>>(); +const rootEl = shallowRef<HTMLElement>(); +const headerEl = shallowRef<HTMLElement>(); +const bodyWidth = ref(0); +const bodyHeight = ref(0); const close = () => { - modal.close(); + modal.value.close(); }; const onBgClick = () => { @@ -67,14 +67,14 @@ const onKeydown = (evt) => { }; const ro = new ResizeObserver((entries, observer) => { - bodyWidth = rootEl.offsetWidth; - bodyHeight = rootEl.offsetHeight - headerEl.offsetHeight; + bodyWidth.value = rootEl.value.offsetWidth; + bodyHeight.value = rootEl.value.offsetHeight - headerEl.value.offsetHeight; }); onMounted(() => { - bodyWidth = rootEl.offsetWidth; - bodyHeight = rootEl.offsetHeight - headerEl.offsetHeight; - ro.observe(rootEl); + bodyWidth.value = rootEl.value.offsetWidth; + bodyHeight.value = rootEl.value.offsetHeight - headerEl.value.offsetHeight; + ro.observe(rootEl.value); }); onUnmounted(() => { |