Official Account component hub
User can view the OA collection, PromoCom. The kind of OA Nearest, Similar, Suggestion
Implementation
package.json
"@officialaccount/components": "latest"
webpack.config.js
include: [
// ...
/node_modules(.*[/\\])+@officialaccount[/\\]components/
]
IMPORT
import { OaHub, TypeDisplay, DisplaySize } from '@officialaccount/components';
enum TypeDisplay
{
DEFAULT: 'SUGGESTION',
SUGGESTION: 'SUGGESTION',
NEARBY: 'NEARBY',
NEARBY_OA: 'NEARBY_OA',
SIMILAR_TO_OA: 'SIMILAR_TO_OA',
REVIEW: 'REVIEW',
}
enum DisplaySize
{
DEFAULT: 'SLIDER_SMALL',
SINGLE_MEDIUM: 'SINGLE_MEDIUM',
SINGLE_LARGE: 'SINGLE_LARGE',
SLIDER_SMALL: 'SLIDER_SMALL',
LIST_MEDIUM: 'LIST_MEDIUM',
}
TYPE = TypeDisplay.SIMILAR_TO_OA
SIZE = DisplaySize.SLIDER_SMALL
return (
<SafeAreaView>
<OaHub params={{
oa_id: oa_id,
store_id: store_id,
limit: 5
}} header={{
title: 'QUÁN TƯƠNG TỰ',
rightButton: {
buttonTitle: 'Xem thêm',
refId: 'oa_local_discovery'
},
isShowHeader: true, //default is true
}}
type={ TypeDisplay.SIMILAR_TO_OA }
size= { DisplaySize.SLIDER_SMALL }/>
</SafeAreaView>
)
TYPE = TypeDisplay.NEARBY
SIZE = DisplaySize.LIST_MEDIUM
LOCATION is optional
return (
<SafeAreaView>
<OaHub
type={ TypeDisplay.NEARBY }
size={ DisplaySize.LIST_MEDIUM }
params={{
merchant_id: merchant_id,
store_id: store_id,
limit: 3,
latitude: 10.7741709,
longitude: 106.7014805,
}}
header={{
title: 'Cửa hàng gần bạn',
isShowHeader: false, //default is true,
styleHeaderTitle: { fontWeight: 'bold', fontSize: 16, color: 'rgba(86, 86, 86)' }
}}
styleSection={{
marginHorizontal: 0,
paddingHorizontal: 0
}}
/>
</SafeAreaView>
)
TYPE = TypeDisplay.DEFAULT
SIZE = DisplaySize.SINGLE_MEDIUM
LOCATION is optional
return (
<SafeAreaView>
<OaHub
type={ TypeDisplay.NEARBY }
size={ DisplaySize.SINGLE_MEDIUM }
params={{
oa_id: oa_id,
merchant_id: merchant_id,
store_id: store_id,
limit: 1,
latitude: 10.7741709,
longitude: 106.7014805,
}}
header={{
title: '',
isShowHeader: true, //default is true,
}}
styleSection={{
marginHorizontal: 0,
paddingHorizontal: 0
}}
/>
</SafeAreaView>
)
Container DEFAULT TYPE: NEARY_OA