From 077221a8648468bf54d493d03600923a4fc336d0 Mon Sep 17 00:00:00 2001 From: lixiajun Date: Wed, 15 Nov 2023 17:59:24 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E5=B0=8F=E7=A8=8B?= =?UTF-8?q?=E5=BA=8F=E8=A1=8C=E4=B8=9A=20SDK=20=E7=BB=84=E4=BB=B6=E5=AE=9A?= =?UTF-8?q?=E4=B9=89=EF=BC=88=E5=95=86=E5=93=81=E6=94=B6=E8=97=8F=E6=8C=89?= =?UTF-8?q?=E9=92=AE=E3=80=81SKU=20=E6=8C=89=E9=92=AE=E3=80=81=E5=BA=97?= =?UTF-8?q?=E9=93=BA=E5=85=B3=E6=B3=A8=E5=8D=A1=E7=89=87=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../mona-client-mini/src/components/index.ts | 6 +++ .../src/config/industry.ts | 3 ++ .../ProductFollowButton/alias.ts | 23 +++++++++++ .../baseComponents/ShopFollowCard/alias.ts | 14 +++++++ .../mini/baseComponents/SkuButton/alias.ts | 21 ++++++++++ .../src/target/mini/baseComponents/index.ts | 15 ++++++++ .../src/target/mini/baseComponents/type.ts | 6 +++ packages/mona-shared/src/constants.ts | 3 ++ packages/mona/src/BaseComponents.ts | 38 +++++++++++++++++++ 9 files changed, 129 insertions(+) create mode 100644 packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/ProductFollowButton/alias.ts create mode 100644 packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/ShopFollowCard/alias.ts create mode 100644 packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/SkuButton/alias.ts diff --git a/packages/mona-clients/mona-client-mini/src/components/index.ts b/packages/mona-clients/mona-client-mini/src/components/index.ts index d6dd1c16f..4cd6a57ca 100644 --- a/packages/mona-clients/mona-client-mini/src/components/index.ts +++ b/packages/mona-clients/mona-client-mini/src/components/index.ts @@ -41,6 +41,9 @@ import { RichTextProps, MemberButtonProps, CouponCardProps, + ProductFollowButtonProps, + SkuButtonProps, + ShopFollowCardProps, } from '@bytedance/mona'; export const Text = createBaseComponent(ComponentType['text']); @@ -85,6 +88,9 @@ export const Ad = createBaseComponent(ComponentType['ad']); export const OpenData = createBaseComponent(ComponentType['open-data']); export const MemberButton = createBaseComponent(ComponentType['member-button']); export const CouponCard = createBaseComponent(ComponentType['coupon-card']); +export const ProductFollowButton = createBaseComponent(ComponentType['product-follow-button']); +export const SkuButton = createBaseComponent(ComponentType['sku-button']); +export const ShopFollowCard = createBaseComponent(ComponentType['shop-follow-card']); export const Link = (function createBaseComponent() { const Component = React.forwardRef(({ children, to }: any, ref) => diff --git a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/config/industry.ts b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/config/industry.ts index 8a6005ff3..534d8f165 100644 --- a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/config/industry.ts +++ b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/config/industry.ts @@ -1,3 +1,6 @@ export const industryComponents = { 'coupon-card': 'ext://industry/coupon-card', + 'product-follow-button': 'ext://industry/product-follow-button', + 'sku-button': 'ext://industry/sku-button', + 'shop-follow-card': 'ext://industry/shop-follow-card', }; diff --git a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/ProductFollowButton/alias.ts b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/ProductFollowButton/alias.ts new file mode 100644 index 000000000..165edbdd5 --- /dev/null +++ b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/ProductFollowButton/alias.ts @@ -0,0 +1,23 @@ +import { bubbleEventsAlias, hoverPropAlias, basePropAlias, propAliasMap } from '../prop'; +import { ProductFollowButtonAlias as Alias } from '../type'; + +const alias: Alias = { + ...basePropAlias, + ...hoverPropAlias, + ...bubbleEventsAlias, + shopId: propAliasMap.shopId, + productId: propAliasMap.productId, + disabled: propAliasMap.disabled, + noStyle: propAliasMap.noStyle, + size: propAliasMap.size, + disabledClassName: propAliasMap.disabledClassName, + followedClassName: propAliasMap.followedClassName, + followedText: propAliasMap.followedText, + unfollowedClassName: propAliasMap.unfollowedClassName, + unfollowedText: propAliasMap.unfollowedText, + onFollowed: propAliasMap['bind:followed'], + onUnfollowed: propAliasMap['bind:unfollowed'], + onError: propAliasMap.onError, +}; + +export default alias; diff --git a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/ShopFollowCard/alias.ts b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/ShopFollowCard/alias.ts new file mode 100644 index 000000000..4d6a0b14b --- /dev/null +++ b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/ShopFollowCard/alias.ts @@ -0,0 +1,14 @@ +import { bubbleEventsAlias, hoverPropAlias, basePropAlias, propAliasMap } from '../prop'; +import { ShopFollowCardAlias as Alias } from '../type'; + +const alias: Alias = { + ...basePropAlias, + ...hoverPropAlias, + ...bubbleEventsAlias, + shopId: propAliasMap.shopId, + onFollowed: propAliasMap['bind:followed'], + onUnfollowed: propAliasMap['bind:unfollowed'], + onError: propAliasMap.onError, +}; + +export default alias; diff --git a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/SkuButton/alias.ts b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/SkuButton/alias.ts new file mode 100644 index 000000000..5757c6e08 --- /dev/null +++ b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/SkuButton/alias.ts @@ -0,0 +1,21 @@ +import { bubbleEventsAlias, hoverPropAlias, basePropAlias, propAliasMap } from '../prop'; +import { SkuButtonAlias as Alias } from '../type'; + +const alias: Alias = { + ...basePropAlias, + ...hoverPropAlias, + ...bubbleEventsAlias, + shopId: propAliasMap.shopId, + productId: propAliasMap.productId, + actionType: propAliasMap.actionType, + disabled: propAliasMap.disabled, + noStyle: propAliasMap.noStyle, + size: propAliasMap.size, + type: propAliasMap.type, + disabledClassName: propAliasMap.disabledClassName, + text: propAliasMap.text, + onSuccess: propAliasMap['bind:success'], + onError: propAliasMap.onError, +}; + +export default alias; diff --git a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/index.ts b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/index.ts index beb7e50ff..370d1d813 100644 --- a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/index.ts +++ b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/index.ts @@ -35,6 +35,9 @@ import map from './Map/alias'; import camera from './Camera/alias'; import memberButton from './MemberButton/alias'; import couponCard from './CouponCard/alias'; +import productFollowButton from './ProductFollowButton/alias'; +import skuButton from './SkuButton/alias'; +import shopFollowCard from './ShopFollowCard/alias'; // import map from './Ca/alias'; // import * as Components from '@bytedance/mona-components'; @@ -366,6 +369,18 @@ export const ejsParamsObj: Record< reactComponentName: 'CouponCard', alias: couponCard, }, + [ComponentType['product-follow-button']]: { + reactComponentName: 'ProductFollowButton', + alias: productFollowButton, + }, + [ComponentType['sku-button']]: { + reactComponentName: 'SkuButton', + alias: skuButton, + }, + [ComponentType['shop-follow-card']]: { + reactComponentName: 'ShopFollowCard', + alias: shopFollowCard, + }, }; const baseDefaultProps: Record = { diff --git a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/type.ts b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/type.ts index 815168298..810a8c99d 100644 --- a/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/type.ts +++ b/packages/mona-manager-plugins/mona-service-targets/mona-service-target-mini/src/target/mini/baseComponents/type.ts @@ -36,6 +36,9 @@ import { RichTextProps, MemberButtonProps, CouponCardProps, + ProductFollowButtonProps, + SkuButtonProps, + ShopFollowCardProps, } from '@bytedance/mona'; type Alias = string; @@ -77,3 +80,6 @@ export type TextAlias = AliasMap; export type RichTextAlias = AliasMap; export type MemberButtonAlias = AliasMap; export type CouponCardAlias = AliasMap; +export type ProductFollowButtonAlias = AliasMap; +export type SkuButtonAlias = AliasMap; +export type ShopFollowCardAlias = AliasMap; diff --git a/packages/mona-shared/src/constants.ts b/packages/mona-shared/src/constants.ts index d81ae8273..85503d0a2 100644 --- a/packages/mona-shared/src/constants.ts +++ b/packages/mona-shared/src/constants.ts @@ -46,6 +46,9 @@ const MiniComponentType = { ptext: '36', 'member-button': '37', 'coupon-card': '38', + 'product-follow-button': '39', + 'sku-button': '40', + 'shop-follow-card': '41', }; // TODO:开发模式语义化, 小程序运行时 build两份代码, index.production.js, index.development.js diff --git a/packages/mona/src/BaseComponents.ts b/packages/mona/src/BaseComponents.ts index 44a6e2914..c26113d5d 100644 --- a/packages/mona/src/BaseComponents.ts +++ b/packages/mona/src/BaseComponents.ts @@ -144,6 +144,44 @@ export interface CouponCardProps extends BaseProps { isShowCouponInfo: boolean; productId: string; } + +export interface ProductFollowButtonProps extends Pick { + shopId: string; // 店铺 ID + productId: string; // 商品 ID + disabled?: boolean; // 是否禁用，默认 false + noStyle?: boolean; // 是否关闭默认样式，默认 false + size?: 'default' | 'mini'; // 按钮的大小，默认 mini + disabledClassName?: string; // 禁用状态下的样式类 + followedClassName?: string; // 已收藏状态下的样式类 + followedText?: string; // 已收藏文本，默认 取消收藏 + unfollowedClassName?: string; // 未收藏状态下的样式类 + unfollowedText?: string; // 未收藏文本，默认 收藏 + onFollowed?: EventHandler; // 收藏成功回调 + onUnfollowed?: EventHandler; // 取消收藏成功回调 + onError?: EventHandler; +} + +export interface SkuButtonProps extends Pick { + shopId: string; // 商品 ID + productId: string; // 店铺 ID + actionType?: 1 | 2; // SKU 行为，可取值 1（加购）、2（立购），默认 2 + disabled?: boolean; // 是否禁用，默认 false + noStyle?: boolean; // 是否关闭默认样式，默认 false + size?: 'default' | 'mini'; // 按钮的大小，默认 default + type?: 'default' | 'primary'; // 按钮的样式类型，默认 primary + disabledClassName?: string; // 禁用状态下的样式类 + text?: string; // 按钮文案，默认 立即购买 + onSuccess?: EventHandler; // 打开成功回调 + onError?: EventHandler; +} + +export interface ShopFollowCardProps extends Pick { + shopId: string; + onFollowed?: EventHandler; // 关注成功回调 + onUnfollowed?: EventHandler; // 取消关注成功回调 + onError?: EventHandler; +} + export interface ProgressProps extends BaseProps { percent?: number; strokeWidth?: number;