From 96668cc44341150b73c3385a4053c1d52b6ea790 Mon Sep 17 00:00:00 2001
From: James <72028410+James-9696@users.noreply.github.com>
Date: Tue, 19 Dec 2023 15:02:48 +0800
Subject: [PATCH] docs(fix):Update dialog-box docs (#1173)

* doc(fix):[carousel,color-picker,color-select-panel,config-provider,crop,dialog-box] Update doc text

* docs(fix):Update dialog-box docs
---
 .../basic-usage-composition-api.vue           |  2 +-
 .../demos/pc/app/dialog-box/basic-usage.vue   |  2 +-
 .../app/dialog-box/center-composition-api.vue |  4 +-
 .../sites/demos/pc/app/dialog-box/center.vue  |  4 +-
 .../close-on-click-modal-composition-api.vue  |  4 +-
 .../app/dialog-box/close-on-click-modal.vue   |  4 +-
 .../close-on-press-escape-composition-api.vue |  4 +-
 .../app/dialog-box/close-on-press-escape.vue  |  4 +-
 .../custom-dialog-content-composition-api.vue |  4 +-
 .../app/dialog-box/custom-dialog-content.vue  |  4 +-
 .../custom-dialog-footer-composition-api.vue  |  4 +-
 .../app/dialog-box/custom-dialog-footer.vue   |  8 +--
 .../custom-dialog-title-composition-api.vue   |  4 +-
 .../pc/app/dialog-box/custom-dialog-title.vue |  4 +-
 .../dialog-top-height-composition-api.vue     |  4 +-
 .../pc/app/dialog-box/dialog-top-height.vue   |  4 +-
 .../dialog-width-composition-api.vue          |  6 +-
 .../demos/pc/app/dialog-box/dialog-width.vue  |  6 +-
 .../lock-scroll-composition-api.vue           |  4 +-
 .../demos/pc/app/dialog-box/lock-scroll.vue   |  4 +-
 .../pc/app/dialog-box/webdoc/dialog-box.js    | 64 +++++++++----------
 21 files changed, 74 insertions(+), 74 deletions(-)

diff --git a/examples/sites/demos/pc/app/dialog-box/basic-usage-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/basic-usage-composition-api.vue
index ac6f73761..5a27db035 100644
--- a/examples/sites/demos/pc/app/dialog-box/basic-usage-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/basic-usage-composition-api.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility">弹出Dialog</tiny-button>
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility">弹出 Dialog</tiny-button>
     <tiny-dialog-box v-model:visible="boxVisibility" title="消息" width="30%">
       <span>dialog-box内容</span>
       <template #footer>
diff --git a/examples/sites/demos/pc/app/dialog-box/basic-usage.vue b/examples/sites/demos/pc/app/dialog-box/basic-usage.vue
index 8074debd9..d0280c455 100644
--- a/examples/sites/demos/pc/app/dialog-box/basic-usage.vue
+++ b/examples/sites/demos/pc/app/dialog-box/basic-usage.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility">弹出Dialog</tiny-button>
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility">弹出 Dialog</tiny-button>
     <tiny-dialog-box v-model:visible="boxVisibility" title="消息" width="30%">
       <span>dialog-box内容</span>
       <template #footer>
diff --git a/examples/sites/demos/pc/app/dialog-box/center-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/center-composition-api.vue
index 917691ba4..ede1c1c56 100644
--- a/examples/sites/demos/pc/app/dialog-box/center-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/center-composition-api.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" center title="消息" width="30%">
       <span>dialog-box内容</span>
diff --git a/examples/sites/demos/pc/app/dialog-box/center.vue b/examples/sites/demos/pc/app/dialog-box/center.vue
index 4b5c11b0a..301e39b67 100644
--- a/examples/sites/demos/pc/app/dialog-box/center.vue
+++ b/examples/sites/demos/pc/app/dialog-box/center.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" center title="消息" width="30%">
       <span>dialog-box内容</span>
diff --git a/examples/sites/demos/pc/app/dialog-box/close-on-click-modal-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/close-on-click-modal-composition-api.vue
index 4e888a9ec..2f32b159f 100644
--- a/examples/sites/demos/pc/app/dialog-box/close-on-click-modal-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/close-on-click-modal-composition-api.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" :close-on-click-modal="false" title="消息" width="30%">
       <span>dialog-box内容</span>
diff --git a/examples/sites/demos/pc/app/dialog-box/close-on-click-modal.vue b/examples/sites/demos/pc/app/dialog-box/close-on-click-modal.vue
index 988c6698d..e2ab315d4 100644
--- a/examples/sites/demos/pc/app/dialog-box/close-on-click-modal.vue
+++ b/examples/sites/demos/pc/app/dialog-box/close-on-click-modal.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" :close-on-click-modal="false" title="消息" width="30%">
       <span>dialog-box内容</span>
diff --git a/examples/sites/demos/pc/app/dialog-box/close-on-press-escape-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/close-on-press-escape-composition-api.vue
index e4fca867c..c6d0803a8 100644
--- a/examples/sites/demos/pc/app/dialog-box/close-on-press-escape-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/close-on-press-escape-composition-api.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box :visible="boxVisibility" :close-on-press-escape="false" title="消息" width="30%" @close="close">
       <span>dialog-box内容</span>
diff --git a/examples/sites/demos/pc/app/dialog-box/close-on-press-escape.vue b/examples/sites/demos/pc/app/dialog-box/close-on-press-escape.vue
index 2c766bb00..8ef5009f0 100644
--- a/examples/sites/demos/pc/app/dialog-box/close-on-press-escape.vue
+++ b/examples/sites/demos/pc/app/dialog-box/close-on-press-escape.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box :visible="boxVisibility" :close-on-press-escape="false" title="消息" width="30%" @close="close">
       <span>dialog-box内容</span>
diff --git a/examples/sites/demos/pc/app/dialog-box/custom-dialog-content-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/custom-dialog-content-composition-api.vue
index 6e0b9b601..878c9db66 100644
--- a/examples/sites/demos/pc/app/dialog-box/custom-dialog-content-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/custom-dialog-content-composition-api.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" title="消息" width="30%">
       <tiny-alert description="内容是Alert组件"></tiny-alert>
diff --git a/examples/sites/demos/pc/app/dialog-box/custom-dialog-content.vue b/examples/sites/demos/pc/app/dialog-box/custom-dialog-content.vue
index a9279f5f2..3f3c990f9 100644
--- a/examples/sites/demos/pc/app/dialog-box/custom-dialog-content.vue
+++ b/examples/sites/demos/pc/app/dialog-box/custom-dialog-content.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" title="消息" width="30%">
       <tiny-alert description="内容是Alert组件"></tiny-alert>
diff --git a/examples/sites/demos/pc/app/dialog-box/custom-dialog-footer-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/custom-dialog-footer-composition-api.vue
index d4ac738d2..60e54237f 100644
--- a/examples/sites/demos/pc/app/dialog-box/custom-dialog-footer-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/custom-dialog-footer-composition-api.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" title="消息" width="30%">
       <span>dialog-box内容</span>
diff --git a/examples/sites/demos/pc/app/dialog-box/custom-dialog-footer.vue b/examples/sites/demos/pc/app/dialog-box/custom-dialog-footer.vue
index 59f46f5b4..6f27b77bd 100644
--- a/examples/sites/demos/pc/app/dialog-box/custom-dialog-footer.vue
+++ b/examples/sites/demos/pc/app/dialog-box/custom-dialog-footer.vue
@@ -1,12 +1,12 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" title="消息" width="30%">
-      <span>dialog-box内容</span>
+      <span>dialog-box 内容</span>
       <template #footer>
-        <div style="width: 100%; height: 100%; background: #dddddd">自定义footer区域</div>
+        <div style="width: 100%; height: 100%; background: #dddddd">自定义 footer 区域</div>
       </template>
     </tiny-dialog-box>
   </div>
diff --git a/examples/sites/demos/pc/app/dialog-box/custom-dialog-title-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/custom-dialog-title-composition-api.vue
index 3ae8686dc..df9bafb1a 100644
--- a/examples/sites/demos/pc/app/dialog-box/custom-dialog-title-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/custom-dialog-title-composition-api.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" width="30%">
       <template #title>
diff --git a/examples/sites/demos/pc/app/dialog-box/custom-dialog-title.vue b/examples/sites/demos/pc/app/dialog-box/custom-dialog-title.vue
index 570d6f738..f8b46747a 100644
--- a/examples/sites/demos/pc/app/dialog-box/custom-dialog-title.vue
+++ b/examples/sites/demos/pc/app/dialog-box/custom-dialog-title.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility = true" :title="'弹出Dialog' + boxVisibility"
-      >弹出Dialog{{ boxVisibility }}</tiny-button
+    <tiny-button @click="boxVisibility = true" :title="'弹出 Dialog' + boxVisibility"
+      >弹出 Dialog{{ boxVisibility }}</tiny-button
     >
     <tiny-dialog-box v-model:visible="boxVisibility" width="30%">
       <template #title>
diff --git a/examples/sites/demos/pc/app/dialog-box/dialog-top-height-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/dialog-top-height-composition-api.vue
index 83aaed3b1..e606462a3 100644
--- a/examples/sites/demos/pc/app/dialog-box/dialog-top-height-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/dialog-top-height-composition-api.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility1 = true">显示在顶部</tiny-button>
-    <tiny-button @click="boxVisibility2 = true">距离顶部300px</tiny-button>
+    <tiny-button @click="boxVisibility1 = true" type="info">显示在顶部</tiny-button>
+    <tiny-button @click="boxVisibility2 = true">距离顶部 300px</tiny-button>
     <tiny-dialog-box top="0" v-model:visible="boxVisibility1" title="消息" width="30%">
       <span>dialog-box内容</span>
       <template #footer>
diff --git a/examples/sites/demos/pc/app/dialog-box/dialog-top-height.vue b/examples/sites/demos/pc/app/dialog-box/dialog-top-height.vue
index e3b1a326c..999914000 100644
--- a/examples/sites/demos/pc/app/dialog-box/dialog-top-height.vue
+++ b/examples/sites/demos/pc/app/dialog-box/dialog-top-height.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility1 = true">显示在顶部</tiny-button>
-    <tiny-button @click="boxVisibility2 = true">距离顶部300px</tiny-button>
+    <tiny-button @click="boxVisibility1 = true" type="info">显示在顶部</tiny-button>
+    <tiny-button @click="boxVisibility2 = true">距离顶部 300px</tiny-button>
     <tiny-dialog-box top="0" v-model:visible="boxVisibility1" title="消息" width="30%">
       <span>dialog-box内容</span>
       <template #footer>
diff --git a/examples/sites/demos/pc/app/dialog-box/dialog-width-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/dialog-width-composition-api.vue
index 2c85c3e99..7f2ab688a 100644
--- a/examples/sites/demos/pc/app/dialog-box/dialog-width-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/dialog-width-composition-api.vue
@@ -1,8 +1,8 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility1 = true">宽度30%</tiny-button>
-    <tiny-button @click="boxVisibility2 = true">宽度60%</tiny-button>
-    <tiny-dialog-box v-model:visible="boxVisibility1" title="消息" width="30%" dialog-class="mydialogBox">
+    <tiny-button @click="boxVisibility1 = true" type="info">宽度 30%</tiny-button>
+    <tiny-button @click="boxVisibility2 = true">宽度 60%</tiny-button>
+    <tiny-dialog-box v-model:visible="boxVisibility1" title="消息" width="30%">
       <span>dialog-box内容</span>
       <template #footer>
         <tiny-button type="primary" @click="boxVisibility1 = false">确 定</tiny-button>
diff --git a/examples/sites/demos/pc/app/dialog-box/dialog-width.vue b/examples/sites/demos/pc/app/dialog-box/dialog-width.vue
index eeaf70a03..fe7a117b0 100644
--- a/examples/sites/demos/pc/app/dialog-box/dialog-width.vue
+++ b/examples/sites/demos/pc/app/dialog-box/dialog-width.vue
@@ -1,8 +1,8 @@
 <template>
   <div>
-    <tiny-button @click="boxVisibility1 = true">宽度30%</tiny-button>
-    <tiny-button @click="boxVisibility2 = true">宽度60%</tiny-button>
-    <tiny-dialog-box v-model:visible="boxVisibility1" title="消息" width="30%" dialog-class="mydialogBox">
+    <tiny-button @click="boxVisibility1 = true" type="info">宽度 30%</tiny-button>
+    <tiny-button @click="boxVisibility2 = true">宽度 60%</tiny-button>
+    <tiny-dialog-box v-model:visible="boxVisibility1" title="消息" width="30%">
       <span>dialog-box内容</span>
       <template #footer>
         <tiny-button type="primary" @click="boxVisibility1 = false">确 定</tiny-button>
diff --git a/examples/sites/demos/pc/app/dialog-box/lock-scroll-composition-api.vue b/examples/sites/demos/pc/app/dialog-box/lock-scroll-composition-api.vue
index b6dafe887..f44f43b94 100644
--- a/examples/sites/demos/pc/app/dialog-box/lock-scroll-composition-api.vue
+++ b/examples/sites/demos/pc/app/dialog-box/lock-scroll-composition-api.vue
@@ -1,13 +1,13 @@
 <template>
   <div>
-    <tiny-button @click="box1 = true">允许滚动背景</tiny-button>
+    <tiny-button @click="box1 = true" type="info">允许滚动背景</tiny-button>
+    <tiny-button @click="box2 = true">不允许滚动背景</tiny-button>
     <tiny-dialog-box :lock-scroll="false" v-model:visible="box1" title="消息" width="30%">
       <span>不锁定被遮罩内容的滚动</span>
       <template #footer>
         <tiny-button type="primary" @click="box1 = false">确 定</tiny-button>
       </template>
     </tiny-dialog-box>
-    <tiny-button @click="box2 = true">不允许滚动背景</tiny-button>
     <tiny-dialog-box :lock-scroll="true" v-model:visible="box2" title="消息" width="30%">
       <span>锁定被遮罩内容的滚动</span>
       <template #footer>
diff --git a/examples/sites/demos/pc/app/dialog-box/lock-scroll.vue b/examples/sites/demos/pc/app/dialog-box/lock-scroll.vue
index 567fa442a..127d88571 100644
--- a/examples/sites/demos/pc/app/dialog-box/lock-scroll.vue
+++ b/examples/sites/demos/pc/app/dialog-box/lock-scroll.vue
@@ -1,6 +1,7 @@
 <template>
   <div>
-    <tiny-button @click="box1 = true">允许滚动背景</tiny-button>
+    <tiny-button @click="box1 = true" type="info">允许滚动背景</tiny-button>
+    <tiny-button @click="box2 = true">不允许滚动背景</tiny-button>
     <tiny-dialog-box :lock-scroll="false" v-model:visible="box1" title="消息" width="30%">
       <span>不锁定被遮罩内容的滚动</span>
       <template #footer>
@@ -8,7 +9,6 @@
       </template>
     </tiny-dialog-box>
 
-    <tiny-button @click="box2 = true">不允许滚动背景</tiny-button>
     <tiny-dialog-box :lock-scroll="true" v-model:visible="box2" title="消息" width="30%">
       <span>锁定被遮罩内容的滚动</span>
       <template #footer>
diff --git a/examples/sites/demos/pc/app/dialog-box/webdoc/dialog-box.js b/examples/sites/demos/pc/app/dialog-box/webdoc/dialog-box.js
index d2e141607..6a4920ec6 100644
--- a/examples/sites/demos/pc/app/dialog-box/webdoc/dialog-box.js
+++ b/examples/sites/demos/pc/app/dialog-box/webdoc/dialog-box.js
@@ -175,17 +175,6 @@ export default {
       },
       'codeFiles': ['fullscreen.vue']
     },
