ordering-ui-admin-external 1.43.98 → 1.44.100

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.
Files changed (17) hide show
  1. package/_bundles/{ordering-ui-admin.332418468be0f49b4414.js → ordering-ui-admin.c0e9ca479ed5caf68614.js} +2 -2
  2. package/_modules/components/Orders/DeliveriesLocation/index.js +22 -37
  3. package/_modules/components/Orders/DeliveriesManager/index.js +3 -1
  4. package/_modules/components/Orders/DeliveryDashboard/index.js +4 -5
  5. package/_modules/components/Orders/OrdersExportCSV/index.js +13 -5
  6. package/_modules/components/Orders/OrdersListing/index.js +43 -20
  7. package/_modules/components/Orders/OrdersTable/Order.js +1 -1
  8. package/_modules/components/Orders/OrdersTable/index.js +56 -32
  9. package/package.json +2 -2
  10. package/src/components/Orders/DeliveriesLocation/index.js +5 -10
  11. package/src/components/Orders/DeliveriesManager/index.js +2 -0
  12. package/src/components/Orders/DeliveryDashboard/index.js +4 -5
  13. package/src/components/Orders/OrdersExportCSV/index.js +10 -4
  14. package/src/components/Orders/OrdersListing/index.js +132 -106
  15. package/src/components/Orders/OrdersTable/Order.js +2 -2
  16. package/src/components/Orders/OrdersTable/index.js +238 -209
  17. /package/_bundles/{ordering-ui-admin.332418468be0f49b4414.js.LICENSE.txt → ordering-ui-admin.c0e9ca479ed5caf68614.js.LICENSE.txt} +0 -0
