@asdp/ferryui 0.1.22-dev.9582 → 0.1.22-dev.9610
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/dist/index.d.mts +23 -8
- package/dist/index.d.ts +23 -8
- package/dist/index.js +291 -205
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +291 -205
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -460,7 +460,8 @@ var MANIFEST_ENTITY = {
|
|
|
460
460
|
};
|
|
461
461
|
var HARDCODED_ID = {
|
|
462
462
|
FAQ_ID_PEMESANAN_TIKET: 1,
|
|
463
|
-
COMPANY_ID_LAINNYA: "999999"
|
|
463
|
+
COMPANY_ID_LAINNYA: "999999",
|
|
464
|
+
LOAD_TYPE_ID_LAINNYA: 87
|
|
464
465
|
};
|
|
465
466
|
var useStyles2 = makeStyles({
|
|
466
467
|
carousel: {},
|
|
@@ -8917,10 +8918,11 @@ var DEFAULT_LABELS17 = {
|
|
|
8917
8918
|
return `Mulai dari IDR ${formatPrice(min)} - ${formatPrice(max)}`;
|
|
8918
8919
|
},
|
|
8919
8920
|
durationLabel: "Durasi perjalanan",
|
|
8920
|
-
durationRangeText: (min, max) => `Perjalanan ${min} - ${max}
|
|
8921
|
+
durationRangeText: (min, max) => `Perjalanan ${min} - ${max} menit`,
|
|
8921
8922
|
resetButton: "Reset",
|
|
8922
8923
|
applyButton: "Terapkan",
|
|
8923
8924
|
hourUnit: "jam",
|
|
8925
|
+
minuteUnit: "menit",
|
|
8924
8926
|
currencySymbol: "IDR",
|
|
8925
8927
|
closeAriaLabel: "Tutup"
|
|
8926
8928
|
},
|
|
@@ -8935,10 +8937,11 @@ var DEFAULT_LABELS17 = {
|
|
|
8935
8937
|
return `From IDR ${formatPrice(min)} - ${formatPrice(max)}`;
|
|
8936
8938
|
},
|
|
8937
8939
|
durationLabel: "Travel duration",
|
|
8938
|
-
durationRangeText: (min, max) => `${min} - ${max}
|
|
8940
|
+
durationRangeText: (min, max) => `${min} - ${max} minutes trip`,
|
|
8939
8941
|
resetButton: "Reset",
|
|
8940
8942
|
applyButton: "Apply",
|
|
8941
8943
|
hourUnit: "hours",
|
|
8944
|
+
minuteUnit: "minutes",
|
|
8942
8945
|
currencySymbol: "IDR",
|
|
8943
8946
|
closeAriaLabel: "Close"
|
|
8944
8947
|
}
|
|
@@ -8959,16 +8962,16 @@ var DEFAULT_TIME_SLOTS = [
|
|
|
8959
8962
|
{ value: "18:00 - 24:00", label: "18:00 - 24:00" }
|
|
8960
8963
|
];
|
|
8961
8964
|
var DEFAULT_PRICE_RANGE = {
|
|
8962
|
-
min:
|
|
8963
|
-
max:
|
|
8965
|
+
min: 0,
|
|
8966
|
+
max: 0
|
|
8964
8967
|
};
|
|
8965
8968
|
var DEFAULT_DURATION_RANGE = {
|
|
8966
8969
|
min: 0,
|
|
8967
|
-
max:
|
|
8970
|
+
max: 0
|
|
8968
8971
|
};
|
|
8969
8972
|
var useStyles18 = makeStyles({
|
|
8970
8973
|
dialogSurface: {
|
|
8971
|
-
maxWidth: "
|
|
8974
|
+
maxWidth: "650px",
|
|
8972
8975
|
width: "100%"
|
|
8973
8976
|
},
|
|
8974
8977
|
content: {
|
|
@@ -9050,6 +9053,16 @@ var useStyles18 = makeStyles({
|
|
|
9050
9053
|
backgroundColor: tokens.colorPaletteRedBackground1,
|
|
9051
9054
|
...shorthands.borderColor(tokens.colorPaletteRedForeground1)
|
|
9052
9055
|
}
|
|
9056
|
+
},
|
|
9057
|
+
skeletonGrid: {
|
|
9058
|
+
display: "grid",
|
|
9059
|
+
gridTemplateColumns: "repeat(2, 1fr)",
|
|
9060
|
+
gap: "0.5rem"
|
|
9061
|
+
},
|
|
9062
|
+
skeletonCheckboxRow: {
|
|
9063
|
+
display: "flex",
|
|
9064
|
+
gap: tokens.spacingHorizontalS,
|
|
9065
|
+
alignItems: "center"
|
|
9053
9066
|
}
|
|
9054
9067
|
});
|
|
9055
9068
|
var ModalFilterTicket = ({
|
|
@@ -9069,12 +9082,14 @@ var ModalFilterTicket = ({
|
|
|
9069
9082
|
onReset,
|
|
9070
9083
|
onApply,
|
|
9071
9084
|
labels,
|
|
9072
|
-
serviceTypes =
|
|
9073
|
-
timeSlots =
|
|
9074
|
-
minPrice =
|
|
9075
|
-
maxPrice =
|
|
9076
|
-
minDuration =
|
|
9077
|
-
maxDuration =
|
|
9085
|
+
serviceTypes = [],
|
|
9086
|
+
timeSlots = [],
|
|
9087
|
+
minPrice = 0,
|
|
9088
|
+
maxPrice = 0,
|
|
9089
|
+
minDuration = 0,
|
|
9090
|
+
maxDuration = 0,
|
|
9091
|
+
durationStep = 1,
|
|
9092
|
+
isLoading = false
|
|
9078
9093
|
}) => {
|
|
9079
9094
|
const styles = useStyles18();
|
|
9080
9095
|
const mergedLabels = { ...DEFAULT_LABELS17[language], ...labels };
|
|
@@ -9116,8 +9131,19 @@ var ModalFilterTicket = ({
|
|
|
9116
9131
|
price
|
|
9117
9132
|
);
|
|
9118
9133
|
};
|
|
9134
|
+
const hasPriceRange = minPrice > 0 || maxPrice > 0;
|
|
9135
|
+
const hasDurationRange = minDuration > 0 || maxDuration > 0;
|
|
9136
|
+
const safePriceValues = hasPriceRange ? [
|
|
9137
|
+
Math.min(Math.max(priceRange[0], minPrice), maxPrice),
|
|
9138
|
+
Math.min(Math.max(priceRange[1], minPrice), maxPrice)
|
|
9139
|
+
] : [minPrice, maxPrice];
|
|
9140
|
+
const safeDurationValues = hasDurationRange ? [
|
|
9141
|
+
Math.min(Math.max(durationRange[0], minDuration), maxDuration),
|
|
9142
|
+
Math.min(Math.max(durationRange[1], minDuration), maxDuration)
|
|
9143
|
+
] : [minDuration, maxDuration];
|
|
9119
9144
|
const renderPriceTrack = useCallback(
|
|
9120
9145
|
({ props, children }) => {
|
|
9146
|
+
if (!hasPriceRange) return /* @__PURE__ */ jsx("div", { ...props, ref: props.ref, children });
|
|
9121
9147
|
const [value1, value2] = priceRange;
|
|
9122
9148
|
const percent1 = (value1 - minPrice) / (maxPrice - minPrice) * 100;
|
|
9123
9149
|
const percent2 = (value2 - minPrice) / (maxPrice - minPrice) * 100;
|
|
@@ -9153,10 +9179,11 @@ var ModalFilterTicket = ({
|
|
|
9153
9179
|
}
|
|
9154
9180
|
);
|
|
9155
9181
|
},
|
|
9156
|
-
[priceRange, minPrice, maxPrice]
|
|
9182
|
+
[priceRange, minPrice, maxPrice, hasPriceRange]
|
|
9157
9183
|
);
|
|
9158
9184
|
const renderDurationTrack = useCallback(
|
|
9159
9185
|
({ props, children }) => {
|
|
9186
|
+
if (!hasDurationRange) return /* @__PURE__ */ jsx("div", { ...props, ref: props.ref, children });
|
|
9160
9187
|
const [value1, value2] = durationRange;
|
|
9161
9188
|
const percent1 = (value1 - minDuration) / (maxDuration - minDuration) * 100;
|
|
9162
9189
|
const percent2 = (value2 - minDuration) / (maxDuration - minDuration) * 100;
|
|
@@ -9192,7 +9219,7 @@ var ModalFilterTicket = ({
|
|
|
9192
9219
|
}
|
|
9193
9220
|
);
|
|
9194
9221
|
},
|
|
9195
|
-
[durationRange, minDuration, maxDuration]
|
|
9222
|
+
[durationRange, minDuration, maxDuration, hasDurationRange]
|
|
9196
9223
|
);
|
|
9197
9224
|
const renderThumb = ({ props }) => /* @__PURE__ */ jsx(
|
|
9198
9225
|
"div",
|
|
@@ -9212,6 +9239,30 @@ var ModalFilterTicket = ({
|
|
|
9212
9239
|
}
|
|
9213
9240
|
}
|
|
9214
9241
|
);
|
|
9242
|
+
const renderServiceTypesSkeleton = () => /* @__PURE__ */ jsxs("div", { className: styles.section, children: [
|
|
9243
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "120px", height: "20px" } }) }),
|
|
9244
|
+
/* @__PURE__ */ jsx("div", { className: styles.skeletonGrid, children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "100%", height: "40px", borderRadius: "8px" } }) }, `svc-skel-${i}`)) })
|
|
9245
|
+
] });
|
|
9246
|
+
const renderTimeSlotsSkeleton = () => /* @__PURE__ */ jsxs("div", { className: styles.section, children: [
|
|
9247
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "100px", height: "20px" } }) }),
|
|
9248
|
+
/* @__PURE__ */ jsx(Row, { children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ jsx(Col, { xs: 6, sm: 6, md: 6, lg: 3, xl: 3, xxl: 3, xxxl: 3, children: /* @__PURE__ */ jsxs("div", { className: styles.skeletonCheckboxRow, children: [
|
|
9249
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "16px", height: "16px", borderRadius: "4px" } }) }),
|
|
9250
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "16px" } }) })
|
|
9251
|
+
] }) }, `time-skel-${i}`)) })
|
|
9252
|
+
] });
|
|
9253
|
+
const renderRangeSkeleton = () => /* @__PURE__ */ jsxs("div", { className: styles.containerRange, children: [
|
|
9254
|
+
/* @__PURE__ */ jsxs("div", { className: styles.spaceText, children: [
|
|
9255
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "80px", height: "20px" } }) }),
|
|
9256
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "200px", height: "16px" } }) })
|
|
9257
|
+
] }),
|
|
9258
|
+
/* @__PURE__ */ jsxs("div", { className: styles.sliderContainer, children: [
|
|
9259
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "100%", height: "4px", borderRadius: "2px" } }) }),
|
|
9260
|
+
/* @__PURE__ */ jsxs("div", { className: styles.sliderValues, children: [
|
|
9261
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "14px" } }) }),
|
|
9262
|
+
/* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx(SkeletonItem, { style: { width: "60px", height: "14px" } }) })
|
|
9263
|
+
] })
|
|
9264
|
+
] })
|
|
9265
|
+
] });
|
|
9215
9266
|
return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: (_, data) => onOpenChange(data.open), children: /* @__PURE__ */ jsx(DialogSurface, { className: styles.dialogSurface, children: /* @__PURE__ */ jsxs(DialogBody, { children: [
|
|
9216
9267
|
/* @__PURE__ */ jsx(
|
|
9217
9268
|
DialogTitle,
|
|
@@ -9231,7 +9282,7 @@ var ModalFilterTicket = ({
|
|
|
9231
9282
|
),
|
|
9232
9283
|
/* @__PURE__ */ jsxs(DialogContent, { className: styles.content, children: [
|
|
9233
9284
|
/* @__PURE__ */ jsx(Divider, {}),
|
|
9234
|
-
/* @__PURE__ */ jsxs("div", { className: styles.section, children: [
|
|
9285
|
+
isLoading ? renderServiceTypesSkeleton() : /* @__PURE__ */ jsxs("div", { className: styles.section, children: [
|
|
9235
9286
|
/* @__PURE__ */ jsx(Body1, { children: mergedLabels.serviceTypeLabel }),
|
|
9236
9287
|
/* @__PURE__ */ jsx("div", { className: styles.buttonGrid, children: serviceTypes.map((service) => {
|
|
9237
9288
|
const isSelected = selectedServiceTypes.includes(
|
|
@@ -9252,7 +9303,7 @@ var ModalFilterTicket = ({
|
|
|
9252
9303
|
}) })
|
|
9253
9304
|
] }),
|
|
9254
9305
|
/* @__PURE__ */ jsx(Divider, {}),
|
|
9255
|
-
/* @__PURE__ */ jsxs("div", { className: styles.section, children: [
|
|
9306
|
+
isLoading ? renderTimeSlotsSkeleton() : /* @__PURE__ */ jsxs("div", { className: styles.section, children: [
|
|
9256
9307
|
/* @__PURE__ */ jsx(Body1, { children: mergedLabels.departureTimeLabel }),
|
|
9257
9308
|
/* @__PURE__ */ jsx(Row, { children: timeSlots.map((slot) => /* @__PURE__ */ jsx(
|
|
9258
9309
|
Col,
|
|
@@ -9280,7 +9331,7 @@ var ModalFilterTicket = ({
|
|
|
9280
9331
|
)) })
|
|
9281
9332
|
] }),
|
|
9282
9333
|
/* @__PURE__ */ jsx(Divider, {}),
|
|
9283
|
-
/* @__PURE__ */ jsxs("div", { className: styles.section, children: [
|
|
9334
|
+
isLoading ? renderTimeSlotsSkeleton() : /* @__PURE__ */ jsxs("div", { className: styles.section, children: [
|
|
9284
9335
|
/* @__PURE__ */ jsx(Body1, { children: mergedLabels.arrivalTimeLabel }),
|
|
9285
9336
|
/* @__PURE__ */ jsx(Row, { children: timeSlots.map((slot) => /* @__PURE__ */ jsx(
|
|
9286
9337
|
Col,
|
|
@@ -9308,18 +9359,18 @@ var ModalFilterTicket = ({
|
|
|
9308
9359
|
)) })
|
|
9309
9360
|
] }),
|
|
9310
9361
|
/* @__PURE__ */ jsx(Divider, {}),
|
|
9311
|
-
/* @__PURE__ */ jsxs("div", { className: styles.containerRange, children: [
|
|
9362
|
+
isLoading ? renderRangeSkeleton() : /* @__PURE__ */ jsxs("div", { className: styles.containerRange, children: [
|
|
9312
9363
|
/* @__PURE__ */ jsxs("div", { className: styles.spaceText, children: [
|
|
9313
9364
|
/* @__PURE__ */ jsx(Subtitle2, { children: mergedLabels.priceLabel }),
|
|
9314
9365
|
/* @__PURE__ */ jsx(Body1, { children: mergedLabels.priceRangeText(priceRange[0], priceRange[1]) })
|
|
9315
9366
|
] }),
|
|
9316
9367
|
/* @__PURE__ */ jsxs("div", { className: styles.sliderContainer, children: [
|
|
9317
|
-
rangeReady && /* @__PURE__ */ jsx(
|
|
9368
|
+
rangeReady && hasPriceRange && /* @__PURE__ */ jsx(
|
|
9318
9369
|
Range,
|
|
9319
9370
|
{
|
|
9320
9371
|
min: minPrice,
|
|
9321
9372
|
max: maxPrice,
|
|
9322
|
-
values:
|
|
9373
|
+
values: safePriceValues,
|
|
9323
9374
|
onChange: (values) => onPriceRangeChange(values),
|
|
9324
9375
|
renderTrack: renderPriceTrack,
|
|
9325
9376
|
renderThumb
|
|
@@ -9333,7 +9384,7 @@ var ModalFilterTicket = ({
|
|
|
9333
9384
|
] })
|
|
9334
9385
|
] }),
|
|
9335
9386
|
/* @__PURE__ */ jsx(Divider, {}),
|
|
9336
|
-
/* @__PURE__ */ jsxs("div", { className: styles.containerRange, children: [
|
|
9387
|
+
isLoading ? renderRangeSkeleton() : /* @__PURE__ */ jsxs("div", { className: styles.containerRange, children: [
|
|
9337
9388
|
/* @__PURE__ */ jsxs("div", { className: styles.spaceText, children: [
|
|
9338
9389
|
/* @__PURE__ */ jsx(Subtitle2, { children: mergedLabels.durationLabel }),
|
|
9339
9390
|
/* @__PURE__ */ jsx(Body1, { children: mergedLabels.durationRangeText(
|
|
@@ -9342,13 +9393,13 @@ var ModalFilterTicket = ({
|
|
|
9342
9393
|
) })
|
|
9343
9394
|
] }),
|
|
9344
9395
|
/* @__PURE__ */ jsxs("div", { className: styles.sliderContainer, children: [
|
|
9345
|
-
rangeReady && /* @__PURE__ */ jsx(
|
|
9396
|
+
rangeReady && hasDurationRange && /* @__PURE__ */ jsx(
|
|
9346
9397
|
Range,
|
|
9347
9398
|
{
|
|
9348
|
-
step:
|
|
9399
|
+
step: durationStep,
|
|
9349
9400
|
min: minDuration,
|
|
9350
9401
|
max: maxDuration,
|
|
9351
|
-
values:
|
|
9402
|
+
values: safeDurationValues,
|
|
9352
9403
|
onChange: (values) => onDurationRangeChange(values),
|
|
9353
9404
|
renderTrack: renderDurationTrack,
|
|
9354
9405
|
renderThumb
|
|
@@ -9359,12 +9410,12 @@ var ModalFilterTicket = ({
|
|
|
9359
9410
|
/* @__PURE__ */ jsxs("span", { children: [
|
|
9360
9411
|
minDuration,
|
|
9361
9412
|
" ",
|
|
9362
|
-
mergedLabels.
|
|
9413
|
+
mergedLabels.minuteUnit
|
|
9363
9414
|
] }),
|
|
9364
9415
|
/* @__PURE__ */ jsxs("span", { children: [
|
|
9365
9416
|
maxDuration,
|
|
9366
9417
|
" ",
|
|
9367
|
-
mergedLabels.
|
|
9418
|
+
mergedLabels.minuteUnit
|
|
9368
9419
|
] })
|
|
9369
9420
|
] })
|
|
9370
9421
|
] })
|
|
@@ -11864,7 +11915,7 @@ var CardPassengerList = ({
|
|
|
11864
11915
|
/* @__PURE__ */ jsx(
|
|
11865
11916
|
Icon,
|
|
11866
11917
|
{
|
|
11867
|
-
icon: "fluent:chevron-right-24-regular",
|
|
11918
|
+
icon: passenger.name && passenger.serviceName ? "fluent:edit-24-regular" : "fluent:chevron-right-24-regular",
|
|
11868
11919
|
width: 20,
|
|
11869
11920
|
height: 20
|
|
11870
11921
|
}
|
|
@@ -12767,7 +12818,9 @@ var CardVehicleOwnerForm = ({
|
|
|
12767
12818
|
InputDynamic_default,
|
|
12768
12819
|
{
|
|
12769
12820
|
control,
|
|
12770
|
-
disabled
|
|
12821
|
+
disabled: disabled || (getValues(
|
|
12822
|
+
`owners.${index}.cargo.${cargoIndex}.commodity`
|
|
12823
|
+
) || "") === "",
|
|
12771
12824
|
name: `owners.${index}.cargo.${cargoIndex}.cargoType`,
|
|
12772
12825
|
onChange: (val) => {
|
|
12773
12826
|
const name = `owners.${index}.cargo.${cargoIndex}.cargoType`;
|
|
@@ -12808,57 +12861,158 @@ var CardVehicleOwnerForm = ({
|
|
|
12808
12861
|
(loadType) => loadType.id === type
|
|
12809
12862
|
);
|
|
12810
12863
|
if (!selectedLoadType) {
|
|
12811
|
-
return /* @__PURE__ */
|
|
12864
|
+
return /* @__PURE__ */ jsxs(Col, { md: 3, children: [
|
|
12865
|
+
/* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.priceLabel }),
|
|
12866
|
+
/* @__PURE__ */ jsx(
|
|
12867
|
+
Body2,
|
|
12868
|
+
{
|
|
12869
|
+
style: { marginTop: "0.5rem" },
|
|
12870
|
+
children: (() => {
|
|
12871
|
+
return new Intl.NumberFormat(
|
|
12872
|
+
"id-ID",
|
|
12873
|
+
{
|
|
12874
|
+
style: "currency",
|
|
12875
|
+
currency: "IDR",
|
|
12876
|
+
minimumFractionDigits: 0
|
|
12877
|
+
}
|
|
12878
|
+
).format(0);
|
|
12879
|
+
})()
|
|
12880
|
+
}
|
|
12881
|
+
)
|
|
12882
|
+
] });
|
|
12812
12883
|
}
|
|
12813
|
-
return /* @__PURE__ */ jsxs(
|
|
12814
|
-
/* @__PURE__ */
|
|
12815
|
-
|
|
12816
|
-
|
|
12817
|
-
|
|
12818
|
-
|
|
12819
|
-
|
|
12820
|
-
|
|
12821
|
-
|
|
12822
|
-
|
|
12823
|
-
|
|
12824
|
-
|
|
12825
|
-
|
|
12826
|
-
|
|
12827
|
-
|
|
12828
|
-
|
|
12829
|
-
|
|
12830
|
-
|
|
12831
|
-
|
|
12832
|
-
|
|
12833
|
-
|
|
12834
|
-
|
|
12835
|
-
|
|
12836
|
-
|
|
12837
|
-
|
|
12838
|
-
|
|
12839
|
-
|
|
12840
|
-
|
|
12841
|
-
|
|
12842
|
-
|
|
12843
|
-
|
|
12844
|
-
|
|
12845
|
-
|
|
12846
|
-
|
|
12847
|
-
|
|
12848
|
-
|
|
12849
|
-
|
|
12884
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
12885
|
+
/* @__PURE__ */ jsxs(Col, { md: 3, children: [
|
|
12886
|
+
/* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.cargoQuantityLabel }),
|
|
12887
|
+
/* @__PURE__ */ jsxs(
|
|
12888
|
+
"div",
|
|
12889
|
+
{
|
|
12890
|
+
style: {
|
|
12891
|
+
display: "flex",
|
|
12892
|
+
alignItems: "center",
|
|
12893
|
+
border: `1px solid ${tokens.colorNeutralStroke1}`,
|
|
12894
|
+
borderRadius: tokens.borderRadiusMedium,
|
|
12895
|
+
height: "40px",
|
|
12896
|
+
padding: "0 12px",
|
|
12897
|
+
backgroundColor: tokens.colorNeutralBackground1
|
|
12898
|
+
},
|
|
12899
|
+
children: [
|
|
12900
|
+
/* @__PURE__ */ jsx("div", { style: { flex: 0.5 } }),
|
|
12901
|
+
/* @__PURE__ */ jsxs(
|
|
12902
|
+
"div",
|
|
12903
|
+
{
|
|
12904
|
+
style: {
|
|
12905
|
+
display: "flex",
|
|
12906
|
+
alignItems: "center",
|
|
12907
|
+
gap: "12px"
|
|
12908
|
+
},
|
|
12909
|
+
children: [
|
|
12910
|
+
/* @__PURE__ */ jsx(
|
|
12911
|
+
Button,
|
|
12912
|
+
{
|
|
12913
|
+
appearance: "transparent",
|
|
12914
|
+
disabled,
|
|
12915
|
+
icon: /* @__PURE__ */ jsx(
|
|
12916
|
+
Icon,
|
|
12917
|
+
{
|
|
12918
|
+
icon: "fluent:subtract-circle-24-regular",
|
|
12919
|
+
style: {
|
|
12920
|
+
fontSize: "24px",
|
|
12921
|
+
color: tokens.colorNeutralForeground4
|
|
12922
|
+
}
|
|
12850
12923
|
}
|
|
12924
|
+
),
|
|
12925
|
+
"aria-label": mergedLabels.decrementQuantityAriaLabel,
|
|
12926
|
+
size: "small",
|
|
12927
|
+
onClick: () => {
|
|
12928
|
+
const currentVal = getValues(
|
|
12929
|
+
`owners.${index}.cargo.${cargoIndex}.quantity`
|
|
12930
|
+
) || 0;
|
|
12931
|
+
const currentQty = Number(currentVal);
|
|
12932
|
+
if (currentQty > 0) {
|
|
12933
|
+
const newVal = currentQty - 1;
|
|
12934
|
+
setValue(
|
|
12935
|
+
`owners.${index}.cargo.${cargoIndex}.quantity`,
|
|
12936
|
+
newVal
|
|
12937
|
+
);
|
|
12938
|
+
onUpdateCargoQuantity(
|
|
12939
|
+
owner.id,
|
|
12940
|
+
cargo.id,
|
|
12941
|
+
newVal
|
|
12942
|
+
);
|
|
12943
|
+
}
|
|
12944
|
+
},
|
|
12945
|
+
style: {
|
|
12946
|
+
minWidth: "32px",
|
|
12947
|
+
padding: "0"
|
|
12851
12948
|
}
|
|
12852
|
-
|
|
12853
|
-
|
|
12854
|
-
|
|
12855
|
-
|
|
12856
|
-
|
|
12857
|
-
|
|
12858
|
-
|
|
12859
|
-
|
|
12860
|
-
|
|
12861
|
-
|
|
12949
|
+
}
|
|
12950
|
+
),
|
|
12951
|
+
/* @__PURE__ */ jsx("div", { style: { width: "40px" }, children: /* @__PURE__ */ jsx(
|
|
12952
|
+
Controller,
|
|
12953
|
+
{
|
|
12954
|
+
name: `owners.${index}.cargo.${cargoIndex}.quantity`,
|
|
12955
|
+
control,
|
|
12956
|
+
disabled,
|
|
12957
|
+
render: ({ field }) => /* @__PURE__ */ jsx(
|
|
12958
|
+
"input",
|
|
12959
|
+
{
|
|
12960
|
+
...field,
|
|
12961
|
+
min: 1,
|
|
12962
|
+
type: "number",
|
|
12963
|
+
style: {
|
|
12964
|
+
border: "none",
|
|
12965
|
+
width: "100%",
|
|
12966
|
+
textAlign: "center",
|
|
12967
|
+
outline: "none",
|
|
12968
|
+
backgroundColor: "transparent",
|
|
12969
|
+
color: tokens.colorNeutralForeground1,
|
|
12970
|
+
fontSize: tokens.fontSizeBase400,
|
|
12971
|
+
fontFamily: tokens.fontFamilyBase
|
|
12972
|
+
},
|
|
12973
|
+
onWheel: (e) => e.target.blur(),
|
|
12974
|
+
onChange: (e) => {
|
|
12975
|
+
const newVal = Number(
|
|
12976
|
+
e.target.value
|
|
12977
|
+
);
|
|
12978
|
+
field.onChange(e);
|
|
12979
|
+
onUpdateCargoQuantity(
|
|
12980
|
+
owner.id,
|
|
12981
|
+
cargo.id,
|
|
12982
|
+
newVal
|
|
12983
|
+
);
|
|
12984
|
+
}
|
|
12985
|
+
}
|
|
12986
|
+
),
|
|
12987
|
+
rules: {
|
|
12988
|
+
required: true,
|
|
12989
|
+
min: 1
|
|
12990
|
+
}
|
|
12991
|
+
}
|
|
12992
|
+
) }),
|
|
12993
|
+
/* @__PURE__ */ jsx(
|
|
12994
|
+
Button,
|
|
12995
|
+
{
|
|
12996
|
+
appearance: "transparent",
|
|
12997
|
+
disabled,
|
|
12998
|
+
icon: /* @__PURE__ */ jsx(
|
|
12999
|
+
Icon,
|
|
13000
|
+
{
|
|
13001
|
+
icon: "fluent:add-circle-24-regular",
|
|
13002
|
+
style: {
|
|
13003
|
+
fontSize: "24px",
|
|
13004
|
+
color: tokens.colorBrandStroke1
|
|
13005
|
+
}
|
|
13006
|
+
}
|
|
13007
|
+
),
|
|
13008
|
+
"aria-label": mergedLabels.incrementQuantityAriaLabel,
|
|
13009
|
+
size: "small",
|
|
13010
|
+
onClick: () => {
|
|
13011
|
+
const currentVal = getValues(
|
|
13012
|
+
`owners.${index}.cargo.${cargoIndex}.quantity`
|
|
13013
|
+
) || 0;
|
|
13014
|
+
const currentQty = Number(currentVal);
|
|
13015
|
+
const newVal = currentQty + 1;
|
|
12862
13016
|
setValue(
|
|
12863
13017
|
`owners.${index}.cargo.${cargoIndex}.quantity`,
|
|
12864
13018
|
newVal
|
|
@@ -12868,137 +13022,69 @@ var CardVehicleOwnerForm = ({
|
|
|
12868
13022
|
cargo.id,
|
|
12869
13023
|
newVal
|
|
12870
13024
|
);
|
|
13025
|
+
},
|
|
13026
|
+
style: {
|
|
13027
|
+
minWidth: "32px",
|
|
13028
|
+
padding: "0"
|
|
12871
13029
|
}
|
|
12872
|
-
},
|
|
12873
|
-
style: {
|
|
12874
|
-
minWidth: "32px",
|
|
12875
|
-
padding: "0"
|
|
12876
13030
|
}
|
|
12877
|
-
|
|
12878
|
-
|
|
12879
|
-
|
|
12880
|
-
|
|
12881
|
-
|
|
12882
|
-
|
|
12883
|
-
|
|
12884
|
-
|
|
12885
|
-
|
|
12886
|
-
|
|
12887
|
-
|
|
12888
|
-
|
|
12889
|
-
|
|
12890
|
-
|
|
12891
|
-
|
|
12892
|
-
|
|
12893
|
-
|
|
12894
|
-
|
|
12895
|
-
|
|
12896
|
-
|
|
12897
|
-
|
|
12898
|
-
|
|
12899
|
-
|
|
12900
|
-
|
|
12901
|
-
|
|
12902
|
-
|
|
12903
|
-
|
|
12904
|
-
field.onChange(e);
|
|
12905
|
-
onUpdateCargoQuantity(
|
|
12906
|
-
owner.id,
|
|
12907
|
-
cargo.id,
|
|
12908
|
-
newVal
|
|
12909
|
-
);
|
|
12910
|
-
}
|
|
12911
|
-
}
|
|
12912
|
-
)
|
|
12913
|
-
}
|
|
12914
|
-
) }),
|
|
12915
|
-
/* @__PURE__ */ jsx(
|
|
12916
|
-
Button,
|
|
12917
|
-
{
|
|
12918
|
-
appearance: "transparent",
|
|
12919
|
-
disabled,
|
|
12920
|
-
icon: /* @__PURE__ */ jsx(
|
|
12921
|
-
Icon,
|
|
12922
|
-
{
|
|
12923
|
-
icon: "fluent:add-circle-24-regular",
|
|
12924
|
-
style: {
|
|
12925
|
-
fontSize: "24px",
|
|
12926
|
-
color: tokens.colorBrandStroke1
|
|
12927
|
-
}
|
|
12928
|
-
}
|
|
12929
|
-
),
|
|
12930
|
-
"aria-label": mergedLabels.incrementQuantityAriaLabel,
|
|
12931
|
-
size: "small",
|
|
12932
|
-
onClick: () => {
|
|
12933
|
-
const currentVal = getValues(
|
|
12934
|
-
`owners.${index}.cargo.${cargoIndex}.quantity`
|
|
12935
|
-
) || 0;
|
|
12936
|
-
const currentQty = Number(currentVal);
|
|
12937
|
-
const newVal = currentQty + 1;
|
|
12938
|
-
setValue(
|
|
12939
|
-
`owners.${index}.cargo.${cargoIndex}.quantity`,
|
|
12940
|
-
newVal
|
|
12941
|
-
);
|
|
12942
|
-
onUpdateCargoQuantity(
|
|
12943
|
-
owner.id,
|
|
12944
|
-
cargo.id,
|
|
12945
|
-
newVal
|
|
12946
|
-
);
|
|
12947
|
-
},
|
|
12948
|
-
style: {
|
|
12949
|
-
minWidth: "32px",
|
|
12950
|
-
padding: "0"
|
|
12951
|
-
}
|
|
12952
|
-
}
|
|
12953
|
-
)
|
|
12954
|
-
]
|
|
12955
|
-
}
|
|
12956
|
-
),
|
|
12957
|
-
/* @__PURE__ */ jsx(
|
|
12958
|
-
"div",
|
|
12959
|
-
{
|
|
12960
|
-
style: {
|
|
12961
|
-
flex: 1,
|
|
12962
|
-
textAlign: "left",
|
|
12963
|
-
color: tokens.colorNeutralForeground1,
|
|
12964
|
-
fontSize: tokens.fontSizeBase300,
|
|
12965
|
-
paddingRight: "8px"
|
|
12966
|
-
},
|
|
12967
|
-
children: (() => {
|
|
12968
|
-
const type2 = watch(
|
|
12969
|
-
`owners.${index}.cargo.${cargoIndex}.cargoType`
|
|
12970
|
-
);
|
|
12971
|
-
const selectedLoadType2 = loadTypes.find(
|
|
12972
|
-
(loadType) => loadType.id === type2
|
|
12973
|
-
);
|
|
12974
|
-
return selectedLoadType2?.unit?.name || "87";
|
|
12975
|
-
})()
|
|
12976
|
-
}
|
|
12977
|
-
)
|
|
12978
|
-
]
|
|
12979
|
-
}
|
|
12980
|
-
)
|
|
12981
|
-
] });
|
|
12982
|
-
})(),
|
|
12983
|
-
/* @__PURE__ */ jsxs(Col, { md: 3, children: [
|
|
12984
|
-
/* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.priceLabel }),
|
|
12985
|
-
/* @__PURE__ */ jsx(Body2, { style: { marginTop: "0.5rem" }, children: (() => {
|
|
12986
|
-
return new Intl.NumberFormat(
|
|
12987
|
-
language === "id" ? "id-ID" : "en-US",
|
|
12988
|
-
{
|
|
12989
|
-
style: "currency",
|
|
12990
|
-
currency: language === "id" ? "IDR" : "USD",
|
|
12991
|
-
minimumFractionDigits: 0
|
|
12992
|
-
}
|
|
12993
|
-
).format(
|
|
12994
|
-
Number(
|
|
12995
|
-
getValues(
|
|
12996
|
-
`owners.${index}.cargo.${cargoIndex}.price`
|
|
12997
|
-
) || 1234567890
|
|
13031
|
+
)
|
|
13032
|
+
]
|
|
13033
|
+
}
|
|
13034
|
+
),
|
|
13035
|
+
/* @__PURE__ */ jsx(
|
|
13036
|
+
"div",
|
|
13037
|
+
{
|
|
13038
|
+
style: {
|
|
13039
|
+
flex: 1,
|
|
13040
|
+
textAlign: "left",
|
|
13041
|
+
color: tokens.colorNeutralForeground1,
|
|
13042
|
+
fontSize: tokens.fontSizeBase300,
|
|
13043
|
+
paddingRight: "8px"
|
|
13044
|
+
},
|
|
13045
|
+
children: (() => {
|
|
13046
|
+
const type2 = watch(
|
|
13047
|
+
`owners.${index}.cargo.${cargoIndex}.cargoType`
|
|
13048
|
+
);
|
|
13049
|
+
const selectedLoadType2 = loadTypes.find(
|
|
13050
|
+
(loadType) => loadType.id === type2
|
|
13051
|
+
);
|
|
13052
|
+
return selectedLoadType2?.unit?.name || "----87----";
|
|
13053
|
+
})()
|
|
13054
|
+
}
|
|
13055
|
+
)
|
|
13056
|
+
]
|
|
13057
|
+
}
|
|
12998
13058
|
)
|
|
12999
|
-
)
|
|
13000
|
-
|
|
13001
|
-
|
|
13059
|
+
] }),
|
|
13060
|
+
/* @__PURE__ */ jsxs(Col, { md: 3, children: [
|
|
13061
|
+
/* @__PURE__ */ jsx("div", { style: { flex: 0.5 } }),
|
|
13062
|
+
/* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.priceLabel }),
|
|
13063
|
+
/* @__PURE__ */ jsx(
|
|
13064
|
+
Body2,
|
|
13065
|
+
{
|
|
13066
|
+
style: { marginTop: "0.5rem" },
|
|
13067
|
+
children: (() => {
|
|
13068
|
+
return new Intl.NumberFormat(
|
|
13069
|
+
"id-ID",
|
|
13070
|
+
{
|
|
13071
|
+
style: "currency",
|
|
13072
|
+
currency: "IDR",
|
|
13073
|
+
minimumFractionDigits: 0
|
|
13074
|
+
}
|
|
13075
|
+
).format(
|
|
13076
|
+
Number(
|
|
13077
|
+
getValues(
|
|
13078
|
+
`owners.${index}.cargo.${cargoIndex}.quantity`
|
|
13079
|
+
) || 0
|
|
13080
|
+
) * (selectedLoadType?.price || 0)
|
|
13081
|
+
);
|
|
13082
|
+
})()
|
|
13083
|
+
}
|
|
13084
|
+
)
|
|
13085
|
+
] })
|
|
13086
|
+
] });
|
|
13087
|
+
})()
|
|
13002
13088
|
] }),
|
|
13003
13089
|
/* @__PURE__ */ jsxs(Row, { children: [
|
|
13004
13090
|
/* @__PURE__ */ jsxs(Col, { md: 6, children: [
|