ordering-ui-react-native 0.12.61 → 0.12.62
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/themes/single-business/src/components/Cart/index.tsx +47 -26
- package/themes/single-business/src/components/Cart/styles.tsx +9 -0
- package/themes/single-business/src/components/TaxInformation/index.tsx +22 -17
- package/themes/single-business/src/components/TaxInformation/styles.tsx +3 -2
- package/themes/single-business/src/types/index.tsx +1 -1
package/package.json
CHANGED
|
@@ -8,7 +8,7 @@ import {
|
|
|
8
8
|
useValidationFields,
|
|
9
9
|
} from 'ordering-components/native';
|
|
10
10
|
import { useTheme } from 'styled-components/native';
|
|
11
|
-
import { ScrollView, View, useWindowDimensions, ActivityIndicator } from 'react-native';
|
|
11
|
+
import { ScrollView, View, useWindowDimensions, ActivityIndicator, StyleSheet } from 'react-native';
|
|
12
12
|
import {
|
|
13
13
|
CheckoutAction,
|
|
14
14
|
OSBill,
|
|
@@ -20,7 +20,8 @@ import {
|
|
|
20
20
|
BIHeader,
|
|
21
21
|
BIInfo,
|
|
22
22
|
BIContentInfo,
|
|
23
|
-
BITotal
|
|
23
|
+
BITotal,
|
|
24
|
+
TopHeader
|
|
24
25
|
} from './styles';
|
|
25
26
|
|
|
26
27
|
import { ProductItemAccordion } from '../ProductItemAccordion';
|
|
@@ -187,6 +188,15 @@ const CartUI = (props: any) => {
|
|
|
187
188
|
)
|
|
188
189
|
}
|
|
189
190
|
|
|
191
|
+
const styles = StyleSheet.create({
|
|
192
|
+
headerItem: {
|
|
193
|
+
overflow: 'hidden',
|
|
194
|
+
backgroundColor: theme.colors.clear,
|
|
195
|
+
width: 35,
|
|
196
|
+
marginVertical: 18,
|
|
197
|
+
},
|
|
198
|
+
})
|
|
199
|
+
|
|
190
200
|
return (
|
|
191
201
|
cart?.products?.length > 0 ? (
|
|
192
202
|
<ScrollView
|
|
@@ -307,32 +317,22 @@ const CartUI = (props: any) => {
|
|
|
307
317
|
</OSTable>
|
|
308
318
|
)}
|
|
309
319
|
|
|
310
|
-
<OSTotal>
|
|
311
|
-
<OSTable style={{ marginTop: 15 }}>
|
|
312
|
-
<OText size={14} lineHeight={21} weight={'600'}>
|
|
313
|
-
{t('TOTAL', 'Total')}
|
|
314
|
-
</OText>
|
|
315
|
-
<OText size={14} lineHeight={21} weight={'600'}>
|
|
316
|
-
{cart?.total >= 1 && parsePrice(cart?.total)}
|
|
317
|
-
</OText>
|
|
318
|
-
</OSTable>
|
|
319
|
-
</OSTotal>
|
|
320
320
|
{cart?.status !== 2 && (
|
|
321
321
|
<OSTable>
|
|
322
|
-
<View style={{ width: '100%', marginTop:
|
|
323
|
-
<OText size={
|
|
322
|
+
<View style={{ width: '100%', marginTop: 0 }}>
|
|
323
|
+
<OText size={14} style={{ marginBottom: 10 }}>{t('COMMENTS', 'Comments')}</OText>
|
|
324
324
|
<View style={{ flex: 1, width: '100%' }}>
|
|
325
325
|
<OInput
|
|
326
326
|
value={cart?.comment}
|
|
327
327
|
placeholder={t('SPECIAL_COMMENTS', 'Special Comments')}
|
|
328
328
|
onChange={(value: string) => handleChangeComment(value)}
|
|
329
329
|
style={{
|
|
330
|
+
borderColor: theme.colors.border,
|
|
331
|
+
borderRadius: 10,
|
|
332
|
+
marginBottom: 20,
|
|
333
|
+
height: 104,
|
|
334
|
+
maxHeight: 104,
|
|
330
335
|
alignItems: 'flex-start',
|
|
331
|
-
width: '100%',
|
|
332
|
-
height: 100,
|
|
333
|
-
borderColor: theme.colors.textSecondary,
|
|
334
|
-
paddingRight: 50,
|
|
335
|
-
marginTop: 10
|
|
336
336
|
}}
|
|
337
337
|
multiline
|
|
338
338
|
/>
|
|
@@ -349,6 +349,17 @@ const CartUI = (props: any) => {
|
|
|
349
349
|
</View>
|
|
350
350
|
</OSTable>
|
|
351
351
|
)}
|
|
352
|
+
|
|
353
|
+
<OSTotal>
|
|
354
|
+
<OSTable style={{ marginTop: 15 }}>
|
|
355
|
+
<OText size={14} lineHeight={21} weight={'600'}>
|
|
356
|
+
{t('TOTAL', 'Total')}
|
|
357
|
+
</OText>
|
|
358
|
+
<OText size={14} lineHeight={21} weight={'600'}>
|
|
359
|
+
{cart?.total >= 1 && parsePrice(cart?.total)}
|
|
360
|
+
</OText>
|
|
361
|
+
</OSTable>
|
|
362
|
+
</OSTotal>
|
|
352
363
|
</OSBill>
|
|
353
364
|
)}
|
|
354
365
|
</View>
|
|
@@ -427,7 +438,24 @@ const CartUI = (props: any) => {
|
|
|
427
438
|
onSave={handlerProductAction}
|
|
428
439
|
onClose={() => setModalIsOpen(false)}
|
|
429
440
|
/>
|
|
441
|
+
</OModal>
|
|
430
442
|
|
|
443
|
+
<OModal
|
|
444
|
+
open={openTaxModal.open}
|
|
445
|
+
onClose={() => setOpenTaxModal({ open: false, data: null })}
|
|
446
|
+
entireModal
|
|
447
|
+
customClose
|
|
448
|
+
>
|
|
449
|
+
<>
|
|
450
|
+
<TopHeader>
|
|
451
|
+
<TouchableOpacity
|
|
452
|
+
style={styles.headerItem}
|
|
453
|
+
onPress={() => setOpenTaxModal({ open: false, data: null })}>
|
|
454
|
+
<OIcon src={theme.images.general.close} width={16} />
|
|
455
|
+
</TouchableOpacity>
|
|
456
|
+
</TopHeader>
|
|
457
|
+
<TaxInformation data={openTaxModal.data} products={cart?.products} />
|
|
458
|
+
</>
|
|
431
459
|
</OModal>
|
|
432
460
|
</ScrollView>
|
|
433
461
|
) : (
|
|
@@ -445,13 +473,6 @@ const CartUI = (props: any) => {
|
|
|
445
473
|
image={theme.images.general.notFound}
|
|
446
474
|
/>
|
|
447
475
|
</View>
|
|
448
|
-
<OModal
|
|
449
|
-
open={openTaxModal.open}
|
|
450
|
-
onClose={() => setOpenTaxModal({ open: false, data: null })}
|
|
451
|
-
entireModal
|
|
452
|
-
>
|
|
453
|
-
<TaxInformation data={openTaxModal.data} products={cart?.products} />
|
|
454
|
-
</OModal>
|
|
455
476
|
</Container>
|
|
456
477
|
)
|
|
457
478
|
)
|
|
@@ -100,3 +100,12 @@ export const BITotal = styled.View`
|
|
|
100
100
|
flex-direction: column;
|
|
101
101
|
align-items: flex-end;
|
|
102
102
|
`
|
|
103
|
+
|
|
104
|
+
export const TopHeader = styled.View`
|
|
105
|
+
width: 100%;
|
|
106
|
+
flex-direction: row;
|
|
107
|
+
align-items: center;
|
|
108
|
+
justify-content: space-between;
|
|
109
|
+
z-index: 1;
|
|
110
|
+
padding-horizontal: 40px;
|
|
111
|
+
`
|
|
@@ -21,31 +21,36 @@ export const TaxInformation = (props: taxInformationParams) => {
|
|
|
21
21
|
const isTax = typeof data?.rate === 'number'
|
|
22
22
|
const TaxFeeString = isTax ? 'tax' : 'fee'
|
|
23
23
|
const includedOnPriceString = data?.type === 1 ? `(${t('INCLUDED_ON_PRICE', 'Included on price')})` : `(${t('NOT_INCLUDED_ON_PRICE', 'Not included on price')})`
|
|
24
|
+
const productsWithTaxes = products
|
|
25
|
+
.filter((product: any) => isTax
|
|
26
|
+
? (product.tax?.id ? product.tax?.id === data?.id: product.tax?.id === null && data?.id === null)
|
|
27
|
+
: (product.fee?.id ? product.fee?.id === data?.id : (product.fee?.id === null && data?.id === null))) ?? []
|
|
24
28
|
|
|
25
29
|
return (
|
|
26
30
|
<TaxInformationContainer>
|
|
27
|
-
<OText size={
|
|
28
|
-
{`${data?.name
|
|
29
|
-
t('INHERIT_FROM_BUSINESS', 'Inherit from business')} (${typeof data?.rate === 'number' ? `${data?.rate}%` : `${parsePrice(data?.fixed ?? 0)} + ${data?.percentage}%`})`}
|
|
31
|
+
<OText size={18} style={{ alignSelf: 'flex-start', textAlign: 'left' }} mBottom={10}>
|
|
32
|
+
{`${data?.name ?? t('INHERIT_FROM_BUSINESS', 'Inherit from business')} (${typeof data?.rate === 'number' ? `${data?.rate}%` : `${parsePrice(data?.fixed ?? 0)} + ${data?.percentage}%`})`}
|
|
30
33
|
</OText>
|
|
31
34
|
{data?.description && (
|
|
32
|
-
<OText mBottom={10} size={
|
|
35
|
+
<OText mBottom={10} size={16} style={{ alignSelf: 'flex-start', textAlign: 'left' }}>
|
|
33
36
|
{t('DESCRIPTION', 'Description')}: {data?.description} {data?.type && includedOnPriceString}
|
|
34
37
|
</OText>
|
|
35
38
|
)}
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
39
|
+
{productsWithTaxes.length > 0 && (
|
|
40
|
+
<>
|
|
41
|
+
<OText>{`${t(`OTHER_PRODUCTS_WITH_THIS_${TaxFeeString.toUpperCase()}`, `Other products with this ${TaxFeeString}`)}:`}</OText>
|
|
42
|
+
<ProductContainer>
|
|
43
|
+
{productsWithTaxes.map(product => (
|
|
44
|
+
<SingleProductCard
|
|
45
|
+
key={product.id}
|
|
46
|
+
product={product}
|
|
47
|
+
isSoldOut={false}
|
|
48
|
+
businessId={product?.business_id}
|
|
49
|
+
/>
|
|
50
|
+
))}
|
|
51
|
+
</ProductContainer>
|
|
52
|
+
</>
|
|
53
|
+
)}
|
|
49
54
|
</TaxInformationContainer>
|
|
50
55
|
)
|
|
51
56
|
}
|