Skip to content

Commit

Permalink
Merge branch 'develop' into update-deps3
Browse files Browse the repository at this point in the history
  • Loading branch information
syuilo committed Jul 28, 2024
2 parents be7abad + 5df85b8 commit a2b65e6
Showing 1 changed file with 9 additions and 7 deletions.
16 changes: 9 additions & 7 deletions packages/frontend/src/components/MkModalWindow.vue
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,12 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkModal ref="modal" :preferType="'dialog'" @click="onBgClick" @closed="emit('closed')" @esc="emit('esc')">
<div ref="rootEl" :class="$style.root" :style="{ width: `${width}px`, height: `min(${height}px, 100%)` }">
<div ref="headerEl" :class="$style.header">
<button v-if="withOkButton" :class="$style.headerButton" class="_button" @click="$emit('close')"><i class="ti ti-x"></i></button>
<button v-if="withOkButton && withCloseButton" :class="$style.headerButton" class="_button" @click="emit('close')"><i class="ti ti-x"></i></button>
<span :class="$style.title">
<slot name="header"></slot>
</span>
<button v-if="!withOkButton" :class="$style.headerButton" class="_button" data-cy-modal-window-close @click="$emit('close')"><i class="ti ti-x"></i></button>
<button v-if="withOkButton" :class="$style.headerButton" class="_button" :disabled="okButtonDisabled" @click="$emit('ok')"><i class="ti ti-check"></i></button>
<button v-if="!withOkButton && withCloseButton" :class="$style.headerButton" class="_button" data-cy-modal-window-close @click="emit('close')"><i class="ti ti-x"></i></button>
<button v-if="withOkButton" :class="$style.headerButton" class="_button" :disabled="okButtonDisabled" @click="emit('ok')"><i class="ti ti-check"></i></button>
</div>
<div :class="$style.body">
<slot :width="bodyWidth" :height="bodyHeight"></slot>
Expand All @@ -27,11 +27,13 @@ import MkModal from './MkModal.vue';

const props = withDefaults(defineProps<{
withOkButton: boolean;
withCloseButton: boolean;
okButtonDisabled: boolean;
width: number;
height: number;
}>(), {
withOkButton: false,
withCloseButton: true,
okButtonDisabled: false,
width: 400,
height: 500,
Expand All @@ -51,13 +53,13 @@ const headerEl = shallowRef<HTMLElement>();
const bodyWidth = ref(0);
const bodyHeight = ref(0);

const close = () => {
function close() {
modal.value?.close();
};
}

const onBgClick = () => {
function onBgClick() {
emit('click');
};
}

const ro = new ResizeObserver((entries, observer) => {
if (rootEl.value == null || headerEl.value == null) return;
Expand Down

0 comments on commit a2b65e6

Please sign in to comment.