<template>
  <div class="imgEditor">
    <slot></slot>
    <div class="btngroup">
      <el-button type="primary" round @click.stop="save">保 存</el-button>
      <el-button type="danger" round @click.stop="deleteFunc">删 除</el-button>
    </div>
  </div>
</template>

<script setup>
import { defineEmits } from 'vue';
const emits = defineEmits(['save', 'deleteFunc']);

const save = () => {
    emits('save');    
};

const deleteFunc = () => {
    emits('deleteFunc');    
}
</script>

<style>
.imgEditor {
  width: 100%;
  height: 100%;
  padding: 1em;
  position: relative;
}
.btngroup {
  text-align: center;
  padding: 0.5em 0;
  position: absolute;
  bottom: 1.5em;
  left: 0;
  width: 100%;
  z-index: 1;
}

.btngroup .el-button {
  width: 8em;
}
</style>

