ordering-ui-react-native 0.12.12 → 0.12.13
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/business/src/components/AcceptOrRejectOrder/index.tsx +10 -4
- package/themes/business/src/components/MapView/index.tsx +4 -4
- package/themes/business/src/components/NewOrderNotification/index.tsx +20 -6
- package/themes/business/src/components/OrderDetails/Delivery.tsx +5 -4
- package/themes/business/src/components/OrderDetails/OrderContentComponent.tsx +13 -0
- package/themes/business/src/components/OrdersOption/index.tsx +99 -105
- package/themes/business/src/types/index.tsx +1 -0
package/package.json
CHANGED
|
@@ -111,7 +111,7 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
|
|
|
111
111
|
openTimerIOnput();
|
|
112
112
|
}
|
|
113
113
|
|
|
114
|
-
if (actions && action === 'reject') {
|
|
114
|
+
if (actions && (action === 'reject' || action === 'failed')) {
|
|
115
115
|
openTextTareaOInput();
|
|
116
116
|
}
|
|
117
117
|
}, []);
|
|
@@ -178,6 +178,10 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
|
|
|
178
178
|
comment: comments,
|
|
179
179
|
status: 6,
|
|
180
180
|
},
|
|
181
|
+
failedByDriver: {
|
|
182
|
+
comment: comments,
|
|
183
|
+
status: 12
|
|
184
|
+
}
|
|
181
185
|
};
|
|
182
186
|
|
|
183
187
|
if (actions && action === 'accept') {
|
|
@@ -186,6 +190,9 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
|
|
|
186
190
|
if (actions && action === 'reject') {
|
|
187
191
|
bodyToSend = orderStatus[actions.reject];
|
|
188
192
|
}
|
|
193
|
+
if(actions && action === 'failed'){
|
|
194
|
+
bodyToSend = orderStatus[actions.failed]
|
|
195
|
+
}
|
|
189
196
|
|
|
190
197
|
bodyToSend.id = orderId;
|
|
191
198
|
|
|
@@ -330,7 +337,6 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
|
|
|
330
337
|
</Timer>
|
|
331
338
|
</View>
|
|
332
339
|
)}
|
|
333
|
-
|
|
334
340
|
<TimeField
|
|
335
341
|
ref={timerRef}
|
|
336
342
|
keyboardType="numeric"
|
|
@@ -346,11 +352,11 @@ export const AcceptOrRejectOrder = (props: AcceptOrRejectOrderParams) => {
|
|
|
346
352
|
onEndEditing={handleFixTime}
|
|
347
353
|
/>
|
|
348
354
|
|
|
349
|
-
{action === 'reject' && (
|
|
355
|
+
{(action === 'reject' || action === 'failed') && (
|
|
350
356
|
<Comments ref={viewRef}>
|
|
351
357
|
<OTextarea
|
|
352
358
|
textTareaRef={textTareaRef}
|
|
353
|
-
autoFocus={actions && action === 'reject'}
|
|
359
|
+
autoFocus={actions && (action === 'reject' || action === 'failed')}
|
|
354
360
|
onFocus={handleFocus}
|
|
355
361
|
placeholder={t(
|
|
356
362
|
'PLEASE_TYPE_YOUR_COMMENTS_IN_HERE',
|
|
@@ -42,7 +42,7 @@ const MapViewComponent = (props: MapViewParams) => {
|
|
|
42
42
|
} = useLocation();
|
|
43
43
|
|
|
44
44
|
const location = { lat: userLocation.latitude, lng: userLocation.longitude }
|
|
45
|
-
|
|
45
|
+
const haveOrders = Object.values(markerGroups)?.length > 0 && Object.values(customerMarkerGroups)?.length > 0
|
|
46
46
|
const closeAlert = () => {
|
|
47
47
|
setAlertState({
|
|
48
48
|
open: false,
|
|
@@ -222,8 +222,8 @@ const MapViewComponent = (props: MapViewParams) => {
|
|
|
222
222
|
initialRegion={{
|
|
223
223
|
latitude: initialPosition.latitude,
|
|
224
224
|
longitude: initialPosition.longitude,
|
|
225
|
-
latitudeDelta: 0.
|
|
226
|
-
longitudeDelta: 0.
|
|
225
|
+
latitudeDelta: haveOrders ? 0.01 : 0.1,
|
|
226
|
+
longitudeDelta: haveOrders ? 0.01 * ASPECT_RATIO : 0.1 * ASPECT_RATIO,
|
|
227
227
|
}}
|
|
228
228
|
style={{ flex: 1 }}
|
|
229
229
|
zoomTapEnabled
|
|
@@ -241,7 +241,7 @@ const MapViewComponent = (props: MapViewParams) => {
|
|
|
241
241
|
orderIds={marker.map((order: any) => order.id).join(', ')}
|
|
242
242
|
/>
|
|
243
243
|
))}
|
|
244
|
-
{Object.values(customerMarkerGroups).map((marker: any) =>
|
|
244
|
+
{Object.values(customerMarkerGroups).map((marker: any) => (
|
|
245
245
|
<RenderMarker
|
|
246
246
|
key={marker[0]?.customer_id}
|
|
247
247
|
marker={marker[0]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useState, useEffect, useCallback } from 'react'
|
|
2
|
-
import { useEvent, useLanguage, useUtils, useSession } from 'ordering-components/native'
|
|
2
|
+
import { useEvent, useLanguage, useUtils, useSession, useApi } from 'ordering-components/native'
|
|
3
3
|
import { View, Modal, StyleSheet, TouchableOpacity, Dimensions } from 'react-native'
|
|
4
4
|
import { OText, OIcon } from '../shared'
|
|
5
5
|
import { useTheme } from 'styled-components/native'
|
|
@@ -7,7 +7,7 @@ import Icon from 'react-native-vector-icons/Feather'
|
|
|
7
7
|
import { NotificationContainer } from './styles'
|
|
8
8
|
import Sound from 'react-native-sound'
|
|
9
9
|
import moment from 'moment'
|
|
10
|
-
|
|
10
|
+
import { useLocation } from '../../hooks/useLocation'
|
|
11
11
|
Sound.setCategory('Playback')
|
|
12
12
|
|
|
13
13
|
const windowWidth = Dimensions.get('screen').width
|
|
@@ -16,9 +16,10 @@ export const NewOrderNotification = (props: any) => {
|
|
|
16
16
|
const [events] = useEvent()
|
|
17
17
|
const theme = useTheme()
|
|
18
18
|
const [, t] = useLanguage()
|
|
19
|
-
const [{ user }] = useSession()
|
|
19
|
+
const [{ user, token }] = useSession()
|
|
20
|
+
const [ordering] = useApi()
|
|
20
21
|
const [{ getTimeAgo }] = useUtils()
|
|
21
|
-
|
|
22
|
+
const { getCurrentLocation } = useLocation();
|
|
22
23
|
const [modalOpen, setModalOpen] = useState(false)
|
|
23
24
|
const [newOrderId, setNewOrderId] = useState(null)
|
|
24
25
|
const [soundTimeout, setSoundTimeout] = useState<any>(null)
|
|
@@ -33,15 +34,21 @@ export const NewOrderNotification = (props: any) => {
|
|
|
33
34
|
|
|
34
35
|
|
|
35
36
|
const handlePlayNotificationSound = () => {
|
|
37
|
+
let times = 0
|
|
36
38
|
const _timeout = setInterval(function () {
|
|
37
39
|
notificationSound.play(success => {
|
|
38
40
|
if (success) {
|
|
39
41
|
console.log('successfully finished playing');
|
|
42
|
+
times = times + 1
|
|
40
43
|
} else {
|
|
41
44
|
console.log('playback failed due to audio decoding errors');
|
|
42
45
|
}
|
|
43
46
|
})
|
|
44
47
|
setSoundTimeout(_timeout)
|
|
48
|
+
if (times === 3) {
|
|
49
|
+
clearInterval(_timeout)
|
|
50
|
+
clearInterval(soundTimeout)
|
|
51
|
+
}
|
|
45
52
|
}, 2500)
|
|
46
53
|
}
|
|
47
54
|
|
|
@@ -64,9 +71,16 @@ export const NewOrderNotification = (props: any) => {
|
|
|
64
71
|
}
|
|
65
72
|
}, [handleNotification])
|
|
66
73
|
|
|
67
|
-
|
|
68
|
-
const handleUpdateOrder = useCallback((order: any) => {
|
|
74
|
+
const handleUpdateOrder = useCallback(async (order: any) => {
|
|
69
75
|
if (order?.driver) {
|
|
76
|
+
const location = await getCurrentLocation()
|
|
77
|
+
await fetch(`${ordering.root}/users/${user.id}/locations`, {
|
|
78
|
+
method: 'POST',
|
|
79
|
+
body: JSON.stringify({
|
|
80
|
+
location: JSON.stringify({location: `{lat: ${location.latitude}, lng: ${location.longitude}}`})
|
|
81
|
+
}),
|
|
82
|
+
headers: { 'Content-Type': 'application/json', Authorization: `Bearer ${token}` }
|
|
83
|
+
})
|
|
70
84
|
const assignedTimeDiff = moment.utc(order?.driver?.last_order_assigned_at).local().fromNow()
|
|
71
85
|
if (assignedTimeDiff === 'a few seconds ago') {
|
|
72
86
|
clearInterval(soundTimeout)
|
|
@@ -75,13 +75,14 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
|
|
|
75
75
|
const showFloatButtonsPickUp: any = {
|
|
76
76
|
8: true,
|
|
77
77
|
3: true,
|
|
78
|
-
18: true
|
|
78
|
+
18: true,
|
|
79
79
|
};
|
|
80
80
|
|
|
81
81
|
const showFloatButtonsAcceptOrReject: any = {
|
|
82
82
|
0: true,
|
|
83
83
|
4: true,
|
|
84
84
|
7: true,
|
|
85
|
+
14: true
|
|
85
86
|
};
|
|
86
87
|
|
|
87
88
|
const marginContainer: any = {
|
|
@@ -295,7 +296,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
|
|
|
295
296
|
</Pickup>
|
|
296
297
|
)}
|
|
297
298
|
{(order?.status === 3) && order?.delivery_type === 1 && (
|
|
298
|
-
<View style={{paddingVertical: 20, marginBottom: 20}}>
|
|
299
|
+
<View style={{ paddingVertical: 20, marginBottom: 20 }}>
|
|
299
300
|
<OButton
|
|
300
301
|
style={styles.btnPickUp}
|
|
301
302
|
textStyle={{ color: theme.colors.white }}
|
|
@@ -388,7 +389,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
|
|
|
388
389
|
handleChangeOrderStatus && handleChangeOrderStatus(9)
|
|
389
390
|
}
|
|
390
391
|
firstButtonClick={() =>
|
|
391
|
-
|
|
392
|
+
handleViewActionOrder && handleViewActionOrder('failed')
|
|
392
393
|
}
|
|
393
394
|
secondBtnText={t('PICKUP_COMPLETE', 'Pickup complete')}
|
|
394
395
|
secondButton={true}
|
|
@@ -407,7 +408,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
|
|
|
407
408
|
handleChangeOrderStatus && handleChangeOrderStatus(11)
|
|
408
409
|
}
|
|
409
410
|
firstButtonClick={() =>
|
|
410
|
-
|
|
411
|
+
handleViewActionOrder && handleViewActionOrder('failed')
|
|
411
412
|
}
|
|
412
413
|
secondBtnText={t('DELIVERY_COMPLETE', 'Delivery complete')}
|
|
413
414
|
secondButton={true}
|
|
@@ -49,6 +49,9 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
49
49
|
textBold: {
|
|
50
50
|
fontWeight: '600',
|
|
51
51
|
},
|
|
52
|
+
textLink: {
|
|
53
|
+
color: '#365CC7'
|
|
54
|
+
}
|
|
52
55
|
})
|
|
53
56
|
return (
|
|
54
57
|
<OrderContent>
|
|
@@ -67,6 +70,7 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
67
70
|
PressStyle={styles.linkWithIcons}
|
|
68
71
|
url={`mailto:${order?.business?.email}`}
|
|
69
72
|
shorcut={order?.business?.email}
|
|
73
|
+
TextStyle={styles.textLink}
|
|
70
74
|
/>
|
|
71
75
|
</View>
|
|
72
76
|
)}
|
|
@@ -77,6 +81,7 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
77
81
|
PressStyle={styles.linkWithIcons}
|
|
78
82
|
url={`tel:${order?.business?.cellphone}`}
|
|
79
83
|
shorcut={`${order?.business?.cellphone}`}
|
|
84
|
+
TextStyle={styles.textLink}
|
|
80
85
|
/>
|
|
81
86
|
</View>
|
|
82
87
|
)}
|
|
@@ -87,6 +92,7 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
87
92
|
PressStyle={styles.linkWithIcons}
|
|
88
93
|
url={`tel:${order?.business?.phone}`}
|
|
89
94
|
shorcut={order?.business?.phone}
|
|
95
|
+
TextStyle={styles.textLink}
|
|
90
96
|
/>
|
|
91
97
|
</View>
|
|
92
98
|
)}
|
|
@@ -100,6 +106,7 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
100
106
|
android: `geo:0,0?q=${order?.business?.address}`,
|
|
101
107
|
})}
|
|
102
108
|
shorcut={order?.business?.address}
|
|
109
|
+
TextStyle={styles.textLink}
|
|
103
110
|
/>
|
|
104
111
|
</View>
|
|
105
112
|
)}
|
|
@@ -113,6 +120,7 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
113
120
|
android: `geo:0,0?q=${order?.business?.address_notes}`,
|
|
114
121
|
})}
|
|
115
122
|
shorcut={order?.business?.address_notes}
|
|
123
|
+
TextStyle={styles.textLink}
|
|
116
124
|
/>
|
|
117
125
|
</View>
|
|
118
126
|
)}
|
|
@@ -165,6 +173,8 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
165
173
|
PressStyle={styles.linkWithIcons}
|
|
166
174
|
url={`mailto:${order?.customer?.email}`}
|
|
167
175
|
shorcut={order?.customer?.email}
|
|
176
|
+
TextStyle={styles.textLink}
|
|
177
|
+
|
|
168
178
|
/>
|
|
169
179
|
</View>
|
|
170
180
|
)}
|
|
@@ -175,6 +185,7 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
175
185
|
PressStyle={styles.linkWithIcons}
|
|
176
186
|
url={`tel:${order?.customer?.cellphone}`}
|
|
177
187
|
shorcut={order?.customer?.cellphone}
|
|
188
|
+
TextStyle={styles.textLink}
|
|
178
189
|
/>
|
|
179
190
|
</View>
|
|
180
191
|
)}
|
|
@@ -185,6 +196,7 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
185
196
|
PressStyle={styles.linkWithIcons}
|
|
186
197
|
url={`tel:${order?.customer?.phone}`}
|
|
187
198
|
shorcut={order?.customer?.phone}
|
|
199
|
+
TextStyle={styles.textLink}
|
|
188
200
|
/>
|
|
189
201
|
</View>
|
|
190
202
|
)}
|
|
@@ -198,6 +210,7 @@ export const OrderContentComponent = (props: OrderContent) => {
|
|
|
198
210
|
android: `geo:0,0?q=${order?.customer?.address}`,
|
|
199
211
|
})}
|
|
200
212
|
shorcut={order?.customer?.address}
|
|
213
|
+
TextStyle={styles.textLink}
|
|
201
214
|
/>
|
|
202
215
|
</View>
|
|
203
216
|
)}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useEffect, useState, useRef } from 'react';
|
|
2
|
-
import { View, Pressable, StyleSheet, ScrollView, RefreshControl, Linking } from 'react-native';
|
|
2
|
+
import { View, Pressable, StyleSheet, ScrollView, RefreshControl, Linking, Platform } from 'react-native';
|
|
3
3
|
import { useLanguage, useUtils, OrderListGroups } from 'ordering-components/native';
|
|
4
4
|
import { Placeholder, PlaceholderLine, Fade } from 'rn-placeholder';
|
|
5
5
|
import FeatherIcon from 'react-native-vector-icons/Feather';
|
|
@@ -41,11 +41,10 @@ const tabsList: any = {
|
|
|
41
41
|
};
|
|
42
42
|
|
|
43
43
|
const tabsListText: any = {
|
|
44
|
-
1: '
|
|
45
|
-
2: '
|
|
46
|
-
3: '
|
|
47
|
-
4: '
|
|
48
|
-
5: 'cancelled'
|
|
44
|
+
1: 'pending',
|
|
45
|
+
2: 'inProgress',
|
|
46
|
+
3: 'completed',
|
|
47
|
+
4: 'cancelled'
|
|
49
48
|
};
|
|
50
49
|
|
|
51
50
|
const swipeConfig = {
|
|
@@ -87,7 +86,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
|
|
|
87
86
|
type: ''
|
|
88
87
|
}
|
|
89
88
|
}
|
|
90
|
-
|
|
89
|
+
|
|
91
90
|
const theme = useTheme();
|
|
92
91
|
const [, t] = useLanguage();
|
|
93
92
|
const [{ parseDate }] = useUtils()
|
|
@@ -192,7 +191,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
|
|
|
192
191
|
}
|
|
193
192
|
})
|
|
194
193
|
const dateRange = calculateDate(search.date.type, search.date.from, search.date.to)
|
|
195
|
-
onFiltered && onFiltered({...search, date: {...dateRange}})
|
|
194
|
+
onFiltered && onFiltered({ ...search, date: { ...dateRange } })
|
|
196
195
|
setOpenModal(false)
|
|
197
196
|
}
|
|
198
197
|
|
|
@@ -249,29 +248,29 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
|
|
|
249
248
|
switch (type) {
|
|
250
249
|
case 'today':
|
|
251
250
|
const date = parseDate(new Date(), { outputFormat: 'MM/DD/YYYY' })
|
|
252
|
-
return {from: `${date} 00:00:00`, to: `${date} 23:59:59`}
|
|
251
|
+
return { from: `${date} 00:00:00`, to: `${date} 23:59:59` }
|
|
253
252
|
case 'yesterday':
|
|
254
253
|
const yesterday = new Date()
|
|
255
254
|
yesterday.setDate(yesterday.getDate() - 1)
|
|
256
255
|
const start1 = parseDate(yesterday, { outputFormat: 'MM/DD/YYYY' })
|
|
257
256
|
const end1 = parseDate(new Date(), { outputFormat: 'MM/DD/YYYY' })
|
|
258
|
-
return {from: `${start1} 00:00:00`, to: `${end1} 23:59:59`}
|
|
257
|
+
return { from: `${start1} 00:00:00`, to: `${end1} 23:59:59` }
|
|
259
258
|
case 'last_7days':
|
|
260
259
|
const last_7days = new Date()
|
|
261
260
|
last_7days.setDate(last_7days.getDate() - 6)
|
|
262
261
|
const start7 = parseDate(last_7days, { outputFormat: 'MM/DD/YYYY' })
|
|
263
262
|
const end7 = parseDate(new Date(), { outputFormat: 'MM/DD/YYYY' })
|
|
264
|
-
return {from: `${start7} 00:00:00`, to: `${end7} 23:59:59`}
|
|
263
|
+
return { from: `${start7} 00:00:00`, to: `${end7} 23:59:59` }
|
|
265
264
|
case 'last_30days':
|
|
266
265
|
const last_30days = new Date()
|
|
267
266
|
last_30days.setDate(last_30days.getDate() - 29)
|
|
268
267
|
const start30 = parseDate(last_30days, { outputFormat: 'MM/DD/YYYY' })
|
|
269
268
|
const end30 = parseDate(new Date(), { outputFormat: 'MM/DD/YYYY' })
|
|
270
|
-
return {from: `${start30} 00:00:00`, to: `${end30} 23:59:59`}
|
|
269
|
+
return { from: `${start30} 00:00:00`, to: `${end30} 23:59:59` }
|
|
271
270
|
default:
|
|
272
271
|
const start = from ? `${parseDate(from, { outputFormat: 'MM/DD/YYYY' })} 00:00:00` : ''
|
|
273
272
|
const end = to ? `${parseDate(to, { outputFormat: 'MM/DD/YYYY' })} 23:59:59` : ''
|
|
274
|
-
return {from: start, to: end}
|
|
273
|
+
return { from: start, to: end }
|
|
275
274
|
}
|
|
276
275
|
}
|
|
277
276
|
|
|
@@ -311,22 +310,22 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
|
|
|
311
310
|
</IconWrapper>
|
|
312
311
|
</View>
|
|
313
312
|
{isBusinessApp && (
|
|
314
|
-
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'flex-start', maxHeight:40}}>
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
313
|
+
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'flex-start', maxHeight: 40 }}>
|
|
314
|
+
<OIcon
|
|
315
|
+
src={theme.images.general.information}
|
|
316
|
+
width={12}
|
|
317
|
+
height={12}
|
|
318
|
+
color={theme.colors.skyBlue}
|
|
319
|
+
style={{ marginRight: 5 }}
|
|
320
|
+
/>
|
|
321
|
+
<OText size={12}>
|
|
322
|
+
{t('MORE_SETTINGS_GO_TO', 'For more settings go to ')}
|
|
323
|
+
</OText>
|
|
324
|
+
<TouchableOpacity onPress={() => { Linking.openURL('https://new-admin.tryordering.com/') }}>
|
|
325
|
+
<OText size={12} color={theme.colors.skyBlue}>
|
|
326
|
+
{t('LINK_MORE_SETTINGS_GO_TO', 'new-admin.ordering.co')}
|
|
324
327
|
</OText>
|
|
325
|
-
|
|
326
|
-
<OText size={12} color={theme.colors.skyBlue}>
|
|
327
|
-
{t('LINK_MORE_SETTINGS_GO_TO', 'new-admin.ordering.co')}
|
|
328
|
-
</OText>
|
|
329
|
-
</TouchableOpacity>
|
|
328
|
+
</TouchableOpacity>
|
|
330
329
|
</View>
|
|
331
330
|
)}
|
|
332
331
|
<FiltersTab>
|
|
@@ -406,7 +405,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
|
|
|
406
405
|
onPress={() => !currentOrdersGroup.loading && handleTagSelected(key)}
|
|
407
406
|
isSelected={
|
|
408
407
|
currentOrdersGroup.currentFilter.includes(key) &&
|
|
409
|
-
|
|
408
|
+
!isEqual(currentOrdersGroup.currentFilter, tagsList)
|
|
410
409
|
? theme.colors.primary
|
|
411
410
|
: theme.colors.tabBar
|
|
412
411
|
}>
|
|
@@ -414,7 +413,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
|
|
|
414
413
|
style={styles.tag}
|
|
415
414
|
color={
|
|
416
415
|
currentOrdersGroup.currentFilter.includes(key) &&
|
|
417
|
-
|
|
416
|
+
!isEqual(currentOrdersGroup.currentFilter, tagsList)
|
|
418
417
|
? theme.colors.white
|
|
419
418
|
: theme.colors.black
|
|
420
419
|
}>
|
|
@@ -442,88 +441,88 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
|
|
|
442
441
|
/>
|
|
443
442
|
}
|
|
444
443
|
>
|
|
445
|
-
{!currentOrdersGroup
|
|
446
|
-
currentOrdersGroup
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
444
|
+
{!currentOrdersGroup.error?.length &&
|
|
445
|
+
currentOrdersGroup.orders?.length > 0 &&
|
|
446
|
+
(
|
|
447
|
+
<PreviousOrders
|
|
448
|
+
orders={currentOrdersGroup.orders}
|
|
449
|
+
onNavigationRedirect={onNavigationRedirect}
|
|
450
|
+
getOrderStatus={getOrderStatus}
|
|
451
|
+
handleClickOrder={handleClickOrder}
|
|
452
|
+
/>
|
|
453
|
+
)}
|
|
455
454
|
|
|
456
455
|
{(currentOrdersGroup?.loading ||
|
|
457
456
|
currentOrdersGroup?.pagination?.total === null) &&
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
style={{
|
|
465
|
-
width: '100%',
|
|
466
|
-
flexDirection: 'row',
|
|
467
|
-
marginBottom: 10,
|
|
468
|
-
}}>
|
|
469
|
-
<PlaceholderLine
|
|
470
|
-
width={IS_PORTRAIT ? 22 : 11}
|
|
471
|
-
height={74}
|
|
457
|
+
(
|
|
458
|
+
<>
|
|
459
|
+
<View>
|
|
460
|
+
{[...Array(5)].map((_, i) => (
|
|
461
|
+
<Placeholder key={i} Animation={Fade}>
|
|
462
|
+
<View
|
|
472
463
|
style={{
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
}}
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
464
|
+
width: '100%',
|
|
465
|
+
flexDirection: 'row',
|
|
466
|
+
marginBottom: 10,
|
|
467
|
+
}}>
|
|
468
|
+
<PlaceholderLine
|
|
469
|
+
width={IS_PORTRAIT ? 22 : 11}
|
|
470
|
+
height={74}
|
|
471
|
+
style={{
|
|
472
|
+
marginRight: 20,
|
|
473
|
+
marginBottom: 20,
|
|
474
|
+
borderRadius: 7.6,
|
|
475
|
+
}}
|
|
476
|
+
/>
|
|
477
|
+
<Placeholder>
|
|
478
|
+
<PlaceholderLine width={30} style={{ marginTop: 5 }} />
|
|
479
|
+
<PlaceholderLine width={50} />
|
|
480
|
+
<PlaceholderLine width={20} />
|
|
481
|
+
</Placeholder>
|
|
482
|
+
</View>
|
|
483
|
+
</Placeholder>
|
|
484
|
+
))}
|
|
485
|
+
</View>
|
|
486
|
+
</>
|
|
487
|
+
)}
|
|
489
488
|
|
|
490
489
|
{!currentOrdersGroup?.error?.length &&
|
|
491
490
|
!currentOrdersGroup?.loading &&
|
|
492
491
|
currentOrdersGroup?.pagination?.totalPages &&
|
|
493
492
|
currentOrdersGroup?.pagination?.currentPage < currentOrdersGroup?.pagination?.totalPages &&
|
|
494
493
|
currentOrdersGroup?.orders?.length > 0 &&
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
494
|
+
(
|
|
495
|
+
<OButton
|
|
496
|
+
onClick={handleLoadMore}
|
|
497
|
+
text={t('LOAD_MORE_ORDERS', 'Load more orders')}
|
|
498
|
+
imgRightSrc={null}
|
|
499
|
+
textStyle={styles.loadButtonText}
|
|
500
|
+
style={styles.loadButton}
|
|
501
|
+
bgColor={theme.colors.primary}
|
|
502
|
+
borderColor={theme.colors.primary}
|
|
503
|
+
/>
|
|
504
|
+
)}
|
|
506
505
|
|
|
507
506
|
{!currentOrdersGroup?.loading &&
|
|
508
507
|
(currentOrdersGroup?.error?.length ||
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
508
|
+
currentOrdersGroup?.orders?.length === 0) &&
|
|
509
|
+
(
|
|
510
|
+
<NotFoundSource
|
|
511
|
+
content={
|
|
512
|
+
!currentOrdersGroup?.error?.length
|
|
513
|
+
? t('NO_RESULTS_FOUND', 'Sorry, no results found')
|
|
514
|
+
: currentOrdersGroup?.error[0]?.message ||
|
|
516
515
|
currentOrdersGroup?.error[0] ||
|
|
517
516
|
t('NETWORK_ERROR', 'Network Error')
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
517
|
+
}
|
|
518
|
+
image={theme.images.general.notFound}
|
|
519
|
+
conditioned={false}
|
|
520
|
+
/>
|
|
521
|
+
)}
|
|
523
522
|
</ScrollView>
|
|
524
523
|
</View>
|
|
525
|
-
|
|
526
|
-
|
|
524
|
+
{/* </GestureRecognizer> */}
|
|
525
|
+
|
|
527
526
|
<NewOrderNotification />
|
|
528
527
|
<OModal open={openModal} entireModal customClose>
|
|
529
528
|
<ModalContainer
|
|
@@ -546,7 +545,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
|
|
|
546
545
|
<ModalTitle>{t('SEARCH_ORDERS', 'Search orders')}</ModalTitle>
|
|
547
546
|
<OInput
|
|
548
547
|
value={search.id}
|
|
549
|
-
onChange={(value: any) => setSearch({...search, id: value})}
|
|
548
|
+
onChange={(value: any) => setSearch({ ...search, id: value })}
|
|
550
549
|
style={styles.inputStyle}
|
|
551
550
|
placeholder={t('ORDER_NUMBER', 'Order number')}
|
|
552
551
|
autoCorrect={false}
|
|
@@ -612,6 +611,7 @@ export const OrdersOption = (props: OrdersOptionParams) => {
|
|
|
612
611
|
UIComponent: OrdersOptionUI,
|
|
613
612
|
useDefualtSessionManager: true,
|
|
614
613
|
asDashboard: true,
|
|
614
|
+
isIos: Platform.OS === 'ios',
|
|
615
615
|
orderStatus: [
|
|
616
616
|
{ key: 0, text: t('PENDING', 'Pending') },
|
|
617
617
|
{ key: 1, text: t('COMPLETED', 'Completed') },
|
|
@@ -687,30 +687,24 @@ export const OrdersOption = (props: OrdersOptionParams) => {
|
|
|
687
687
|
tabs: [
|
|
688
688
|
{
|
|
689
689
|
key: 0,
|
|
690
|
-
text: t('Logistics', 'Logistics'),
|
|
691
|
-
tags: [0],
|
|
692
|
-
title: 'Logistics'
|
|
693
|
-
},
|
|
694
|
-
{
|
|
695
|
-
key: 1,
|
|
696
690
|
text: t('PENDING', 'Pending'),
|
|
697
691
|
tags: props?.orderGroupStatusCustom?.pending ?? [0, 13],
|
|
698
692
|
title: 'pending'
|
|
699
693
|
},
|
|
700
694
|
{
|
|
701
|
-
key:
|
|
695
|
+
key: 1,
|
|
702
696
|
text: t('IN_PROGRESS', 'In Progress'),
|
|
703
697
|
tags: props?.orderGroupStatusCustom?.inProgress ?? [3, 4, 7, 8, 9, 14, 18, 19, 20, 21],
|
|
704
698
|
title: 'inProgress',
|
|
705
699
|
},
|
|
706
700
|
{
|
|
707
|
-
key:
|
|
701
|
+
key: 2,
|
|
708
702
|
text: t('COMPLETED', 'Completed'),
|
|
709
703
|
tags: props?.orderGroupStatusCustom?.completed ?? [1, 11, 15],
|
|
710
704
|
title: 'completed',
|
|
711
705
|
},
|
|
712
706
|
{
|
|
713
|
-
key:
|
|
707
|
+
key: 3,
|
|
714
708
|
text: t('CANCELLED', 'Cancelled'),
|
|
715
709
|
tags: props?.orderGroupStatusCustom?.cancelled ?? [2, 5, 6, 10, 12, 16, 17],
|
|
716
710
|
title: 'cancelled',
|