ded37830fe
- AvatarCircle: 头像圆形组件 - ShortcutButton: 快捷操作按钮 - TodoAlert: 待办提醒组件 - pkg-mall/product: 积分商品详情页
40 lines
933 B
TypeScript
40 lines
933 B
TypeScript
import React from 'react';
|
|
import { View, Text } from '@tarojs/components';
|
|
import './index.scss';
|
|
|
|
type ButtonColor = 'pri' | 'acc' | 'wrn' | 'dan';
|
|
|
|
interface ShortcutButtonProps {
|
|
icon: string;
|
|
label: string;
|
|
color?: ButtonColor;
|
|
onPress?: () => void;
|
|
badge?: number;
|
|
}
|
|
|
|
const ShortcutButton: React.FC<ShortcutButtonProps> = ({
|
|
icon,
|
|
label,
|
|
color = 'pri',
|
|
onPress,
|
|
badge,
|
|
}) => {
|
|
const cls = ['shortcut-btn', `shortcut-btn--${color}`].join(' ');
|
|
|
|
return (
|
|
<View className={cls} onClick={onPress}>
|
|
<View className="shortcut-btn__icon-wrap">
|
|
<Text className="shortcut-btn__icon">{icon}</Text>
|
|
{badge != null && badge > 0 && (
|
|
<Text className="shortcut-btn__badge">
|
|
{badge > 99 ? '99+' : badge}
|
|
</Text>
|
|
)}
|
|
</View>
|
|
<Text className="shortcut-btn__label">{label}</Text>
|
|
</View>
|
|
);
|
|
};
|
|
|
|
export default React.memo(ShortcutButton);
|