docs(dialog): add international desc

src/packages/__VUE/dialog/demo.vue

@@ -1,43 +1,71 @@
 <template>
   <div class="demo">
-    <nut-cell-group title="函数式调用">
-      <nut-cell title="基础弹框" @click="baseClick"></nut-cell>
-      <nut-cell title="无标题弹框" @click="noTitleClick"></nut-cell>
-      <nut-cell title="提示弹框" @click="tipsClick"></nut-cell>
-      <nut-cell title="底部按钮 垂直调用" @click="verticalClick"></nut-cell>
+    <nut-cell-group :title="translate('funUse')">
+      <nut-cell :title="translate('basic')" @click="baseClick"></nut-cell>
+      <nut-cell :title="translate('noTitle')" @click="noTitleClick"></nut-cell>
+      <nut-cell :title="translate('tipDialog')" @click="tipsClick"></nut-cell>
+      <nut-cell :title="translate('title')" @click="verticalClick"></nut-cell>
     </nut-cell-group>
-    <nut-cell-group title="标签式使用">
-      <nut-cell title="组件调用" @click="componentClick"></nut-cell>
+    <nut-cell-group :title="translate('title1')">
+      <nut-cell :title="translate('title1')" @click="componentClick"></nut-cell>
       <nut-dialog
         teleport="#app"
-        title="组件调用"
-        content="如果需要在弹窗内嵌入组件或其他自定义内容，可以使用组件调用的方式。"
+        :title="translate('title1')"
+        :content="translate('content')"
         v-model:visible="visible"
       >
       </nut-dialog>
-      <nut-cell title="底部按钮 垂直使用" @click="componentvVrticalClick"></nut-cell>
+      <nut-cell :title="translate('title')" @click="componentvVrticalClick"></nut-cell>
       <nut-dialog
         footer-direction="vertical"
         teleport="#app"
-        title="组件调用"
-        content="如果需要在弹窗内嵌入组件或其他自定义内容，可以使用组件调用的方式。"
+        :title="translate('title1')"
+        :content="translate('content')"
         v-model:visible="visible1"
       >
       </nut-dialog>
     </nut-cell-group>
-    <nut-cell-group title="teleport 使用，挂载到指定节点">
-      <nut-cell title="body 节点下" @click="teleportClick('body')"></nut-cell>
-      <nut-cell title="#app 节点下" @click="teleportClick('#app')"></nut-cell>
-      <nut-cell title="demo class 元素节点下" @click="teleportClick('.demo')"></nut-cell>
+    <nut-cell-group :title="translate('title2')">
+      <nut-cell title="body element node" @click="teleportClick('body')"></nut-cell>
+      <nut-cell title="#app element node" @click="teleportClick('#app')"></nut-cell>
+      <nut-cell title="demo class element node" @click="teleportClick('.demo')"></nut-cell>
     </nut-cell-group>
   </div>
 </template>
 <script lang="ts">
 import { ref } from 'vue';
 import { createComponent } from '@/packages/utils/create';
-const { createDemo } = createComponent('dialog');
+const { createDemo, translate } = createComponent('dialog');
 import { Dialog } from '@/packages/nutui.vue';