-    {
-      'demoId': 'open-close-events',
-      'name': { 'zh-CN': '弹出与关闭事件', 'en-US': 'Pop-up and Close Event' },
-      'desc': {
-        'zh-CN':
-          '<p>通过设置事件<code>@open</code>：对话框打开时触发<code>@opened</code>：对话框打开动画结束时触发<code>@close</code>：对话框关闭时触发<code>@closed</code>：对话框关闭动画结束时触发。</p>\n',
-        'en-US':
-          '<p>By setting the event<code>@open</code>: triggered when the dialog box is opened<code>@opened</code>: triggered when the animation ends when the dialog box is opened<code>@close</code>: triggered when the dialog box is closed<code>@closed</code>: triggered when the animation ends when the dialog box is closed.</p>\n'
-      },
-      'codeFiles': ['open-close-events.vue']
-    },
     {
       'demoId': 'form-in-dialog',
       'name': { 'zh-CN': '弹窗表单', 'en-US': 'Pop-up Window Form' },
@@ -206,6 +195,17 @@ export default {
           '<p>By setting the<code>:destroy-on-close</code>attribute to<code>true</code>, all elements in the<code>dialog box</code>dialog box are destroyed when the pop-up window is closed, with the default value being<code>false</code>.</p>'
       },
       'codeFiles': ['destroy-on-close.vue']
+    },
+    {
+      'demoId': 'open-close-events',
+      'name': { 'zh-CN': '弹出与关闭事件', 'en-US': 'Pop-up and Close Event' },
+      'desc': {
+        'zh-CN':
+          '<p>通过设置事件<code>@open</code>：对话框打开时触发<code>@opened</code>：对话框打开动画结束时触发<code>@close</code>：对话框关闭时触发<code>@closed</code>：对话框关闭动画结束时触发。</p>\n',
+        'en-US':
+          '<p>By setting the event<code>@open</code>: triggered when the dialog box is opened<code>@opened</code>: triggered when the animation ends when the dialog box is opened<code>@close</code>: triggered when the dialog box is closed<code>@closed</code>: triggered when the animation ends when the dialog box is closed.</p>\n'
+      },
+      'codeFiles': ['open-close-events.vue']
     }
   ],
   apis: [
@@ -258,7 +258,7 @@ export default {
           'type': 'boolean',
           'defaultValue': 'false',
           'desc': {
-            'zh-CN': '是否开启弹窗的拖拽功能，默认值为 false',
+            'zh-CN': '是否开启弹窗的拖拽功能',
             'en-US': 'Whether to enable the drag and drop function of pop ups, with a default value of false'
           },
           'demoId': 'draggable'
@@ -327,7 +327,7 @@ export default {
           'type': 'boolean',
           'defaultValue': 'false',
           'desc': {
-            'zh-CN': '是否开启弹出右侧滑出功能，默认值为 false 。',
+            'zh-CN': '是否开启弹出右侧滑出功能',
             'en-US': 'Whether to disable the scroll bar when a log is displayed'
           },
           'demoId': 'right-dialog'
@@ -337,7 +337,7 @@ export default {
           'type': 'boolean',
           'defaultValue': 'true',
           'desc': {
-            'zh-CN': 'Dialog弹出时是否禁用滚动条',
+            'zh-CN': 'Dialog 弹出时是否禁用滚动条',
             'en-US': 'Indicates whether to display the pop-up header. The default value is true'
           },
           'demoId': 'lock-scroll'
@@ -346,7 +346,7 @@ export default {
           'name': 'show-header',
           'type': 'boolean',
           'defaultValue': 'true',
-          'desc': { 'zh-CN': '是否显示弹窗头部 header，默认值为 true 。', 'en-US': 'Pop-up dialog box title' },
+          'desc': { 'zh-CN': '是否显示弹窗头部 header', 'en-US': 'Pop-up dialog box title' },
           'demoId': 'hidden-header'
         },
         {
@@ -354,7 +354,7 @@ export default {
           'type': 'string',
           'defaultValue': '',
           'desc': {
-            'zh-CN': '弹出框标题。',
+            'zh-CN': '弹出框标题',
             'en-US':
               'Height between the pop-up box and the top of the window. The default value is 15% of the screen height'
           },
@@ -365,7 +365,7 @@ export default {
           'type': 'string',
           'defaultValue': '15vh',
           'desc': {
-            'zh-CN': '设置弹出框距离窗口顶部的高度，默认为屏高的 15%',
+            'zh-CN': '设置弹出框距离窗口顶部的高度',
             'en-US': 'Display and close pop-up boxes'
           },
           'demoId': 'dialog-top-height'
@@ -374,7 +374,7 @@ export default {
           'name': 'width',
           'type': 'string',
           'defaultValue': '500px',
-          'desc': { 'zh-CN': '弹出框的宽度。', 'en-US': 'Wideness of the dialog box that is displayed' },
+          'desc': { 'zh-CN': '弹出框的宽度', 'en-US': 'Wideness of the dialog box that is displayed' },
           'demoId': 'dialog-width'
         },
         {
@@ -395,70 +395,70 @@ export default {
       'events': [
         {
           'name': 'close',
-          'type': 'Function()',
+          'type': '() => {}',
           'defaultValue': '',
           'desc': {
-            'zh-CN': 'Dialog 关闭的回调;Dialog 关闭的回调;无arguments',
+            'zh-CN': 'Dialog 关闭的回调',
             'en-US': 'Dialog disabled callback; Dialog closing callback; No arguments'
           },
           'demoId': 'open-close-events'
         },
         {
           'name': 'open',
-          'type': 'Function()',
+          'type': '() => {}',
           'defaultValue': '',
           'desc': {
-            'zh-CN': 'Dialog 打开的回调;Dialog 打开的回调;无arguments',
+            'zh-CN': 'Dialog 打开的回调',
             'en-US': 'Dialog open callback; Dialog open callback; No arguments'
           },
           'demoId': 'open-close-events'
         },
         {
           'name': 'opened',
-          'type': 'Function()',
+          'type': '() => {}',
           'defaultValue': '',
           'desc': {
-            'zh-CN': 'Dialog 打开动画结束时的回调;无arguments',
+            'zh-CN': 'Dialog 打开动画结束时的回调',
             'en-US': 'Dialog: callback when the animation ends; No arguments'
           },
           'demoId': 'open-close-events'
         },
         {
           'name': 'closed',
-          'type': 'Function()',
+          'type': '() => {}',
           'defaultValue': '',
           'desc': {
-            'zh-CN': 'Dialog 关闭动画结束时的回调;无arguments',
+            'zh-CN': 'Dialog 关闭动画结束时的回调',
             'en-US': 'Dialog closes the callback when the animation ends. No arguments'
           },
           'demoId': 'open-close-events'
         },
         {
           'name': 'drag-start',
-          'type': 'Function(arg)',
+          'type': '(arg) => {}',
           'defaultValue': '',
           'desc': {
-            'zh-CN': 'Dialog 拖拽开始事件;arg:event(包含弹窗的位置等信息)',
+            'zh-CN': 'Dialog 拖拽开始事件;arg包含弹窗的位置等信息',
             'en-US': 'Dialog drag start event; arg:event (including the location of the pop-up window)'
           },
           'demoId': 'draggable'
         },
         {
           'name': 'drag-move',
-          'type': 'Function(arg)',
+          'type': '(arg) => {}',
           'defaultValue': '',
           'desc': {
-            'zh-CN': 'Dialog 拖拽移动事件;arg:event(包含弹窗的位置等信息)',
+            'zh-CN': 'Dialog 拖拽移动事件;arg包含弹窗的位置等信息',
             'en-US': 'Dialog dragging and moving event; arg:event (including the location of the pop-up window)'
           },
           'demoId': 'draggable'
         },
         {
           'name': 'drag-end',
-          'type': 'Function(arg)',
+          'type': '(arg) => {}',
           'defaultValue': '',
           'desc': {
-            'zh-CN': 'Dialog 拖拽结束事件;arg:event(包含弹窗的位置等信息)',
+            'zh-CN': 'Dialog 拖拽结束事件;arg包含弹窗的位置等信息',
             'en-US': 'Dialog drag end event; arg:event (including the location of the pop-up window)'
           },
           'demoId': 'draggable'