<template>
  <el-dialog
    class="modify-card"
    :visible.sync="modalIsShow"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :show-close="false"
    append-to-body
    fullscreen
    @open="visibleChange"
  >
    <div slot="title"></div>
    <div slot="footer"></div>

    <card-edit
      v-if="modalIsShow"
      is-dialog
      ref="CardEdit"
      @exit="editOver"
    ></card-edit>
  </el-dialog>
</template>

<script>
import CardEdit from "../views/CardEdit";

export default {
  name: "modify-card",
  components: { CardEdit },
  data() {
    return {
      modalIsShow: false
    };
  },
  methods: {
    visibleChange() {},
    cancel() {
      this.modalIsShow = false;
    },
    open() {
      this.modalIsShow = true;
    },
    editOver(cardId) {
      this.cancel();
      this.$emit("modified", cardId);
    }
  }
};
</script>
