From 84f73456fcd3a3b5fb91d66a87ffaa9d1c790ce1 Mon Sep 17 00:00:00 2001 From: rex Date: Mon, 18 Feb 2019 13:34:03 +0800 Subject: [PATCH] =?UTF-8?q?[new=20feature]=20Dialog:=20=E6=94=AF=E6=8C=81o?= =?UTF-8?q?penType=E7=9B=B8=E5=85=B3=E5=8F=82=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit support #1093 --- packages/dialog/README.md | 24 ++++++++++++++++++++---- packages/dialog/dialog.ts | 9 +++++++++ packages/dialog/index.ts | 11 +++++++---- packages/dialog/index.wxml | 17 ++++++++++++++--- packages/mixins/button.ts | 2 +- 5 files changed, 51 insertions(+), 12 deletions(-) diff --git a/packages/dialog/README.md b/packages/dialog/README.md index aa6c0e1b..a3f93a90 100644 --- a/packages/dialog/README.md +++ b/packages/dialog/README.md @@ -124,8 +124,8 @@ Page({ 通过函数调用 Dialog 时，支持传入以下选项： -| 参数 | 说明 | 类型 | 默认值 | -|-----------|-----------|-----------|-------------| +| 参数 | 说明 | 类型 | 默认值 | 生效时机 | +|-----------|-----------|-----------|-------------|-------------| | title | 标题 | `String` | - | | message | 内容 | `String` | - | | messageAlign | 内容对齐方式，可选值为`left` `right` | `String` | `center` | @@ -141,13 +141,21 @@ Page({ | asyncClose | 是否异步关闭弹窗，开启后需要手动控制弹窗的关闭 | `Boolean` | `false` | | context | 选择器的选择范围，可以传入自定义组件的 this 作为上下文 | `Object` | 当前页面 | | transition | 动画名称，可选值为`fade` | `String` | `scale` | +| app-parameter | 打开 APP 时，向 APP 传递的参数 | `String` | - | `confirmButtonOpenType="launchApp"` | +| lang | 指定返回用户信息的语言，zh_CN 简体中文，
zh_TW 繁体中文，en 英文 | `String` | `en` | `confirmButtonOpenType="getUserInfo"` | +| session-from | 会话来源 | `String` | - | `confirmButtonOpenType="contact"` | +| business-id | 客服消息子商户 id | `Number` | - | +| send-message-title | 会话内消息卡片标题 | `String` | 当前标题 | `confirmButtonOpenType="contact"` | +| send-message-path | 会话内消息卡片点击跳转小程序路径 | `String` | 当前分享路径 | `confirmButtonOpenType="contact"` | +| send-message-img | sendMessageImg | `String` | 截图 | `confirmButtonOpenType="contact"` | +| show-message-card | 显示会话内消息卡片 | `String` | `false` | `confirmButtonOpenType="contact"` | ### API 通过组件调用 Dialog 时，支持以下 API： -| 参数 | 说明 | 类型 | 默认值 | -|-----------|-----------|-----------|-------------| +| 参数 | 说明 | 类型 | 默认值 | 生效时机 | +|-----------|-----------|-----------|-------------|-------------| | show | 是否显示弹窗 | `Boolean` | - | | title | 标题 | `String` | - | | message | 内容 | `String` | - | @@ -163,6 +171,14 @@ Page({ | use-slot | 是否使用自定义内容的插槽 | `Boolean` | `false` | | async-close | 是否异步关闭弹窗，开启后需要手动控制弹窗的关闭 | `Boolean` | `false` | | transition | 动画名称，可选值为`fade` | `String` | `scale` | +| app-parameter | 打开 APP 时，向 APP 传递的参数 | `String` | - | `confirm-button-open-type="launchApp"` | +| lang | 指定返回用户信息的语言，zh_CN 简体中文，
zh_TW 繁体中文，en 英文 | `String` | `en` | `confirm-button-open-type="getUserInfo"` | +| session-from | 会话来源 | `String` | - | `confirm-button-open-type="contact"` | +| business-id | 客服消息子商户 id | `Number` | - | +| send-message-title | 会话内消息卡片标题 | `String` | 当前标题 | `confirm-button-open-type="contact"` | +| send-message-path | 会话内消息卡片点击跳转小程序路径 | `String` | 当前分享路径 | `confirm-button-open-type="contact"` | +| send-message-img | sendMessageImg | `String` | 截图 | `confirm-button-open-type="contact"` | +| show-message-card | 显示会话内消息卡片 | `String` | `false` | `confirm-button-open-type="contact"` | ### Event diff --git a/packages/dialog/dialog.ts b/packages/dialog/dialog.ts index f8c30609..2290832b 100644 --- a/packages/dialog/dialog.ts +++ b/packages/dialog/dialog.ts @@ -2,6 +2,7 @@ let queue = []; type DialogAction = 'confirm' | 'cancel'; type DialogOptions = { + lang?: string; show?: boolean; title?: string; zIndex?: number; @@ -9,9 +10,17 @@ type DialogOptions = { message?: string; overlay?: boolean; selector?: string; + ariaLabel?: string; transition?: string; asyncClose?: boolean; + businessId?: number; + sessionFrom?: string; + appParameter?: string; messageAlign?: string; + sendMessageImg?: string; + showMessageCard?: boolean; + sendMessagePath?: string; + sendMessageTitle?: string; confirmButtonText?: string; cancelButtonText?: string; showConfirmButton?: boolean; diff --git a/packages/dialog/index.ts b/packages/dialog/index.ts index 1e05a751..f9d9fe2b 100644 --- a/packages/dialog/index.ts +++ b/packages/dialog/index.ts @@ -1,8 +1,11 @@ import { VantComponent } from '../common/component'; +import { button } from '../mixins/button'; import { openType } from '../mixins/open-type'; +type Action = 'confirm' | 'cancel' | 'overlay'; + VantComponent({ - mixins: [openType], + mixins: [button, openType], props: { show: Boolean, @@ -48,7 +51,7 @@ VantComponent({ }, watch: { - show(show) { + show(show: boolean) { !show && this.stopLoading(); } }, @@ -66,7 +69,7 @@ VantComponent({ this.onClose('overlay'); }, - handleAction(action) { + handleAction(action: Action) { if (this.data.asyncClose) { this.set({ [`loading.${action}`]: true @@ -91,7 +94,7 @@ VantComponent({ }); }, - onClose(action) { + onClose(action: Action) { if (!this.data.asyncClose) { this.close(); } diff --git a/packages/dialog/index.wxml b/packages/dialog/index.wxml index fe890fd0..c1d38990 100644 --- a/packages/dialog/index.wxml +++ b/packages/dialog/index.wxml @@ -39,13 +39,24 @@ class="van-dialog__button" loading="{{ loading.confirm }}" custom-class="van-dialog__confirm" + open-type="{{ confirmButtonOpenType }}" + lang="{{ lang }}" + business-id="{{ businessId }}" + session-from="{{ sessionFrom }}" + send-message-title="{{ sendMessageTitle }}" + send-message-path="{{ sendMessagePath }}" + send-message-img="{{ sendMessageImg }}" + show-message-card="{{ showMessageCard }}" + app-parameter="{{ appParameter }}" + bind:click="onConfirm" - binderror="bindError" - bindcontact="bindContact" - bindopensetting="bindOpenSetting" bindgetuserinfo="bindGetUserInfo" + bindcontact="bindContact" bindgetphonenumber="bindGetPhoneNumber" + binderror="bindError" + bindlaunchapp="bindLaunchApp" + bindopensetting="bindOpenSetting" > {{ confirmButtonText }} diff --git a/packages/mixins/button.ts b/packages/mixins/button.ts index 5b7c07f7..edfa6dc6 100644 --- a/packages/mixins/button.ts +++ b/packages/mixins/button.ts @@ -12,7 +12,7 @@ export const button = Behavior({ sendMessageTitle: String, sendMessagePath: String, sendMessageImg: String, - showMessageCard: String, + showMessageCard: Boolean, appParameter: String, ariaLabel: String }