76 lines
2.0 KiB
TypeScript
76 lines
2.0 KiB
TypeScript
import { BaseEventOrig, Button, ButtonProps, ITouchEvent } from '@tarojs/components';
|
|
|
|
import classNames from 'classnames';
|
|
import { useCallback } from 'react';
|
|
|
|
import { logWithPrefix } from '@/utils/common';
|
|
import Toast from '@/utils/toast';
|
|
import { requestUserInfo, setPhoneNumber } from '@/utils/user';
|
|
|
|
import './index.less';
|
|
|
|
export enum BindPhoneStatus {
|
|
Success,
|
|
Cancel,
|
|
Error,
|
|
}
|
|
|
|
export interface IPhoneButtonProps extends ButtonProps {
|
|
message?: string;
|
|
// 绑定后是否需要刷新接口获取手机号
|
|
needPhone?: boolean;
|
|
onBindPhone?: (status: BindPhoneStatus, e: ITouchEvent) => void;
|
|
onSuccess?: (e: ITouchEvent) => void;
|
|
}
|
|
|
|
const PREFIX = 'phone-button';
|
|
const log = logWithPrefix(PREFIX);
|
|
|
|
export default function PhoneButton(props: IPhoneButtonProps) {
|
|
const {
|
|
className,
|
|
children,
|
|
message = '绑定成功',
|
|
openType,
|
|
needPhone,
|
|
onSuccess,
|
|
onBindPhone,
|
|
...otherProps
|
|
} = props;
|
|
|
|
const handleGetPhoneNumber = useCallback(
|
|
async (e: BaseEventOrig<ButtonProps.onGetPhoneNumberEventDetail>) => {
|
|
log('handleGetPhoneNumber', e.detail.code, e.detail.iv, e.detail.encryptedData);
|
|
const encryptedData = e.detail.encryptedData;
|
|
const iv = e.detail.iv;
|
|
if (!encryptedData || !iv) {
|
|
onBindPhone?.(BindPhoneStatus.Cancel, e as ITouchEvent);
|
|
return Toast.error('取消授权');
|
|
}
|
|
try {
|
|
await setPhoneNumber({ encryptedData, iv });
|
|
needPhone && (await requestUserInfo());
|
|
Toast.success(message);
|
|
onBindPhone?.(BindPhoneStatus.Success, e as ITouchEvent);
|
|
onSuccess?.(e as ITouchEvent);
|
|
} catch (err) {
|
|
onBindPhone?.(BindPhoneStatus.Error, e as ITouchEvent);
|
|
Toast.error('绑定失败');
|
|
log('bind phone fail', err);
|
|
}
|
|
},
|
|
[message, needPhone, onSuccess, onBindPhone]
|
|
);
|
|
|
|
return (
|
|
<Button
|
|
{...otherProps}
|
|
className={classNames(PREFIX, className)}
|
|
openType="getPhoneNumber"
|
|
onGetPhoneNumber={handleGetPhoneNumber}
|
|
>
|
|
{children}
|
|
</Button>
|
|
);
|
|
}
|