feat: 支持Button在支付宝小程序平台opentype设为getAuthorize用于获取手机号和用户信息

This commit is contained in:
Moonofweisheng 2024-11-04 23:37:24 +08:00
parent db32ef9621
commit deeb45d8cb
5 changed files with 43 additions and 13 deletions

View File

@ -120,6 +120,24 @@
| show-message-card | 是否显示会话内消息卡片,设置此参数为 true用户进入客服会话会在右下角显示"可能要发送的小程序"提示用户点击后可以快速发送小程序消息open-type="contact"时有效 | boolean | - | false | - |
| classPrefix | 类名前缀,用于使用自定义图标,参见[icon](/component/icon#自定义图标) | string | - | 'wd-icon' | 0.1.27 |
| button-id | 按钮的唯一标识可用于设置隐私同意授权按钮的id | string | - | - | 1.3.6 |
| scope | 支付宝小程序使用,当 open-type 为 getAuthorize 时有效。 | ButtonScope | `phoneNumber` / `userInfo` | - | $LOWEST_VERSION$ |
### ButtonOpenType 开放能力
| 属性 | 说明 |
| ------------------------- | ------------------------------------------------------------------------------------------ |
| feedback | 打开“意见反馈”页面,用户可提交反馈内容并上传日志。 |
| share | 触发用户转发 |
| getUserInfo | 获取用户信息,可以从@getuserinfo 回调中获取到用户信息 |
| contact | 打开客服会话,如果用户在会话中点击消息卡片后返回应用,可以从 @contact 回调中获得具体信息 |
| getPhoneNumber | 获取用户手机号,可以从@getphonenumber 回调中获取到用户信息 |
| launchApp | 小程序中打开 APP可以通过 app-parameter 属性设定向 APP 传的参数 |
| openSetting | 打开授权设置页 |
| chooseAvatar | 获取用户头像,可以从@chooseavatar 回调中获取到头像信息 |
| getAuthorize | 支持小程序授权,支付宝小程序配合`scope`使用,可以实现`getPhoneNumber``getUserInfo`功能。 |
| lifestyle | 关注生活号,支付宝小程序 |
| contactShare | 分享到通讯录好友,支付宝小程序 |
| agreePrivacyAuthorization | 用户同意隐私协议按钮。可通过 @agreeprivacyauthorization 监听用户同意隐私协议事件。 |
## Events

View File

@ -2,7 +2,7 @@
<page-wraper>
<view>
<demo-block title="基本用法">
<wd-button open-type="getUserInfo" @getuserinfo="handleGetuserinfo">主要按钮</wd-button>
<wd-button>主要按钮</wd-button>
<wd-button type="success">成功按钮</wd-button>
<wd-button type="info">信息按钮</wd-button>
<wd-button type="warning">警告按钮</wd-button>

View File

@ -1,7 +1,7 @@
/*
* @Author: weisheng
* @Date: 2024-03-15 11:36:12
* @LastEditTime: 2024-07-23 11:38:09
* @LastEditTime: 2024-11-04 21:33:52
* @LastEditors: weisheng
* @Description:
* @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-button\types.ts
@ -43,6 +43,8 @@ export type ButtonOpenType =
| 'openProfile'
| 'agreePrivacyAuthorization'
export type ButtonScope = 'phoneNumber' | 'userInfo'
export const buttonProps = {
...baseProps,
/**
@ -128,7 +130,12 @@ export const buttonProps = {
/**
* id
*/
buttonId: String
buttonId: String,
/**
* open-type getAuthorize
* 'phoneNumber' | 'userInfo'
*/
scope: String as PropType<ButtonScope>
}
export type ButtonProps = ExtractPropTypes<typeof buttonProps>

View File

@ -26,7 +26,9 @@
:session-from="sessionFrom"
:lang="lang"
:hover-stop-propagation="hoverStopPropagation"
:scope="scope"
@click="handleClick"
@getAuthorize="handleGetAuthorize"
@getuserinfo="handleGetuserinfo"
@contact="handleConcat"
@getphonenumber="handleGetphonenumber"
@ -106,6 +108,18 @@ function handleClick(event: any) {
}
}
/**
* 支付宝小程序授权
* @param event
*/
function handleGetAuthorize(event: any) {
if (props.scope === 'phoneNumber') {
handleGetphonenumber(event)
} else if (props.scope === 'userInfo') {
handleGetuserinfo(event)
}
}
function handleGetuserinfo(event: any) {
emit('getuserinfo', event.detail)
}

View File

@ -1,12 +1,3 @@
/*
* @Author: weisheng
* @Date: 2024-03-15 20:40:34
* @LastEditTime: 2024-03-18 15:38:37
* @LastEditors: weisheng
* @Description:
* @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-tabbar\types.ts
*
*/
import { type ExtractPropTypes, type InjectionKey } from 'vue'
import { baseProps, makeBooleanProp, makeNumberProp, makeNumericProp, makeStringProp } from '../common/props'
import type { TabbarItem } from '../wd-tabbar-item/types'
@ -54,7 +45,7 @@ export const tabbarProps = {
*/
bordered: makeBooleanProp(true),
/**
* 禿iPhone X
* iPhone X
*/
safeAreaInsetBottom: makeBooleanProp(false),
/**