Dialog: trigger closed event when closing animation ends (#11490)

* Dialog: trigger closed event when close animation ends

* Update dialog.md

* Update dialog.md

examples/docs/en-US/dialog.md

@@ -310,3 +310,4 @@ If the variable bound to `visible` is managed in Vuex store, the `.sync` can not
 |---------- |-------- |---------- |
 | open | triggers when the Dialog opens | — |
 | close | triggers when the Dialog closes | — |
+| closed | triggers when the Dialog closing animation ends | — |

examples/docs/es/dialog.md

@@ -318,3 +318,4 @@ Si la variable ligada a `visible` se gestiona en el Vuex store, el `.sync` no pu
 | ---------------- | ---------------------------------------- | ---------- |
 | open             | se activa cuando se abre el cuadro de Diálogo | —          |
 | close            | se dispara cuando el Diálogo se cierra   | —          |
+| closed           | triggers when the Dialog closing animation ends | — |

examples/docs/zh-CN/dialog.md

@@ -304,5 +304,6 @@ Dialog 的内容是懒渲染的，即在第一次被打开之前，传入的默
 ### Events
 | 事件名称      | 说明    | 回调参数      |
 |---------- |-------- |---------- |
-| close  | Dialog 关闭的回调 | — |
 | open  | Dialog 打开的回调 | — |
+| close  | Dialog 关闭的回调 | — |
+| closed | Dialog 关闭动画结束时的回调 | — |

packages/dialog/src/component.vue

@@ -1,5 +1,7 @@
 <template>
-  <transition name="dialog-fade">
+  <transition
+    name="dialog-fade"
+    @after-leave="afterLeave">
     <div class="el-dialog__wrapper" v-show="visible" @click.self="handleWrapperClick">
       <div
         class="el-dialog"
@@ -166,6 +168,9 @@
       updatePopper() {
         this.broadcast('ElSelectDropdown', 'updatePopper');
         this.broadcast('ElDropdownMenu', 'updatePopper');
+      },
+      afterLeave() {
+        this.$emit('closed');
       }
     },