Modal

Модальное окно с совместимыми зонами alert, form и footer.

Основа компонента

Компонент построен на Modal из Ant Design Vue.

vue

<script setup lang="ts">
import { ref } from 'vue'
import { Button, Modal } from '@minitwiks/nsmp-vue-components'

const open = ref(false)
</script>

<template>
  <Button type="primary" @click="open = true">
    Открыть окно
  </Button>

  <Modal v-model:open="open" title="Редактирование">
    <template #form>
      Здесь располагается содержимое формы.
    </template>

    <template #footer>
      <Button type="primary" @click="open = false">
        Готово
      </Button>
    </template>
  </Modal>
</template>

Компонент принимает стандартные props Ant Design Vue Modal, кроме управляемого здесь open. Методы show() и hidden() доступны через template ref.

Modal ​