el-dialog二次封装@close和取消按钮的@click调用两次

el-dialog二次封装@close和取消按钮的@click共用一个函数会导致函数调用两次，这里的需要判断dialogVisible是不是已经关闭，关闭了就不再调用，这样就只会调用一次函数

<template>
  <div>
    <el-dialog :model-value="dialogVisible" v-bind="$attrs" :title="title" :close-on-click-modal='false' :close-on-press-escape='false' align-center @close="cancel">
      <slot></slot>
      <template v-if="isFoot" #footer>
        <span class="dialog-footer">
          <el-button v-if="isCancel" @click="cancel">Cancel</el-button>
          <el-button type="primary" @click="confirm">
            Confirm
          </el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script lang='ts' setup>
import { withDefaults } from 'vue';
const props = withDefaults(
  defineProps<{
    title: string;
    dialogVisible: boolean;
    isCancel: boolean;
    isFoot: boolean;
    isClose: boolean;
  }>(),
  {
    title: 'Tips',
    dialogVisible: false,
    isCancel: true,
    isFoot: true,
    isClose: true
  }
);
const emits = defineEmits([]);
const confirm = () => {
  emits('confirm');
  if (!props.isClose) return;
  emits('update:dialogVisible', false);
};
const cancel = () => {
  if (props.dialogVisible) {
    emits('cancel');
    emits('update:dialogVisible', false);
  }
};
</script>
<style lang='scss' scoped>
</style>