package/src/components/Orders/OrdersTable/index.js CHANGED
@@ -68,6 +68,7 @@ export const OrdersTable = memo((props) => {
68
68
  const [{ dictionary }, t] = useLanguage()
69
69
  const theme = useTheme()
70
70
  const [{ parseDate }] = useUtils()
71
+ const [configState] = useConfig()
71
72
  const [isAllChecked, setIsAllChecked] = useState(false)
72
73
  const [dragOverd, setDragOverd] = useState('')
73
74
 
@@ -84,9 +85,9 @@ export const OrdersTable = memo((props) => {
84
85
  }
85
86
  }, [pagination.from, pagination.pageSize, getPageOrders])
86
87
 
87
- const [configState] = useConfig()
88
88
  const isEnabledRowInColor = configState?.configs?.row_in_color_enabled?.value === '1'
89
89
  const showExternalId = configState?.configs?.change_order_id?.value === '1'
90
+ const isProjectEnterpricePlan = configState?.configs?.plan_enterprise && configState?.configs?.plan_enterprise?.value
90
91
 
91
92
  const franchiseImages = !franchisesList?.error && franchisesList?.franchises?.reduce((imageKeys, franchise) => {
92
93
  imageKeys[franchise.id] = franchise.logo
@@ -96,67 +97,88 @@ export const OrdersTable = memo((props) => {
96
97
  const optionsDefault = [
97
98
  {
98
99
  value: 'status',
99
- content: t('STATUS', 'Status')
100
+ content: t('STATUS', 'Status'),
101
+ enabled: true
100
102
  },
101
103
  {
102
104
  value: 'orderNumber',
103
- content: t('INVOICE_ORDER_NO', 'Order No.')
105
+ content: t('INVOICE_ORDER_NO', 'Order No.'),
106
+ enabled: !showExternalId
107
+ },
108
+ {
109
+ value: 'dateTime',
110
+ content: t('DATE_TIME', 'Date and time'),
111
+ enabled: true
104
112
  },
105
113
  {
106
114
  value: 'agent',
107
- content: t('AGENT', 'Agent')
115
+ content: t('AGENT', 'Agent'),
116
+ enabled: true
108
117
  },
109
118
  {
110
119
  value: 'cartGroupId',
111
- content: t('GROUP_ORDER', 'Group Order')
120
+ content: t('GROUP_ORDER', 'Group Order'),
121
+ enabled: true
112
122
  },
113
123
  {
114
124
  value: 'driverGroupId',
115
- content: t('EXPORT_DRIVER_GROUP_ID', 'Driver Group Id')
116
- },
117
- {
118
- value: 'dateTime',
119
- content: t('DATE_TIME', 'Date and time')
125
+ content: t('EXPORT_DRIVER_GROUP_ID', 'Driver Group Id'),
126
+ enabled: true
120
127
  },
121
128
  {
122
129
  value: 'business',
123
- content: t('BUSINESS', 'Business')
130
+ content: t('BUSINESS', 'Business'),
131
+ enabled: true
124
132
  },
125
133
  {
126
134
  value: 'customer',
127
- content: t('CUSTOMER', 'Customer')
135
+ content: t('CUSTOMER', 'Customer'),
136
+ enabled: true
128
137
  },
129
138
  {
130
139
  value: 'driver',
131
- content: t('DRIVER', 'Driver')
140
+ content: t('DRIVER', 'Driver'),
141
+ enabled: true
132
142
  },
133
143
  {
134
144
  value: 'advanced',
135
- content: t('ADVANCED_LOGISTICS', 'Advance Logistics')
145
+ content: t('ADVANCED_LOGISTICS', 'Advance Logistics'),
146
+ enabled: true
147
+ },
148
+ {
149
+ value: 'cloned',
150
+ content: t('CLONED', 'Cloned'),
151
+ enabled: true
136
152
  },
137
153
  {
138
154
  value: 'timer',
139
- content: t('SLA_TIMER', 'SLA’s timer')
155
+ content: t('SLA_TIMER', 'SLA’s timer'),
156
+ enabled: isProjectEnterpricePlan
140
157
  },
141
158
  {
142
159
  value: 'eta',
143
- content: t('ETA', 'ETA')
160
+ content: t('ETA', 'ETA'),
161
+ enabled: true
144
162
  },
145
163
  {
146
164
  value: 'total',
147
- content: t('EXPORT_TOTAL', 'Total')
165
+ content: t('EXPORT_TOTAL', 'Total'),
166
+ enabled: true
148
167
  },
149
168
  {
150
169
  value: 'externalId',
151
- content: t('EXTERNAL_ID', 'External id')
170
+ content: t('EXTERNAL_ID', 'External id'),
171
+ enabled: true
152
172
  },
153
173
  {
154
174
  value: 'channel',
155
- content: t('CHANNEL', 'Channel')
175
+ content: t('CHANNEL', 'Channel'),
176
+ enabled: true
156
177
  },
157
178
  {
158
179
  value: 'pod',
159
- content: t('PODS', 'Pod')
180
+ content: t('PODS', 'Pod'),
181
+ enabled: true
160
182
  }
161
183
  ]
162
184
 
@@ -384,19 +406,20 @@ export const OrdersTable = memo((props) => {
384
406
  <th className='orderPrice'>
385
407
  <ColumnAllowSettingPopover
386
408
  allowColumns={allowColumns}
387
- optionsDefault={optionsDefault}
409
+ optionsDefault={optionsDefault.filter(({ enabled }) => enabled)}
388
410
  handleChangeAllowColumns={handleChangeAllowColumns}
389
411
  isOrder
390
412
  />
391
413
  </th>
392
- ) : (
414
+ )
415
+ : (
393
416
  Object.keys(allowColumns).filter(col => allowColumns[col]?.visable && allowColumns[col]?.order !== 0)
394
417
  .sort((col1, col2) => allowColumns[col1]?.order - allowColumns[col2]?.order)
395
418
  .map((column, i, array) => {
396
419
  if (column === 'slaBar') {
397
420
  return
398
421
  }
399
- if (column === 'orderNumber') {
422
+ if (showExternalId ? column === 'dateTime' : column === 'orderNumber') {
400
423
  return (
401
424
  <React.Fragment key={i}>
402
425
  <th
@@ -409,11 +432,13 @@ export const OrdersTable = memo((props) => {
409
432
  onClick={() => handleSelecteAllOrder()}
410
433
  className='orderCheckBox'
411
434
  >
412
- {(!orderList.loading && isAllChecked) ? (
413
- <RiCheckboxFill />
414
- ) : (
415
- <RiCheckboxBlankLine />
416
- )}
435
+ {(!orderList.loading && isAllChecked)
436
+ ? (
437
+ <RiCheckboxFill />
438
+ )
439
+ : (
440
+ <RiCheckboxBlankLine />
441
+ )}
417
442
  </CheckBox>
418
443
  {showExternalId ? t('DATE', 'Date') : t('ORDER', 'Order')}
419
444
  </th>
@@ -421,7 +446,7 @@ export const OrdersTable = memo((props) => {
421
446
  <th className='orderPrice' key={`noDragTh-${i}`}>
422
447
  <ColumnAllowSettingPopover
423
448
  allowColumns={allowColumns}
424
- optionsDefault={optionsDefault}
449
+ optionsDefault={optionsDefault.filter(({ enabled }) => enabled)}
425
450
  handleChangeAllowColumns={handleChangeAllowColumns}
426
451
  isOrder
427
452
  />
@@ -499,198 +524,200 @@ export const OrdersTable = memo((props) => {
499
524
  </tr>
500
525
  </thead>
501
526
  )}
502
- {(orderList.loading || !allowColumns) ? (
503
- [...Array(10).keys()].map(i => (
504
- <OrderTbody key={i}>
505
- <tr>
506
- {allowColumns?.slaBar?.visable && (
507
- <td>
508
- <Timestatus />
509
- </td>
510
- )}
511
- <td
512
- className={!(allowColumns?.orderNumber?.visable || allowColumns?.dateTime?.visable) ? 'orderNo small' : 'orderNo'}
513
- >
514
- <OrderNumberContainer>
515
- <CheckBox>
516
- <Skeleton width={25} height={25} style={{ margin: '10px' }} />
517
- </CheckBox>
518
- <div className='info'>
519
- {allowColumns?.orderNumber?.visable && (
520
- <p><Skeleton width={100} /></p>
521
- )}
522
- {allowColumns?.dateTime?.visable && (
523
- <Skeleton width={120} />
524
- )}
525
- </div>
526
- </OrderNumberContainer>
527
- </td>
528
- {allowColumns?.externalId?.visable && (
529
- <td className='externalId'>
530
- <StatusInfo>
527
+ {(orderList.loading || !allowColumns)
528
+ ? (
529
+ [...Array(10).keys()].map(i => (
530
+ <OrderTbody key={i}>
531
+ <tr>
532
+ {allowColumns?.slaBar?.visable && (
533
+ <td>
534
+ <Timestatus />
535
+ </td>
536
+ )}
537
+ <td
538
+ className={!(allowColumns?.orderNumber?.visable || allowColumns?.dateTime?.visable) ? 'orderNo small' : 'orderNo'}
539
+ >
540
+ <OrderNumberContainer>
541
+ <CheckBox>
542
+ <Skeleton width={25} height={25} style={{ margin: '10px' }} />
543
+ </CheckBox>
531
544
  <div className='info'>
532
- <p className='bold'><Skeleton width={100} /></p>
545
+ {allowColumns?.orderNumber?.visable && (
546
+ <p><Skeleton width={100} /></p>
547
+ )}
548
+ {allowColumns?.dateTime?.visable && (
549
+ <Skeleton width={120} />
550
+ )}
533
551
  </div>
534
- </StatusInfo>
552
+ </OrderNumberContainer>
535
553
  </td>
536
- )}
537
- {allowColumns?.cartGroupId?.visable && (
538
- <td className='statusInfo'>
539
- <StatusInfo>
554
+ {allowColumns?.externalId?.visable && (
555
+ <td className='externalId'>
556
+ <StatusInfo>
557
+ <div className='info'>
558
+ <p className='bold'><Skeleton width={100} /></p>
559
+ </div>
560
+ </StatusInfo>
561
+ </td>
562
+ )}
563
+ {allowColumns?.cartGroupId?.visable && (
564
+ <td className='statusInfo'>
565
+ <StatusInfo>
566
+ <div className='info'>
567
+ <p className='bold'><Skeleton width={100} /></p>
568
+ </div>
569
+ </StatusInfo>
570
+ </td>
571
+ )}
572
+ {allowColumns?.driverGroupId?.visable && (
573
+ <td className='statusInfo'>
574
+ <StatusInfo>
575
+ <div className='info'>
576
+ <p className='bold'><Skeleton width={100} /></p>
577
+ </div>
578
+ </StatusInfo>
579
+ </td>
580
+ )}
581
+ {allowColumns?.status?.visable && !isSelectedOrders && (
582
+ <td className='statusInfo'>
583
+ <StatusInfo>
584
+ <div className='info'>
585
+ <p className='bold'><Skeleton width={100} /></p>
586
+ </div>
587
+ </StatusInfo>
588
+ </td>
589
+ )}
590
+ {allowColumns?.business?.visable && (
591
+ <td className='businessInfo'>
592
+ <BusinessInfo>
593
+ {!hidePhoto && (
594
+ <Skeleton width={45} height={45} />
595
+ )}
596
+ <div className='info'>
597
+ <p className='bold'><Skeleton width={80} /></p>
598
+ <p><Skeleton width={100} /></p>
599
+ </div>
600
+ </BusinessInfo>
601
+ </td>
602
+ )}
603
+ {allowColumns?.customer?.visable && (
604
+ <td className='customerInfo'>
605
+ <CustomerInfo>
606
+ {!hidePhoto && (
607
+ <Skeleton width={45} height={45} />
608
+ )}
609
+ <div className='info'>
610
+ <p className='bold'><Skeleton width={100} /></p>
611
+ <p><Skeleton width={100} /></p>
612
+ </div>
613
+ </CustomerInfo>
614
+ </td>
615
+ )}
616
+ {allowColumns?.driver?.visable && !isSelectedOrders && (
617
+ <td className='driverInfo'>
618
+ <DriversInfo className='d-flex align-items-center'>
619
+ {!hidePhoto && (
620
+ <Skeleton width={45} height={45} />
621
+ )}
622
+ <Skeleton width={100} style={{ margin: '10px' }} />
623
+ </DriversInfo>
624
+ </td>
625
+ )}
626
+ {allowColumns?.deliveryType?.visable && !isSelectedOrders && (
627
+ <td className='orderType'>
628
+ <OrderType>
629
+ <Skeleton width={35} height={35} />
630
+ </OrderType>
631
+ </td>
632
+ )}
633
+ {allowColumns?.status?.visable && !isSelectedOrders && (
634
+ <td className='orderStatusTitle'>
635
+ <WrapOrderStatusSelector>
636
+ <Skeleton width={100} height={30} />
637
+ </WrapOrderStatusSelector>
638
+ </td>
639
+ )}
640
+ {allowColumns?.advanced?.visable && !isSelectedOrders && (
641
+ <td className='logistic'>
540
642
  <div className='info'>
541
- <p className='bold'><Skeleton width={100} /></p>
643
+ <p className='bold'><Skeleton width={60} /></p>
644
+ <p><Skeleton width={60} /></p>
542
645
  </div>
543
- </StatusInfo>
544
- </td>
545
- )}
546
- {allowColumns?.driverGroupId?.visable && (
547
- <td className='statusInfo'>
548
- <StatusInfo>
646
+ </td>
647
+ )}
648
+ {allowColumns?.advanced?.visable && !isSelectedOrders && (
649
+ <td className='attempts'>
549
650
  <div className='info'>
550
- <p className='bold'><Skeleton width={100} /></p>
651
+ <p className='bold'><Skeleton width={60} /></p>
652
+ <p><Skeleton width={60} /></p>
551
653
  </div>
552
- </StatusInfo>
553
- </td>
554
- )}
555
- {allowColumns?.status?.visable && !isSelectedOrders && (
556
- <td className='statusInfo'>
557
- <StatusInfo>
654
+ </td>
655
+ )}
656
+ {allowColumns?.advanced?.visable && !isSelectedOrders && (
657
+ <td className='priority'>
558
658
  <div className='info'>
559
- <p className='bold'><Skeleton width={100} /></p>
659
+ <Skeleton width={45} />
560
660
  </div>
561
- </StatusInfo>
562
- </td>
563
- )}
564
- {allowColumns?.business?.visable && (
565
- <td className='businessInfo'>
566
- <BusinessInfo>
567
- {!hidePhoto && (
568
- <Skeleton width={45} height={45} />
569
- )}
570
- <div className='info'>
571
- <p className='bold'><Skeleton width={80} /></p>
572
- <p><Skeleton width={100} /></p>
573
- </div>
574
- </BusinessInfo>
575
- </td>
576
- )}
577
- {allowColumns?.customer?.visable && (
578
- <td className='customerInfo'>
579
- <CustomerInfo>
580
- {!hidePhoto && (
581
- <Skeleton width={45} height={45} />
582
- )}
661
+ </td>
662
+ )}
663
+
664
+ {allowColumns?.channel?.visable && !isSelectedOrders && (
665
+ <td className='orderStatusTitle'>
666
+ <WrapOrderStatusSelector>
667
+ <Skeleton width={100} height={30} />
668
+ </WrapOrderStatusSelector>
669
+ </td>
670
+ )}
671
+ {allowColumns?.pod?.visable && !isSelectedOrders && (
672
+ <td className='orderStatusTitle'>
673
+ <WrapOrderStatusSelector>
674
+ <Skeleton width={100} height={30} />
675
+ </WrapOrderStatusSelector>
676
+ </td>
677
+ )}
678
+ {!isSelectedOrders && (
679
+ <td className='orderPrice'>
583
680
  <div className='info'>
584
- <p className='bold'><Skeleton width={100} /></p>
585
- <p><Skeleton width={100} /></p>
681
+ {allowColumns?.total?.visable && (
682
+ <p className='bold'><Skeleton width={60} /></p>
683
+ )}
684
+ <p>
685
+ <Skeleton width={100} />
686
+ </p>
586
687
  </div>
587
- </CustomerInfo>
588
- </td>
589
- )}
590
- {allowColumns?.driver?.visable && !isSelectedOrders && (
591
- <td className='driverInfo'>
592
- <DriversInfo className='d-flex align-items-center'>
593
- {!hidePhoto && (
594
- <Skeleton width={45} height={45} />
595
- )}
596
- <Skeleton width={100} style={{ margin: '10px' }} />
597
- </DriversInfo>
598
- </td>
599
- )}
600
- {allowColumns?.deliveryType?.visable && !isSelectedOrders && (
601
- <td className='orderType'>
602
- <OrderType>
603
- <Skeleton width={35} height={35} />
604
- </OrderType>
605
- </td>
606
- )}
607
- {allowColumns?.status?.visable && !isSelectedOrders && (
608
- <td className='orderStatusTitle'>
609
- <WrapOrderStatusSelector>
610
- <Skeleton width={100} height={30} />
611
- </WrapOrderStatusSelector>
612
- </td>
613
- )}
614
- {allowColumns?.advanced?.visable && !isSelectedOrders && (
615
- <td className='logistic'>
616
- <div className='info'>
617
- <p className='bold'><Skeleton width={60} /></p>
618
- <p><Skeleton width={60} /></p>
619
- </div>
620
- </td>
621
- )}
622
- {allowColumns?.advanced?.visable && !isSelectedOrders && (
623
- <td className='attempts'>
624
- <div className='info'>
625
- <p className='bold'><Skeleton width={60} /></p>
626
- <p><Skeleton width={60} /></p>
627
- </div>
628
- </td>
629
- )}
630
- {allowColumns?.advanced?.visable && !isSelectedOrders && (
631
- <td className='priority'>
632
- <div className='info'>
633
- <p className='bold'><Skeleton width={60} /></p>
634
- <p><Skeleton width={60} /></p>
635
- </div>
636
- </td>
637
- )}
638
- {allowColumns?.channel?.visable && !isSelectedOrders && (
639
- <td className='orderStatusTitle'>
640
- <WrapOrderStatusSelector>
641
- <Skeleton width={100} height={30} />
642
- </WrapOrderStatusSelector>
643
- </td>
644
- )}
645
- {allowColumns?.pod?.visable && !isSelectedOrders && (
646
- <td className='orderStatusTitle'>
647
- <WrapOrderStatusSelector>
648
- <Skeleton width={100} height={30} />
649
- </WrapOrderStatusSelector>
650
- </td>
651
- )}
652
- {!isSelectedOrders && (
653
- <td className='orderPrice'>
654
- <div className='info'>
655
- {allowColumns?.total?.visable && (
656
- <p className='bold'><Skeleton width={60} /></p>
657
- )}
658
- <p>
659
- <Skeleton width={100} />
660
- </p>
661
- </div>
662
- </td>
663
- )}
664
- </tr>
688
+ </td>
689
+ )}
690
+ </tr>
691
+ </OrderTbody>
692
+ ))
693
+ )
694
+ : (
695
+ <OrderTbody>
696
+ {orderList.orders.map((order, i) => (
697
+ <Order
698
+ key={order?.id}
699
+ i={i}
700
+ order={order}
701
+ orderDetailId={orderDetailId}
702
+ isEnabledRowInColor={isEnabledRowInColor}
703
+ handleClickOrder={handleClickOrder}
704
+ allowColumns={allowColumns}
705
+ isSelectedOrders={isSelectedOrders}
706
+ selectedOrderIds={selectedOrderIds}
707
+ handleSelectedOrderIds={handleSelectedOrderIds}
708
+ showExternalId={showExternalId}
709
+ getOrderStatus={getOrderStatus}
710
+ hidePhoto={hidePhoto}
711
+ getLogisticTag={getLogisticTag}
712
+ getPriorityTag={getPriorityTag}
713
+ groupStatus={groupStatus}
714
+ displayDelayedTime={displayDelayedTime}
715
+ getCurrenySymbol={getCurrenySymbol}
716
+ franchiseImages={franchiseImages}
717
+ />
718
+ ))}
665
719
  </OrderTbody>
666
- ))
667
- ) : (
668
- <OrderTbody>
669
- {orderList.orders.map((order, i) => (
670
- <Order
671
- key={order?.id}
672
- i={i}
673
- order={order}
674
- orderDetailId={orderDetailId}
675
- isEnabledRowInColor={isEnabledRowInColor}
676
- handleClickOrder={handleClickOrder}
677
- allowColumns={allowColumns}
678
- isSelectedOrders={isSelectedOrders}
679
- selectedOrderIds={selectedOrderIds}
680
- handleSelectedOrderIds={handleSelectedOrderIds}
681
- showExternalId={showExternalId}
682
- getOrderStatus={getOrderStatus}
683
- hidePhoto={hidePhoto}
684
- getLogisticTag={getLogisticTag}
685
- getPriorityTag={getPriorityTag}
686
- groupStatus={groupStatus}
687
- displayDelayedTime={displayDelayedTime}
688
- getCurrenySymbol={getCurrenySymbol}
689
- franchiseImages={franchiseImages}
690
- />
691
- ))}
692
- </OrderTbody>
693
- )}
720
+ )}
694
721
  </Table>
695
722
  </OrdersContainer>
696
723
 
@@ -708,3 +735,5 @@ export const OrdersTable = memo((props) => {
708
735
  </>
709
736
  )
710
737
  }, OrderTablePropsAreEqual)
738
+
739
+ OrdersTable.displayName = 'OrdersTable'