-
+import { useTranslate } from '@/sites/assets/util/useTranslate';
+useTranslate({
+  'zh-CN': {
+    funUse: '函数式调用',
+    basic: '基础弹框',
+    noTitle: '无标题弹框',
+    tipDialog: '提示弹框',
+    tips: '提示',
+    title: '底部按钮 垂直使用',
+    title1: '标签式使用',
+    title2: 'Teleport 使用，挂载到指定节点',
+    content: '支持函数调用和组件调用两种方式。',
+    content1: '支持底部按钮纵向排列。',
+    content2: '打开开发者工具看一下 Elements Tab'
+  },
+  'en-US': {
+    funUse: 'Function use',
+    basic: 'Basic Usage',
+    noTitle: 'No Title',
+    tipDialog: 'Tips Dialog',
+    tips: 'Tips',
+    title: 'Bottom button vertical use',
+    title1: 'Template use',
+    title2: 'Teleport use, mount to the specified element node',
+    content: 'Function call and template call are supported.',
+    content1: 'Support vertical arrangement of bottom buttons.',
+    content2: 'Open the developer tool and take a look at the Elements tab'
+  }
+});
 export default createDemo({
   setup() {
     const visible = ref(false);
@@ -52,23 +80,23 @@ export default createDemo({
 
     const baseClick = (): void => {
       Dialog({
-        title: '基础弹框',
-        content: '支持函数调用和组件调用两种方式。',
+        title: translate('basic'),
+        content: translate('content'),
         onCancel,
         onOk
       });
     };
     const noTitleClick = () => {
       Dialog({
-        content: '无标题弹框',
+        content: translate('noTitle'),
         onCancel,
         onOk
       });
     };
     const tipsClick = () => {
       Dialog({
-        title: '温馨提示',
-        content: '支持函数调用和组件调用两种方式。',
+        title: translate('tips'),
+        content: translate('content'),
         noCancelBtn: true,
         onCancel,
         onOk
@@ -76,8 +104,8 @@ export default createDemo({
     };
     const verticalClick = () => {
       Dialog({
-        title: '温馨提示',
-        content: '支持底部按钮纵向排列。',
+        title: translate('tips'),
+        content: translate('content1'),
         footerDirection: 'vertical',
         onCancel,
         onOk
@@ -94,8 +122,8 @@ export default createDemo({
     const teleportClick = (teleport: string) => {
       Dialog({
         teleport,
-        title: '挂载至 ' + teleport,
-        content: '打开开发者工具看一下 Elements Tab',
+        title: 'teleport to ' + teleport,
+        content: translate('content2'),
         noCancelBtn: true,
         onCancel
       });
@@ -110,7 +138,8 @@ export default createDemo({
       componentvVrticalClick,
       tipsClick,
       verticalClick,
-      teleportClick
+      teleportClick,
+      translate
     };
   }
 });

src/packages/__VUE/dialog/doc.en-US.md

@@ -0,0 +1,226 @@
+# Dialog
+
+
+### Intro
+
+Modal dialog box is displayed in the floating layer to guide users to carry out relevant operations. It is often used for message prompt, message confirmation, or completing specific interactive operations in the current page.
+
+The popup box component supports function call and component call.
+
+### Install
+    
+```javascript
+import { createApp } from 'vue';
+import { Dialog,Popup,OverLay } from '@nutui/nutui';
+
+const app = createApp();
+app.use(Dialog).use(Popup).use(OverLay)
+```
+
+
+## Function use
+
+:::demo
+```html
+<template>
+ <nut-cell-group title="Function Use">
+  <nut-cell title="Title" @click="baseClick"></nut-cell>
+  <nut-cell title="Title" @click="noTitleClick"></nut-cell>
+  <nut-cell title="Title" @click="tipsClick"></nut-cell>
+  <nut-cell title="Title" @click="verticalClick"></nut-cell>
+</nut-cell-group>
+</template>
+<script lang="ts">
+import { ref } from 'vue';
+import { Dialog } from '@nutui/nutui';
+export default {
+    setup() {
+        const onCancel = () => {
+          console.log('event cancel');
+        };
+        const onOk = () => {
+          console.log('event ok');
+        };
+        const baseClick = (): void => {
+          Dialog({
+            title: 'Basic spring frame',
+            content: 'Function call and component call are supported.',
+            onCancel,
+            onOk
+          });
+        };
+        const noTitleClick = () => {
+          Dialog({
+            content: 'Content',
+            onCancel,
+            onOk
+          });
+        };
+        const tipsClick = () => {
+          Dialog({
+            title: 'Title',
+            content: 'Function call and component call are supported.',
+            noCancelBtn: true,
+            onCancel,
+            onOk
+          });
+        };
+        const verticalClick = () => {
+          Dialog({
+            title: 'Title',
+            content: 'Support vertical arrangement of bottom buttons.',
+            footerDirection: 'vertical',
+            onCancel,
+            onOk
+          });
+        };
+        return {
+          baseClick,
+          noTitleClick,
+          tipsClick,
+          verticalClick
+        };
+    }
+}
+</script>
+```
+::: 
+
+## Teleport use, mount to the specified element node
+
+``` html
+<nut-dialog teleport="#app" ... />
+```
+
+``` javascript
+Dialog({
+  teleport: '#app',
+  ...
+});
+Dialog({
+  teleport: '.demo',
+  ...
+});
+```
+
+## Function use proxy.&dialog(...)
+
+```javascript
+import { ref } from 'vue';
+import { Dialog } from '@nutui/nutui';
+import { getCurrentInstance } from 'vue';
+
+export default {
+  setup() {
+    const { proxy } = getCurrentInstance();
+    proxy.$dialog({
+      title: 'Basic spring frame',
+      content: 'Function call and component call are supported.'
+    });
+  }
+}
+```
+
+
+## Template use
+
+
+:::demo
+```html
+<template>
+  <nut-cell-group title="Template use">
+    <nut-cell title="Template use" @click="componentClick"></nut-cell>
+    <nut-dialog
+      teleport="#app"
+      title="Template use"
+      content="Function call and template call are supported."
+      v-model:visible="visible"
+    >
+    </nut-dialog>
+    <nut-cell title="Bottom button vertical use" @click="componentvVrticalClick"></nut-cell>
+    <nut-dialog
+      footer-direction="vertical"
+      teleport="#app"
+      title="Template use"
+      content="Function call and template call are supported."
+      v-model:visible="visible1"
+    >
+    </nut-dialog>
+  </nut-cell-group>
+</template>
+<script lang="ts">
+import { ref } from 'vue';
+export default {
+  setup() {
+    const visible = ref(false);
+    const visible1 = ref(false);
+    const componentClick = () => {
+      visible.value = true;
+    };
+    const componentvVrticalClick = () => {
+      visible1.value = true;
+    };
+    return { visible,visible1,componentClick,componentvVrticalClick };
+  }
+}
+</script>
+```
+:::
+
+## API
+| Attribute           | Description                                                                    | Type             | Default              |
+|---------------------|--------------------------------------------------------------------------------|------------------|----------------------|
+| title               | Title                                                                          | String           | -                    |
+| id                  | Identifier, share one instance at the same time, default to multiple instances | String or Number | new Date().getTime() |
+| content             | Content, support HTML                                                          | String           | -                    |
+| teleport            | Specifies a target element where Dialog will be mounted                        | String           | "body"               |
+| closeOnClickOverlay | Whether to close when overlay is clicked                                       | Boolean          | false                |
+| noFooter            | Hide bottom button bar                                                         | Boolean          | false                |
+| noOkBtn             | Hide OK button                                                                 | Boolean          | false                |
+| noCancelBtn         | Hide cancel button                                                             | Boolean          | false                |
+| cancelText          | Cancel button text                                                             | String           | "Cancel"             |
+| okText              | OK button text                                                                 | String           | "Confirm"            |
+| cancelAutoClose     | Click Cancel to close the popup                                                | Boolean          | true                 |
+| textAlign           | Text alignment direction, the optional value is the same as css text-align     | String           | "center"             |
+| closeOnPopstate     | Whether to close when popstate                                                 | Boolean          | false                |
+| onUpdate            | Update                                                                         | Boolean          | false                |
+| onOk                | Emitted when the confirm button is clicked                                     | Function         | -                    |
+| onCancel            | Emitted when the cancel button is clicked                                      | Function         | -                    |
+| onClosed            | Emitted when Dialog is closed                                                  | Function         | -                    |
+
+
+## Props
+
+| Attribute              | Description                                                                                               | Type    | Default    |
+|------------------------|-----------------------------------------------------------------------------------------------------------|---------|------------|
+| title                  | Title                                                                                                     | String  | -          |
+| content                | Content, support HTML                                                                                     | String  | -          |
+| teleport               | Specifies a target element where Dialog will be mounted                                                   | String  | "body"     |
+| close-on-click-overlay | Whether to close when overlay is clicked                                                                  | Boolean | false      |
+| no-footer              | Hide bottom button bar                                                                                    | Boolean | false      |
+| no-ok-btn              | Hide OK button                                                                                            | Boolean | false      |
+| no-cancel-btn          | Hide cancel button                                                                                        | Boolean | false      |
+| cancel-text            | Cancel button text                                                                                        | String  | "Cancel"   |
+| ok-text                | OK button text                                                                                            | String  | "Confirm"  |
+| cancel-auto-close      | Click Cancel to close the popup                                                                           | Boolean | true       |
+| text-align             | Text alignment direction, the optional value is the same as css text-align                                | String  | "center"   |
+| close-on-popstate      | Whether to close when popstate                                                                            | Boolean | false      |
+| lock-scroll            | Whether to lock background scroll                                                                         | Boolean | false      |
+| footer-direction       | The bottom button uses the horizontal and vertical directions. Optional values ​​are horizontal and vertical. | string  | horizontal |
+
+## Events
+
+| Event  | Description                                | Type     | Default |
+|--------|--------------------------------------------|----------|---------|
+| ok     | Emitted when the confirm button is clicked | Function | -       |
+| cancel | Emitted when the cancel button is clicked  | Function | -       |
+| closed | Emitted when Dialog is closed              | Function | -       |
+
+
+## Slots
+
+| Name    | Description    |
+|---------|----------------|
+| header  | Custom title   |
+| default | Custom default |
+| footer  | Custom footer  |

src/packages/__VUE/dialog/doc.md

@@ -171,7 +171,7 @@ export default {
 | 字段                | 说明                                  | 类型     | 默认值   |
 |---------------------|---------------------------------------|----------|----------|
 | title               | 标题                                  | String   | -        |
-| id               | 标识符，相同者共用一个实例<br>loading类型默认使用一个实例，其他类型默认不共用 | String/Number   | new Date().getTime()        |
+| id               | 标识符，相同时共用一个实例，默认为多个实例 | String/Number   | new Date().getTime()        |
 | content             | 内容，支持HTML                        | String   | -        |
 | teleport            | 指定挂载节点                          | String   | "body"   |
 | closeOnClickOverlay | 点击蒙层是否关闭对话框                | Boolean  | false    |
@@ -180,14 +180,12 @@ export default {
 | noCancelBtn         | 是否隐藏取消按钮                      | Boolean  | false    |
 | cancelText          | 取消按钮文案                          | String   | ”取消“   |
 | okText              | 确定按钮文案                          | String   | ”确定“   |
-| okBtnDisabled       | 禁用确定按钮                          | Boolean  | false    |
 | cancelAutoClose     | 取消按钮是否默认关闭弹窗              | Boolean  | true     |
 | textAlign           | 文字对齐方向，可选值同css的text-align | String   | "center" |
 | closeOnPopstate     | 是否在页面回退时自动关闭              | Boolean  | false    |
 | onUpdate            | 更新                                  | Boolean  | false    |
 | onOk                | 确定按钮回调                          | Function | -        |
 | onCancel            | 取消按钮回调                          | Function | -        |
-| onOpen              | 背景是否锁定                          | Function | -        |
 | onClosed            | 关闭回调，任何情况关闭弹窗都会触发    | Function | -        |
 
 
@@ -204,7 +202,6 @@ export default {
 | no-cancel-btn          | 是否隐藏取消按钮                         | Boolean | false      |
 | cancel-text            | 取消按钮文案                             | String  | ”取消“     |
 | ok-text                | 确定按钮文案                             | String  | ”确 定“    |
-| ok-btn-disabled        | 禁用确定按钮                             | Boolean | false      |
 | cancel-auto-close      | 取消按钮是否默认关闭弹窗                 | Boolean | true       |
 | text-align             | 文字对齐方向，可选值同css的text-align    | String  | "center"   |
 | close-on-popstate      | 是否在页面回退时自动关闭                 | Boolean | false      |

src/packages/__VUE/dialog/doc.taro.md

@@ -125,7 +125,6 @@ export default {
 | no-cancel-btn          | 是否隐藏取消按钮                         | Boolean | false      |
 | cancel-text            | 取消按钮文案                             | String  | ”取消“     |
 | ok-text                | 确定按钮文案                             | String  | ”确 定“    |
-| ok-btn-disabled        | 禁用确定按钮                             | Boolean | false      |
 | cancel-auto-close      | 取消按钮是否默认关闭弹窗                 | Boolean | true       |
 | text-align             | 文字对齐方向，可选值同css的text-align    | String  | "center"   |
 | close-on-popstate      | 是否在页面回退时自动关闭                 | Boolean | false      |

src/packages/__VUE/dialog/index.taro.vue

@@ -32,15 +32,7 @@
           >
             {{ cancelText || translate('cancel') }}
           </nut-button>
-          <nut-button
-            v-if="!noOkBtn"
-            size="small"
-            type="primary"
-            class="nut-dialog__footer-ok"
-            :class="{ disabled: okBtnDisabled }"
-            :disabled="okBtnDisabled"
-            @click="onOk"
-          >
+          <nut-button v-if="!noOkBtn" size="small" type="primary" class="nut-dialog__footer-ok" @click="onOk">
             {{ okText || translate('confirm') }}
           </nut-button>
         </template>
@@ -94,10 +86,6 @@ export default create({
       type: String,
       default: ''
     },
-    okBtnDisabled: {
-      type: Boolean,
-      default: false
-    },
     cancelAutoClose: {
       type: Boolean,
       default: true

src/packages/__VUE/dialog/index.vue

@@ -32,15 +32,7 @@
           >
             {{ cancelText || translate('cancel') }}
           </nut-button>
-          <nut-button
-            v-if="!noOkBtn"
-            size="small"
-            type="primary"
-            class="nut-dialog__footer-ok"
-            :class="{ disabled: okBtnDisabled }"
-            :disabled="okBtnDisabled"
-            @click="onOk"
-          >
+          <nut-button v-if="!noOkBtn" size="small" type="primary" class="nut-dialog__footer-ok" @click="onOk">
             {{ okText || translate('confirm') }}
           </nut-button>
         </template>
@@ -94,10 +86,6 @@ export default create({
       type: String,
       default: ''
     },
-    okBtnDisabled: {
-      type: Boolean,
-      default: false
-    },
     cancelAutoClose: {
       type: Boolean,
       default: true

src/packages/__VUE/toast/doc.md

@@ -270,7 +270,7 @@ toast.hide();
 
 | 字段                | 说明                                                                          | 类型          | 默认值                        |
 | ------------------- | ----------------------------------------------------------------------------- | ------------- | ----------------------------- |
-| id                  | 标识符，相同者共用一个实例<br>loading类型默认使用一个实例，其他类型默认不共用 | String/Number | -                       |
+| id                  | 标识符，相同时共用一个实例，默认为多个实例 | String/Number | -                       |
 | duration            | 展示时长（毫秒）<br>值为 0 时，toast 不会自动消失      | Number        | 2000                          |
 | title            | 标题     | String        |           -             |
 | center              | 是否展示在页面中部（为false时展示在底部）                                     | Boolean       | true                          |