@asdp/ferryui 0.1.22-dev.10832 → 0.1.22-dev.10844

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 (7) hide show
  1. package/dist/index.d.mts +3 -4
  2. package/dist/index.d.ts +3 -4
  3. package/dist/index.js +1073 -1001
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +1074 -1002
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -4,7 +4,7 @@ import React, { forwardRef, useState, useRef, useEffect, useCallback, useMemo, F
4
4
  import { ArrowDownloadRegular, Dismiss24Regular, DismissRegular, SubtractRegular, AddRegular, DeleteRegular, InfoRegular, SearchRegular, ChevronDownRegular, ArrowRightRegular } from '@fluentui/react-icons';
5
5
  import { Container, Row, Col, Visible } from 'react-grid-system';
6
6
  import { Icon } from '@iconify/react';
7
- import { Controller, useForm, useWatch } from 'react-hook-form';
7
+ import { Controller, useForm, useWatch, useFieldArray } from 'react-hook-form';
8
8
  import PhoneInputComponent from 'react-phone-input-2';
9
9
  import Select from 'react-select';
10
10
  import { Calendar } from '@fluentui/react-calendar-compat';
@@ -12809,10 +12809,9 @@ var DEFAULT_LABELS26 = {
12809
12809
  industryTypeOthersLabel: "Jenis Industri Lainnya",
12810
12810
  industryTypeOthersPlaceholder: "Masukkan Jenis Industri",
12811
12811
  cargoCategoryLabel: "Kategori Muatan",
12812
- estimatedLooseCargoLabel: "Estimasi Berat Barang Lepas",
12813
- estimatedLooseCargoWeightPlaceholder: "Masukkan Berat (Ton)",
12814
- estimatedLooseCargoQuantityLabel: "Jumlah Karung",
12815
- estimatedLooseCargoUnitLabel: "Karung",
12812
+ cargoLabel: "Estimasi Berat Barang Lepas",
12813
+ cargoWeightPlaceholder: "Masukkan Berat (Ton)",
12814
+ cargoUnitLabel: "Karung",
12816
12815
  deleteCargoButton: "Hapus Muatan",
12817
12816
  addCargoButton: "Tambah Muatan",
12818
12817
  loadTypeOptions: {
@@ -12869,10 +12868,9 @@ var DEFAULT_LABELS26 = {
12869
12868
  industryTypeOthersLabel: "Other Industry Type",
12870
12869
  industryTypeOthersPlaceholder: "Enter Industry Type",
12871
12870
  cargoCategoryLabel: "Cargo Category",
12872
- estimatedLooseCargoLabel: "Estimated Loose Cargo Weight",
12873
- estimatedLooseCargoWeightPlaceholder: "Enter Weight (Ton)",
12874
- estimatedLooseCargoQuantityLabel: "Number of Bags",
12875
- estimatedLooseCargoUnitLabel: "Bags",
12871
+ cargoLabel: "Estimated Loose Cargo Weight",
12872
+ cargoWeightPlaceholder: "Enter Weight (Ton)",
12873
+ cargoUnitLabel: "Bags",
12876
12874
  deleteCargoButton: "Delete Cargo",
12877
12875
  addCargoButton: "Add Cargo",
12878
12876
  loadTypeOptions: {
@@ -12960,7 +12958,7 @@ var CardVehicleOwnerForm = ({
12960
12958
  }) => {
12961
12959
  const styles = useStyles27();
12962
12960
  const mergedLabels = { ...DEFAULT_LABELS26[language], ...labels };
12963
- const formValues = watch();
12961
+ watch();
12964
12962
  const [defaultOpenCargoItems, setOpenCargoItems] = React.useState(/* @__PURE__ */ new Set());
12965
12963
  useEffect(() => {
12966
12964
  const allOpenItems = /* @__PURE__ */ new Set();
@@ -12973,9 +12971,38 @@ var CardVehicleOwnerForm = ({
12973
12971
  });
12974
12972
  setOpenCargoItems(allOpenItems);
12975
12973
  }, [owners]);
12976
- useEffect(() => {
12977
- console.log("[CardVehicleOwnerForm] Form values changed:", formValues);
12978
- }, [formValues]);
12974
+ function OwnerWeightSync({
12975
+ owner,
12976
+ ownerIndex
12977
+ }) {
12978
+ const { fields } = useFieldArray({
12979
+ control,
12980
+ name: `owners.${ownerIndex}.cargoItems`
12981
+ });
12982
+ console.log(140, fields);
12983
+ const cargoWeights = useWatch({
12984
+ control,
12985
+ name: fields.map(
12986
+ (_, cargoIndex) => `owners.${ownerIndex}.cargoItems.${cargoIndex}.cargoWeight`
12987
+ )
12988
+ });
12989
+ console.log(149, cargoWeights);
12990
+ useEffect(() => {
12991
+ const total = cargoWeights?.reduce(
12992
+ (sum, w) => sum + (Number(w) || 0),
12993
+ 0
12994
+ ) ?? 0;
12995
+ const current = Number(getValues(`owners.${ownerIndex}.estimatedWeight`)) || 0;
12996
+ console.log(160, current, total);
12997
+ if (current !== total) {
12998
+ setValue(`owners.${ownerIndex}.estimatedWeight`, total);
12999
+ onUpdateOwner(owner.id, {
13000
+ estimatedWeight: total
13001
+ });
13002
+ }
13003
+ }, [cargoWeights, ownerIndex, setValue, getValues]);
13004
+ return null;
13005
+ }
12979
13006
  return /* @__PURE__ */ jsxs(Card, { className: styles.card, children: [
12980
13007
  /* @__PURE__ */ jsxs("div", { className: styles.header, children: [
12981
13008
  /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", flex: 1 }, children: [
@@ -12999,165 +13026,59 @@ var CardVehicleOwnerForm = ({
12999
13026
  collapsible: true,
13000
13027
  defaultOpenItems: owners.map((o) => String(o.id)),
13001
13028
  multiple: true,
13002
- children: owners.map((owner, index) => /* @__PURE__ */ jsxs(
13003
- AccordionItem,
13004
- {
13005
- value: String(owner.id),
13006
- className: styles.accordion,
13007
- children: [
13008
- /* @__PURE__ */ jsx(
13009
- AccordionHeader,
13010
- {
13011
- className: styles.accordionHeader,
13012
- expandIconPosition: "end",
13013
- children: /* @__PURE__ */ jsxs(
13014
- "div",
13015
- {
13016
- style: {
13017
- display: "flex",
13018
- justifyContent: "space-between",
13019
- alignItems: "center",
13020
- width: "100%"
13021
- },
13022
- children: [
13023
- /* @__PURE__ */ jsx(Body1Strong, { children: mergedLabels.ownerInfoTitle.replace(
13024
- "{index}",
13025
- (index + 1).toString()
13026
- ) }),
13027
- owners.length > 1 && /* @__PURE__ */ jsx(
13028
- Button,
13029
- {
13030
- appearance: "transparent",
13031
- "aria-label": mergedLabels.deleteOwnerAriaLabel,
13032
- disabled,
13033
- icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:delete-24-regular" }),
13034
- onClick: (e) => {
13035
- e.stopPropagation();
13036
- onDeleteOwner(owner.id);
13037
- },
13038
- style: { color: tokens.colorPaletteRedForeground1 }
13039
- }
13040
- )
13041
- ]
13042
- }
13043
- )
13044
- }
13045
- ),
13046
- /* @__PURE__ */ jsx(AccordionPanel, { children: /* @__PURE__ */ jsxs("div", { className: styles.form, children: [
13047
- /* @__PURE__ */ jsxs(Row, { children: [
13048
- /* @__PURE__ */ jsx(Col, { lg: 12, children: /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13049
- mergedLabels.cargoOwnerTitle,
13050
- " ",
13051
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13052
- ] }) }),
13053
- /* @__PURE__ */ jsxs(Col, { lg: 12, children: [
13054
- /* @__PURE__ */ jsx(
13029
+ children: owners.map((owner, ownerIndex) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
13030
+ /* @__PURE__ */ jsx(OwnerWeightSync, { owner, ownerIndex }),
13031
+ /* @__PURE__ */ jsxs(
13032
+ AccordionItem,
13033
+ {
13034
+ value: String(owner.id),
13035
+ className: styles.accordion,
13036
+ children: [
13037
+ /* @__PURE__ */ jsx(
13038
+ AccordionHeader,
13039
+ {
13040
+ className: styles.accordionHeader,
13041
+ expandIconPosition: "end",
13042
+ children: /* @__PURE__ */ jsxs(
13055
13043
  "div",
13056
13044
  {
13057
13045
  style: {
13058
13046
  display: "flex",
13059
- gap: "2rem",
13060
- marginBottom: "0.5rem"
13047
+ justifyContent: "space-between",
13048
+ alignItems: "center",
13049
+ width: "100%"
13061
13050
  },
13062
- children: /* @__PURE__ */ jsxs(
13063
- RadioGroup,
13064
- {
13065
- disabled,
13066
- layout: "horizontal",
13067
- onChange: (_, data) => {
13068
- onUpdateOwner(owner.id, {
13069
- cargoOwnerEntityType: data.value,
13070
- cargoOwnerEntity: "",
13071
- cargoOwnerEntityOther: ""
13072
- });
13073
- setValue(`owners.${index}.cargoOwnerEntity`, "");
13074
- setValue(`owners.${index}.cargoOwnerEntityOther`, "");
13075
- },
13076
- required: true,
13077
- value: owner.cargoOwnerEntityType || MANIFEST_ENTITY.COMPANY,
13078
- children: [
13079
- /* @__PURE__ */ jsx(
13080
- Radio,
13081
- {
13082
- value: MANIFEST_ENTITY.COMPANY,
13083
- label: mergedLabels.entityTypeCompany
13084
- }
13085
- ),
13086
- /* @__PURE__ */ jsx(
13087
- Radio,
13088
- {
13089
- value: MANIFEST_ENTITY.INDIVIDUAL,
13090
- label: mergedLabels.entityTypeIndividual
13091
- }
13092
- )
13093
- ]
13094
- }
13095
- )
13096
- }
13097
- ),
13098
- /* @__PURE__ */ jsxs(Row, { children: [
13099
- /* @__PURE__ */ jsx(
13100
- Col,
13101
- {
13102
- lg: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoOwnerEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13103
- children: /* @__PURE__ */ jsx(
13104
- InputDynamic_default,
13051
+ children: [
13052
+ /* @__PURE__ */ jsx(Body1Strong, { children: mergedLabels.ownerInfoTitle.replace(
13053
+ "{index}",
13054
+ (ownerIndex + 1).toString()
13055
+ ) }),
13056
+ owners.length > 1 && /* @__PURE__ */ jsx(
13057
+ Button,
13105
13058
  {
13059
+ appearance: "transparent",
13060
+ "aria-label": mergedLabels.deleteOwnerAriaLabel,
13106
13061
  disabled,
13107
- control,
13108
- name: `owners.${index}.cargoOwnerEntity`,
13109
- options: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? companyOwnerOptions : [],
13110
- onChange: (val) => {
13111
- setValue(`owners.${index}.cargoOwnerEntity`, val);
13112
- onUpdateOwner(owner.id, {
13113
- cargoOwnerEntity: val
13114
- });
13062
+ icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:delete-24-regular" }),
13063
+ onClick: (e) => {
13064
+ e.stopPropagation();
13065
+ onDeleteOwner(owner.id);
13115
13066
  },
13116
- placeholder: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.cargoOwnerCompanyPlaceholder : mergedLabels.cargoOwnerIndividualPlaceholder,
13117
- required: true,
13118
- size: "large",
13119
- type: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text"
13067
+ style: { color: tokens.colorPaletteRedForeground1 }
13120
13068
  }
13121
13069
  )
13122
- }
13123
- ),
13124
- owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoOwnerEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsx(Col, { xl: 6, children: /* @__PURE__ */ jsx(
13125
- InputDynamic_default,
13126
- {
13127
- control,
13128
- disabled,
13129
- name: `owners.${index}.cargoOwnerEntityOther`,
13130
- placeholder: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13131
- required: true,
13132
- size: "large",
13133
- type: "text",
13134
- onChange: (val) => {
13135
- setValue(
13136
- `owners.${index}.cargoOwnerEntityOther`,
13137
- val
13138
- );
13139
- onUpdateOwner(owner.id, {
13140
- cargoOwnerEntityOther: val
13141
- });
13142
- }
13143
- }
13144
- ) })
13145
- ] }),
13146
- /* @__PURE__ */ jsx(
13147
- Caption1,
13148
- {
13149
- style: {
13150
- color: tokens.colorNeutralForeground3,
13151
- marginTop: "0.25rem"
13152
- },
13153
- children: mergedLabels.otherCompanyHelperText
13070
+ ]
13154
13071
  }
13155
13072
  )
13156
- ] })
13157
- ] }),
13158
- hasLoad && /* @__PURE__ */ jsxs(Fragment, { children: [
13159
- /* @__PURE__ */ jsxs(Row, { nogutter: true, children: [
13160
- /* @__PURE__ */ jsx(Col, { lg: 12, children: /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.cargoReceiverTitle }) }),
13073
+ }
13074
+ ),
13075
+ /* @__PURE__ */ jsx(AccordionPanel, { children: /* @__PURE__ */ jsxs("div", { className: styles.form, children: [
13076
+ /* @__PURE__ */ jsxs(Row, { children: [
13077
+ /* @__PURE__ */ jsx(Col, { lg: 12, children: /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13078
+ mergedLabels.cargoOwnerTitle,
13079
+ " ",
13080
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13081
+ ] }) }),
13161
13082
  /* @__PURE__ */ jsxs(Col, { lg: 12, children: [
13162
13083
  /* @__PURE__ */ jsx(
13163
13084
  "div",
@@ -13174,21 +13095,21 @@ var CardVehicleOwnerForm = ({
13174
13095
  layout: "horizontal",
13175
13096
  onChange: (_, data) => {
13176
13097
  onUpdateOwner(owner.id, {
13177
- cargoReceiverEntityType: data.value,
13178
- cargoReceiverEntity: "",
13179
- cargoReceiverEntityOther: ""
13098
+ cargoOwnerEntityType: data.value,
13099
+ cargoOwnerEntity: "",
13100
+ cargoOwnerEntityOther: ""
13180
13101
  });
13181
13102
  setValue(
13182
- `owners.${index}.cargoReceiverEntity`,
13103
+ `owners.${ownerIndex}.cargoOwnerEntity`,
13183
13104
  ""
13184
13105
  );
13185
13106
  setValue(
13186
- `owners.${index}.cargoReceiverEntityOther`,
13107
+ `owners.${ownerIndex}.cargoOwnerEntityOther`,
13187
13108
  ""
13188
13109
  );
13189
13110
  },
13190
13111
  required: true,
13191
- value: owner.cargoReceiverEntityType || MANIFEST_ENTITY.COMPANY,
13112
+ value: owner.cargoOwnerEntityType || MANIFEST_ENTITY.COMPANY,
13192
13113
  children: [
13193
13114
  /* @__PURE__ */ jsx(
13194
13115
  Radio,
@@ -13213,48 +13134,48 @@ var CardVehicleOwnerForm = ({
13213
13134
  /* @__PURE__ */ jsx(
13214
13135
  Col,
13215
13136
  {
13216
- lg: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoReceiverEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13137
+ lg: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoOwnerEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13217
13138
  children: /* @__PURE__ */ jsx(
13218
13139
  InputDynamic_default,
13219
13140
  {
13220
- control,
13221
13141
  disabled,
13222
- name: `owners.${index}.cargoReceiverEntity`,
13223
- placeholder: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.cargoReceiverCompanyPlaceholder : mergedLabels.cargoReceiverIndividualPlaceholder,
13224
- required: true,
13225
- size: "large",
13226
- type: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text",
13227
- options: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? companyReceiverOptions : [],
13142
+ control,
13143
+ name: `owners.${ownerIndex}.cargoOwnerEntity`,
13144
+ options: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? companyOwnerOptions : [],
13228
13145
  onChange: (val) => {
13229
13146
  setValue(
13230
- `owners.${index}.cargoReceiverEntity`,
13147
+ `owners.${ownerIndex}.cargoOwnerEntity`,
13231
13148
  val
13232
13149
  );
13233
13150
  onUpdateOwner(owner.id, {
13234
- cargoReceiverEntity: val
13151
+ cargoOwnerEntity: val
13235
13152
  });
13236
- }
13153
+ },
13154
+ placeholder: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.cargoOwnerCompanyPlaceholder : mergedLabels.cargoOwnerIndividualPlaceholder,
13155
+ required: true,
13156
+ size: "large",
13157
+ type: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text"
13237
13158
  }
13238
13159
  )
13239
13160
  }
13240
13161
  ),
13241
- owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoReceiverEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsx(Col, { lg: 6, children: /* @__PURE__ */ jsx(
13162
+ owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoOwnerEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsx(Col, { xl: 6, children: /* @__PURE__ */ jsx(
13242
13163
  InputDynamic_default,
13243
13164
  {
13244
13165
  control,
13245
13166
  disabled,
13246
- name: `owners.${index}.cargoReceiverEntityOther`,
13247
- placeholder: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13167
+ name: `owners.${ownerIndex}.cargoOwnerEntityOther`,
13168
+ placeholder: owner.cargoOwnerEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13248
13169
  required: true,
13249
13170
  size: "large",
13250
13171
  type: "text",
13251
13172
  onChange: (val) => {
13252
13173
  setValue(
13253
- `owners.${index}.cargoReceiverEntityOther`,
13174
+ `owners.${ownerIndex}.cargoOwnerEntityOther`,
13254
13175
  val
13255
13176
  );
13256
13177
  onUpdateOwner(owner.id, {
13257
- cargoReceiverEntityOther: val
13178
+ cargoOwnerEntityOther: val
13258
13179
  });
13259
13180
  }
13260
13181
  }
@@ -13272,895 +13193,1046 @@ var CardVehicleOwnerForm = ({
13272
13193
  )
13273
13194
  ] })
13274
13195
  ] }),
13275
- /* @__PURE__ */ jsxs(Row, { nogutter: true, children: [
13276
- /* @__PURE__ */ jsx(Col, { lg: 12, children: /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13277
- mergedLabels.logisticsCompanyTitle,
13278
- " ",
13279
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13280
- ] }) }),
13281
- /* @__PURE__ */ jsxs(Col, { lg: 12, children: [
13282
- /* @__PURE__ */ jsx(
13283
- "div",
13284
- {
13285
- style: {
13286
- display: "flex",
13287
- gap: "2rem",
13288
- marginBottom: "0.5rem"
13289
- },
13290
- children: /* @__PURE__ */ jsxs(
13291
- RadioGroup,
13196
+ hasLoad && /* @__PURE__ */ jsxs(Fragment, { children: [
13197
+ /* @__PURE__ */ jsxs(Row, { nogutter: true, children: [
13198
+ /* @__PURE__ */ jsx(Col, { lg: 12, children: /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.cargoReceiverTitle }) }),
13199
+ /* @__PURE__ */ jsxs(Col, { lg: 12, children: [
13200
+ /* @__PURE__ */ jsx(
13201
+ "div",
13202
+ {
13203
+ style: {
13204
+ display: "flex",
13205
+ gap: "2rem",
13206
+ marginBottom: "0.5rem"
13207
+ },
13208
+ children: /* @__PURE__ */ jsxs(
13209
+ RadioGroup,
13210
+ {
13211
+ disabled,
13212
+ layout: "horizontal",
13213
+ onChange: (_, data) => {
13214
+ onUpdateOwner(owner.id, {
13215
+ cargoReceiverEntityType: data.value,
13216
+ cargoReceiverEntity: "",
13217
+ cargoReceiverEntityOther: ""
13218
+ });
13219
+ setValue(
13220
+ `owners.${ownerIndex}.cargoReceiverEntity`,
13221
+ ""
13222
+ );
13223
+ setValue(
13224
+ `owners.${ownerIndex}.cargoReceiverEntityOther`,
13225
+ ""
13226
+ );
13227
+ },
13228
+ required: true,
13229
+ value: owner.cargoReceiverEntityType || MANIFEST_ENTITY.COMPANY,
13230
+ children: [
13231
+ /* @__PURE__ */ jsx(
13232
+ Radio,
13233
+ {
13234
+ value: MANIFEST_ENTITY.COMPANY,
13235
+ label: mergedLabels.entityTypeCompany
13236
+ }
13237
+ ),
13238
+ /* @__PURE__ */ jsx(
13239
+ Radio,
13240
+ {
13241
+ value: MANIFEST_ENTITY.INDIVIDUAL,
13242
+ label: mergedLabels.entityTypeIndividual
13243
+ }
13244
+ )
13245
+ ]
13246
+ }
13247
+ )
13248
+ }
13249
+ ),
13250
+ /* @__PURE__ */ jsxs(Row, { children: [
13251
+ /* @__PURE__ */ jsx(
13252
+ Col,
13253
+ {
13254
+ lg: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoReceiverEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13255
+ children: /* @__PURE__ */ jsx(
13256
+ InputDynamic_default,
13257
+ {
13258
+ control,
13259
+ disabled,
13260
+ name: `owners.${ownerIndex}.cargoReceiverEntity`,
13261
+ placeholder: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.cargoReceiverCompanyPlaceholder : mergedLabels.cargoReceiverIndividualPlaceholder,
13262
+ required: true,
13263
+ size: "large",
13264
+ type: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text",
13265
+ options: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? companyReceiverOptions : [],
13266
+ onChange: (val) => {
13267
+ setValue(
13268
+ `owners.${ownerIndex}.cargoReceiverEntity`,
13269
+ val
13270
+ );
13271
+ onUpdateOwner(owner.id, {
13272
+ cargoReceiverEntity: val
13273
+ });
13274
+ }
13275
+ }
13276
+ )
13277
+ }
13278
+ ),
13279
+ owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY && owner.cargoReceiverEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsx(Col, { lg: 6, children: /* @__PURE__ */ jsx(
13280
+ InputDynamic_default,
13292
13281
  {
13282
+ control,
13293
13283
  disabled,
13294
- layout: "horizontal",
13295
- onChange: (_, data) => {
13296
- onUpdateOwner(owner.id, {
13297
- logisticsEntityType: data.value,
13298
- logisticsEntity: "",
13299
- logisticsEntityOther: ""
13300
- });
13301
- setValue(`owners.${index}.logisticsEntity`, "");
13284
+ name: `owners.${ownerIndex}.cargoReceiverEntityOther`,
13285
+ placeholder: owner.cargoReceiverEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13286
+ required: true,
13287
+ size: "large",
13288
+ type: "text",
13289
+ onChange: (val) => {
13302
13290
  setValue(
13303
- `owners.${index}.logisticsEntityOther`,
13304
- ""
13291
+ `owners.${ownerIndex}.cargoReceiverEntityOther`,
13292
+ val
13305
13293
  );
13306
- },
13307
- required: true,
13308
- value: owner.logisticsEntityType || MANIFEST_ENTITY.COMPANY,
13309
- children: [
13310
- /* @__PURE__ */ jsx(
13311
- Radio,
13312
- {
13313
- value: MANIFEST_ENTITY.COMPANY,
13314
- label: mergedLabels.entityTypeCompany
13315
- }
13316
- ),
13317
- /* @__PURE__ */ jsx(
13318
- Radio,
13319
- {
13320
- value: MANIFEST_ENTITY.INDIVIDUAL,
13321
- label: mergedLabels.entityTypeIndividual
13322
- }
13323
- )
13324
- ]
13294
+ onUpdateOwner(owner.id, {
13295
+ cargoReceiverEntityOther: val
13296
+ });
13297
+ }
13325
13298
  }
13326
- )
13327
- }
13328
- ),
13329
- /* @__PURE__ */ jsxs(Row, { children: [
13299
+ ) })
13300
+ ] }),
13330
13301
  /* @__PURE__ */ jsx(
13331
- Col,
13302
+ Caption1,
13332
13303
  {
13333
- xl: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY && owner.logisticsEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13334
- children: /* @__PURE__ */ jsx(
13335
- InputDynamic_default,
13304
+ style: {
13305
+ color: tokens.colorNeutralForeground3,
13306
+ marginTop: "0.25rem"
13307
+ },
13308
+ children: mergedLabels.otherCompanyHelperText
13309
+ }
13310
+ )
13311
+ ] })
13312
+ ] }),
13313
+ /* @__PURE__ */ jsxs(Row, { nogutter: true, children: [
13314
+ /* @__PURE__ */ jsx(Col, { lg: 12, children: /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13315
+ mergedLabels.logisticsCompanyTitle,
13316
+ " ",
13317
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13318
+ ] }) }),
13319
+ /* @__PURE__ */ jsxs(Col, { lg: 12, children: [
13320
+ /* @__PURE__ */ jsx(
13321
+ "div",
13322
+ {
13323
+ style: {
13324
+ display: "flex",
13325
+ gap: "2rem",
13326
+ marginBottom: "0.5rem"
13327
+ },
13328
+ children: /* @__PURE__ */ jsxs(
13329
+ RadioGroup,
13336
13330
  {
13337
- control,
13338
13331
  disabled,
13339
- name: `owners.${index}.logisticsEntity`,
13340
- placeholder: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.logisticsCompanyPlaceholder : mergedLabels.logisticsIndividualPlaceholder,
13341
- required: true,
13342
- size: "large",
13343
- type: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text",
13344
- options: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? companyLogisticsOptions : [],
13345
- onChange: (val) => {
13346
- setValue(
13347
- `owners.${index}.logisticsEntity`,
13348
- val
13349
- );
13332
+ layout: "horizontal",
13333
+ onChange: (_, data) => {
13350
13334
  onUpdateOwner(owner.id, {
13351
- logisticsEntity: val
13335
+ logisticsEntityType: data.value,
13336
+ logisticsEntity: "",
13337
+ logisticsEntityOther: ""
13352
13338
  });
13353
- }
13339
+ setValue(
13340
+ `owners.${ownerIndex}.logisticsEntity`,
13341
+ ""
13342
+ );
13343
+ setValue(
13344
+ `owners.${ownerIndex}.logisticsEntityOther`,
13345
+ ""
13346
+ );
13347
+ },
13348
+ required: true,
13349
+ value: owner.logisticsEntityType || MANIFEST_ENTITY.COMPANY,
13350
+ children: [
13351
+ /* @__PURE__ */ jsx(
13352
+ Radio,
13353
+ {
13354
+ value: MANIFEST_ENTITY.COMPANY,
13355
+ label: mergedLabels.entityTypeCompany
13356
+ }
13357
+ ),
13358
+ /* @__PURE__ */ jsx(
13359
+ Radio,
13360
+ {
13361
+ value: MANIFEST_ENTITY.INDIVIDUAL,
13362
+ label: mergedLabels.entityTypeIndividual
13363
+ }
13364
+ )
13365
+ ]
13354
13366
  }
13355
13367
  )
13356
13368
  }
13357
13369
  ),
13358
- owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY && owner.logisticsEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsx(Col, { xl: 6, children: /* @__PURE__ */ jsx(
13359
- InputDynamic_default,
13360
- {
13361
- control,
13362
- disabled,
13363
- name: `owners.${index}.logisticsEntityOther`,
13364
- placeholder: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13365
- required: true,
13366
- size: "large",
13367
- type: "text",
13368
- onChange: (val) => {
13369
- setValue(
13370
- `owners.${index}.logisticsEntityOther`,
13371
- val
13372
- );
13373
- onUpdateOwner(owner.id, {
13374
- logisticsEntityOther: val
13375
- });
13370
+ /* @__PURE__ */ jsxs(Row, { children: [
13371
+ /* @__PURE__ */ jsx(
13372
+ Col,
13373
+ {
13374
+ xl: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY && owner.logisticsEntity === HARDCODED_ID.COMPANY__LAINNYA ? 6 : 12,
13375
+ children: /* @__PURE__ */ jsx(
13376
+ InputDynamic_default,
13377
+ {
13378
+ control,
13379
+ disabled,
13380
+ name: `owners.${ownerIndex}.logisticsEntity`,
13381
+ placeholder: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.logisticsCompanyPlaceholder : mergedLabels.logisticsIndividualPlaceholder,
13382
+ required: true,
13383
+ size: "large",
13384
+ type: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? "select" : "text",
13385
+ options: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? companyLogisticsOptions : [],
13386
+ onChange: (val) => {
13387
+ setValue(
13388
+ `owners.${ownerIndex}.logisticsEntity`,
13389
+ val
13390
+ );
13391
+ onUpdateOwner(owner.id, {
13392
+ logisticsEntity: val
13393
+ });
13394
+ }
13395
+ }
13396
+ )
13376
13397
  }
13377
- }
13378
- ) })
13379
- ] })
13380
- ] }),
13381
- /* @__PURE__ */ jsx(
13382
- Caption1,
13383
- {
13384
- style: {
13385
- color: tokens.colorNeutralForeground3,
13386
- marginTop: "0.25rem"
13387
- },
13388
- children: mergedLabels.otherCompanyHelperText
13389
- }
13390
- )
13391
- ] })
13392
- ] }),
13393
- /* @__PURE__ */ jsxs(Row, { children: [
13394
- /* @__PURE__ */ jsxs(Col, { xl: 6, children: [
13395
- /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.originCityLabel }),
13396
- /* @__PURE__ */ jsx(
13397
- InputDynamic_default,
13398
- {
13399
- control,
13400
- disabled,
13401
- name: `owners.${index}.originCity`,
13402
- onChange: (val) => {
13403
- setValue(`owners.${index}.originCity`, val);
13404
- onUpdateOwner(owner.id, {
13405
- originCity: val
13406
- });
13407
- },
13408
- options: cityOriginOptions,
13409
- placeholder: mergedLabels.selectPlaceholder,
13410
- required: true,
13411
- size: "large",
13412
- type: "select"
13413
- }
13414
- )
13415
- ] }),
13416
- /* @__PURE__ */ jsxs(Col, { xl: 6, children: [
13417
- /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.destinationCityLabel }),
13418
- /* @__PURE__ */ jsx(
13419
- InputDynamic_default,
13420
- {
13421
- control,
13422
- disabled,
13423
- name: `owners.${index}.destinationCity`,
13424
- options: cityDestinationOptions,
13425
- onChange: (val) => {
13426
- setValue(`owners.${index}.destinationCity`, val);
13427
- onUpdateOwner(owner.id, {
13428
- destinationCity: val
13429
- });
13430
- },
13431
- placeholder: mergedLabels.selectPlaceholder,
13432
- required: true,
13433
- size: "large",
13434
- type: "select"
13435
- }
13436
- )
13398
+ ),
13399
+ owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY && owner.logisticsEntity === HARDCODED_ID.COMPANY__LAINNYA && /* @__PURE__ */ jsx(Col, { xl: 6, children: /* @__PURE__ */ jsx(
13400
+ InputDynamic_default,
13401
+ {
13402
+ control,
13403
+ disabled,
13404
+ name: `owners.${ownerIndex}.logisticsEntityOther`,
13405
+ placeholder: owner.logisticsEntityType === MANIFEST_ENTITY.COMPANY ? mergedLabels.selectCompanyPlaceholder : mergedLabels.inputSenderNamePlaceholder,
13406
+ required: true,
13407
+ size: "large",
13408
+ type: "text",
13409
+ onChange: (val) => {
13410
+ setValue(
13411
+ `owners.${ownerIndex}.logisticsEntityOther`,
13412
+ val
13413
+ );
13414
+ onUpdateOwner(owner.id, {
13415
+ logisticsEntityOther: val
13416
+ });
13417
+ }
13418
+ }
13419
+ ) })
13420
+ ] })
13421
+ ] }),
13422
+ /* @__PURE__ */ jsx(
13423
+ Caption1,
13424
+ {
13425
+ style: {
13426
+ color: tokens.colorNeutralForeground3,
13427
+ marginTop: "0.25rem"
13428
+ },
13429
+ children: mergedLabels.otherCompanyHelperText
13430
+ }
13431
+ )
13432
+ ] })
13437
13433
  ] }),
13438
- /* @__PURE__ */ jsxs(Col, { lg: 12, children: [
13439
- /* @__PURE__ */ jsx("div", { style: { height: "1rem" } }),
13440
- /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13441
- mergedLabels.estimatedVehicleWeightLabel,
13442
- " ",
13443
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13434
+ /* @__PURE__ */ jsxs(Row, { children: [
13435
+ /* @__PURE__ */ jsxs(Col, { xl: 6, children: [
13436
+ /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.originCityLabel }),
13437
+ /* @__PURE__ */ jsx(
13438
+ InputDynamic_default,
13439
+ {
13440
+ control,
13441
+ disabled,
13442
+ name: `owners.${ownerIndex}.originCity`,
13443
+ onChange: (val) => {
13444
+ setValue(`owners.${ownerIndex}.originCity`, val);
13445
+ onUpdateOwner(owner.id, {
13446
+ originCity: val
13447
+ });
13448
+ },
13449
+ options: cityOriginOptions,
13450
+ placeholder: mergedLabels.selectPlaceholder,
13451
+ required: true,
13452
+ size: "large",
13453
+ type: "select"
13454
+ }
13455
+ )
13444
13456
  ] }),
13445
- /* @__PURE__ */ jsx(
13446
- InputDynamic_default,
13447
- {
13448
- control,
13449
- disabled,
13450
- name: `owners.${index}.estimatedWeight`,
13451
- placeholder: mergedLabels.inputNumberPlaceholder,
13452
- required: true,
13453
- size: "large",
13454
- type: "number",
13455
- onChange: (val) => {
13456
- setValue(`owners.${index}.estimatedWeight`, val);
13457
- onUpdateOwner(owner.id, {
13458
- estimatedWeight: val
13459
- });
13457
+ /* @__PURE__ */ jsxs(Col, { xl: 6, children: [
13458
+ /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.destinationCityLabel }),
13459
+ /* @__PURE__ */ jsx(
13460
+ InputDynamic_default,
13461
+ {
13462
+ control,
13463
+ disabled,
13464
+ name: `owners.${ownerIndex}.destinationCity`,
13465
+ options: cityDestinationOptions,
13466
+ onChange: (val) => {
13467
+ setValue(`owners.${ownerIndex}.destinationCity`, val);
13468
+ onUpdateOwner(owner.id, {
13469
+ destinationCity: val
13470
+ });
13471
+ },
13472
+ placeholder: mergedLabels.selectPlaceholder,
13473
+ required: true,
13474
+ size: "large",
13475
+ type: "select"
13460
13476
  }
13461
- }
13462
- )
13463
- ] })
13464
- ] }),
13465
- hasLoad && /* @__PURE__ */ jsxs(Fragment, { children: [
13466
- /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.cargoListTitle }) }) }),
13467
- /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { xs: 12, children: [
13468
- /* @__PURE__ */ jsx(
13469
- Accordion,
13470
- {
13471
- collapsible: true,
13472
- defaultOpenItems: Array.from(defaultOpenCargoItems),
13473
- onToggle: (e, data) => {
13474
- const newOpenItems = new Set(data.openItems);
13475
- setOpenCargoItems(newOpenItems);
13476
- const updatedCargoItems = owner.cargoItems?.map((cargo) => ({
13477
- ...cargo,
13478
- _isAccordionOpen: newOpenItems.has(`cargo-${cargo.id}`)
13479
- }));
13480
- onUpdateOwner(owner.id, {
13481
- cargoItems: updatedCargoItems
13482
- });
13483
- },
13484
- multiple: true,
13485
- children: owner.cargoItems?.map((cargo, cargoIndex) => {
13486
- const watchCommodity = watch(
13487
- `owners.${index}.cargo.${cargoIndex}.commodity`
13488
- );
13489
- const watchLoadType = watch(
13490
- `owners.${index}.cargo.${cargoIndex}.loadType`
13491
- );
13492
- const watchIndustryType = watch(
13493
- `owners.${index}.cargo.${cargoIndex}.industryType`
13494
- );
13495
- const watchQuantity = watch(
13496
- `owners.${index}.cargo.${cargoIndex}.quantity`
13497
- );
13498
- let _loadTypeOptions = [];
13499
- if (watchCommodity && loadTypeOptionsByCommodityId[watchCommodity]) {
13500
- _loadTypeOptions = loadTypeOptionsByCommodityId[watchCommodity];
13501
- } else {
13502
- _loadTypeOptions = loadTypeOptions.map((lt) => ({
13503
- value: lt.id.toString(),
13504
- label: `${lt.name}${lt.unit?.name ? ` (${lt.unit.name})` : ""}`
13505
- }));
13477
+ )
13478
+ ] }),
13479
+ /* @__PURE__ */ jsxs(Col, { lg: 12, children: [
13480
+ /* @__PURE__ */ jsx("div", { style: { height: "1rem" } }),
13481
+ /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13482
+ (() => {
13483
+ if (selectedLoadType === LOAD_TYPE.PASSENGER_VEHICLE) {
13484
+ return mergedLabels.estimatedVehicleWeightLabel;
13485
+ } else if (selectedLoadType === LOAD_TYPE.GOODS_VEHICLE || selectedLoadType === LOAD_TYPE.LOOSE_LOAD_WITH_VEHICLE) {
13486
+ return hasLoad ? mergedLabels.estimatedVehicleAndCargoWeightLabel : mergedLabels.estimatedVehicleWeightLabel;
13487
+ } else if (selectedLoadType === LOAD_TYPE.LOOSE_LOAD_WITHOUT_VEHICLE) {
13488
+ return mergedLabels.estimatedCargoWeightLabel;
13506
13489
  }
13507
- const _selectedLoadType = loadTypes.find(
13508
- (loadType) => loadType.id.toString() === watchLoadType
13509
- );
13510
- const isLoadTypeOther = _loadTypeOptions.find(
13511
- (lt) => lt.value.toString() === String(watchLoadType)
13512
- )?.label.startsWith(
13513
- HARDCODED_NAME.LOAD_TYPE__LAINNYA
13514
- );
13515
- const isIndustryTypeOther = industryOptions?.find(
13516
- (it) => it.value.toString() === String(watchIndustryType)
13517
- )?.label === HARDCODED_NAME.INDUSTRY_TYPE__LAINNYA;
13518
- return /* @__PURE__ */ jsxs(
13519
- AccordionItem,
13520
- {
13521
- value: `cargo-${cargo.id}`,
13522
- className: styles.accordion,
13523
- children: [
13524
- /* @__PURE__ */ jsx(
13525
- AccordionHeader,
13526
- {
13527
- className: styles.accordionHeader,
13528
- expandIconPosition: "end",
13529
- children: /* @__PURE__ */ jsxs(
13530
- "div",
13531
- {
13532
- style: {
13533
- display: "flex",
13534
- justifyContent: "space-between",
13535
- alignItems: "center",
13536
- width: "100%",
13537
- gap: "1rem"
13538
- },
13539
- children: [
13540
- /* @__PURE__ */ jsx(Body1Strong, { style: { minWidth: "fit-content" }, children: mergedLabels.cargoItemTitle.replace(
13541
- "{index}",
13542
- (cargoIndex + 1).toString()
13543
- ) }),
13544
- _selectedLoadType && !cargo._isAccordionOpen && /* @__PURE__ */ jsxs(Fragment, { children: [
13545
- /* @__PURE__ */ jsxs(Body1Strong, { style: { flex: 1 }, children: [
13546
- _selectedLoadType.name,
13547
- " \u2022",
13548
- " ",
13549
- watchQuantity,
13550
- "x",
13551
- " ",
13552
- _selectedLoadType.unit?.name,
13553
- " \u2022",
13554
- " ",
13555
- _selectedLoadType.formattedPrice
13556
- ] }),
13490
+ })(),
13491
+ " ",
13492
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13493
+ ] }),
13494
+ /* @__PURE__ */ jsx(
13495
+ InputDynamic_default,
13496
+ {
13497
+ control,
13498
+ disabled,
13499
+ name: `owners.${ownerIndex}.estimatedWeight`,
13500
+ placeholder: mergedLabels.inputNumberPlaceholder,
13501
+ required: true,
13502
+ size: "large",
13503
+ type: "number",
13504
+ onChange: (val) => {
13505
+ setValue(`owners.${ownerIndex}.estimatedWeight`, val);
13506
+ onUpdateOwner(owner.id, {
13507
+ estimatedWeight: val
13508
+ });
13509
+ }
13510
+ }
13511
+ )
13512
+ ] })
13513
+ ] }),
13514
+ hasLoad && /* @__PURE__ */ jsxs(Fragment, { children: [
13515
+ /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx(Col, { xs: 12, children: /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.cargoListTitle }) }) }),
13516
+ /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsxs(Col, { xs: 12, children: [
13517
+ /* @__PURE__ */ jsx(
13518
+ Accordion,
13519
+ {
13520
+ collapsible: true,
13521
+ defaultOpenItems: Array.from(defaultOpenCargoItems),
13522
+ onToggle: (e, data) => {
13523
+ const newOpenItems = new Set(
13524
+ data.openItems
13525
+ );
13526
+ setOpenCargoItems(newOpenItems);
13527
+ const updatedCargoItems = owner.cargoItems?.map(
13528
+ (cargo) => ({
13529
+ ...cargo,
13530
+ _isAccordionOpen: newOpenItems.has(
13531
+ `cargo-${cargo.id}`
13532
+ )
13533
+ })
13534
+ );
13535
+ onUpdateOwner(owner.id, {
13536
+ cargoItems: updatedCargoItems
13537
+ });
13538
+ },
13539
+ multiple: true,
13540
+ children: owner.cargoItems?.map((cargo, cargoIndex) => {
13541
+ const watchCommodity = watch(
13542
+ `owners.${ownerIndex}.cargo.${cargoIndex}.commodity`
13543
+ );
13544
+ const watchLoadType = watch(
13545
+ `owners.${ownerIndex}.cargo.${cargoIndex}.loadType`
13546
+ );
13547
+ const watchIndustryType = watch(
13548
+ `owners.${ownerIndex}.cargo.${cargoIndex}.industryType`
13549
+ );
13550
+ const watchQuantity = watch(
13551
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
13552
+ );
13553
+ let _loadTypeOptions = [];
13554
+ if (watchCommodity && loadTypeOptionsByCommodityId[watchCommodity]) {
13555
+ _loadTypeOptions = loadTypeOptionsByCommodityId[watchCommodity];
13556
+ } else {
13557
+ _loadTypeOptions = loadTypeOptions.map(
13558
+ (lt) => ({
13559
+ value: lt.id.toString(),
13560
+ label: `${lt.name}${lt.unit?.name ? ` (${lt.unit.name})` : ""}`
13561
+ })
13562
+ );
13563
+ }
13564
+ const _selectedLoadType = loadTypes.find(
13565
+ (loadType) => loadType.id.toString() === watchLoadType
13566
+ );
13567
+ const isLoadTypeOther = _loadTypeOptions.find(
13568
+ (lt) => lt.value.toString() === String(watchLoadType)
13569
+ )?.label.startsWith(
13570
+ HARDCODED_NAME.LOAD_TYPE__LAINNYA
13571
+ );
13572
+ const isIndustryTypeOther = industryOptions?.find(
13573
+ (it) => it.value.toString() === String(watchIndustryType)
13574
+ )?.label === HARDCODED_NAME.INDUSTRY_TYPE__LAINNYA;
13575
+ return /* @__PURE__ */ jsxs(
13576
+ AccordionItem,
13577
+ {
13578
+ value: `cargo-${cargo.id}`,
13579
+ className: styles.accordion,
13580
+ children: [
13581
+ /* @__PURE__ */ jsx(
13582
+ AccordionHeader,
13583
+ {
13584
+ className: styles.accordionHeader,
13585
+ expandIconPosition: "end",
13586
+ children: /* @__PURE__ */ jsxs(
13587
+ "div",
13588
+ {
13589
+ style: {
13590
+ display: "flex",
13591
+ justifyContent: "space-between",
13592
+ alignItems: "center",
13593
+ width: "100%",
13594
+ gap: "1rem"
13595
+ },
13596
+ children: [
13557
13597
  /* @__PURE__ */ jsx(
13558
- Body1Stronger,
13598
+ Body1Strong,
13559
13599
  {
13560
- style: {
13561
- color: sharedColors["Shared_Secondary_Primary"],
13562
- minWidth: "fit-content"
13563
- },
13564
- children: new Intl.NumberFormat("id-ID", {
13565
- style: "currency",
13566
- currency: "IDR",
13567
- minimumFractionDigits: 0
13568
- }).format(
13569
- Number(
13570
- getValues(
13571
- `owners.${index}.cargo.${cargoIndex}.quantity`
13572
- ) || 0
13573
- ) * (_selectedLoadType.price || 0)
13600
+ style: { minWidth: "fit-content" },
13601
+ children: mergedLabels.cargoItemTitle.replace(
13602
+ "{index}",
13603
+ (cargoIndex + 1).toString()
13574
13604
  )
13575
13605
  }
13576
- )
13577
- ] })
13578
- ]
13579
- }
13580
- )
13581
- }
13582
- ),
13583
- /* @__PURE__ */ jsx(AccordionPanel, { children: /* @__PURE__ */ jsxs("div", { className: styles.form, children: [
13584
- /* @__PURE__ */ jsxs(Row, { children: [
13585
- /* @__PURE__ */ jsxs(Col, { md: isLoadTypeOther ? 4 : 6, children: [
13586
- /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13587
- mergedLabels.commodityLabel,
13588
- " ",
13589
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13590
- ] }),
13591
- /* @__PURE__ */ jsx(
13592
- InputDynamic_default,
13593
- {
13594
- control,
13595
- disabled,
13596
- name: `owners.${index}.cargo.${cargoIndex}.commodity`,
13597
- onChange: (val) => {
13598
- const name = `owners.${index}.cargo.${cargoIndex}.commodity`;
13599
- setValue(name, val);
13600
- const updatedCargoItems = owner.cargoItems?.map(
13601
- (c, cIdx) => cIdx === cargoIndex ? {
13602
- ...c,
13603
- commodity: val
13604
- } : c
13605
- );
13606
- onUpdateOwner(owner.id, {
13607
- cargoItems: updatedCargoItems
13608
- });
13609
- setValue(
13610
- `owners.${index}.cargo.${cargoIndex}.loadType`,
13611
- ""
13612
- );
13613
- },
13614
- options: commodityOptions,
13615
- placeholder: mergedLabels.selectPlaceholder,
13616
- required: true,
13617
- type: "select",
13618
- size: "large"
13606
+ ),
13607
+ _selectedLoadType && !cargo._isAccordionOpen && /* @__PURE__ */ jsxs(Fragment, { children: [
13608
+ /* @__PURE__ */ jsxs(Body1Strong, { style: { flex: 1 }, children: [
13609
+ _selectedLoadType.name,
13610
+ " \u2022",
13611
+ " ",
13612
+ watchQuantity,
13613
+ "x",
13614
+ " ",
13615
+ _selectedLoadType.unit?.name,
13616
+ " \u2022",
13617
+ " ",
13618
+ _selectedLoadType.formattedPrice
13619
+ ] }),
13620
+ /* @__PURE__ */ jsx(
13621
+ Body1Stronger,
13622
+ {
13623
+ style: {
13624
+ color: sharedColors["Shared_Secondary_Primary"],
13625
+ minWidth: "fit-content"
13626
+ },
13627
+ children: new Intl.NumberFormat("id-ID", {
13628
+ style: "currency",
13629
+ currency: "IDR",
13630
+ minimumFractionDigits: 0
13631
+ }).format(
13632
+ Number(
13633
+ getValues(
13634
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
13635
+ ) || 0
13636
+ ) * (_selectedLoadType.price || 0)
13637
+ ).replace("Rp", "IDR")
13638
+ }
13639
+ )
13640
+ ] })
13641
+ ]
13619
13642
  }
13620
13643
  )
13621
- ] }),
13622
- /* @__PURE__ */ jsxs(Col, { md: isLoadTypeOther ? 4 : 6, children: [
13623
- /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13624
- mergedLabels.loadTypeLabel,
13625
- " ",
13626
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13644
+ }
13645
+ ),
13646
+ /* @__PURE__ */ jsx(AccordionPanel, { children: /* @__PURE__ */ jsxs("div", { className: styles.form, children: [
13647
+ /* @__PURE__ */ jsxs(Row, { children: [
13648
+ /* @__PURE__ */ jsxs(Col, { md: isLoadTypeOther ? 4 : 6, children: [
13649
+ /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13650
+ mergedLabels.commodityLabel,
13651
+ " ",
13652
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13653
+ ] }),
13654
+ /* @__PURE__ */ jsx(
13655
+ InputDynamic_default,
13656
+ {
13657
+ control,
13658
+ disabled,
13659
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.commodity`,
13660
+ onChange: (val) => {
13661
+ const name = `owners.${ownerIndex}.cargo.${cargoIndex}.commodity`;
13662
+ setValue(name, val);
13663
+ const updatedCargoItems = owner.cargoItems?.map(
13664
+ (c, cIdx) => cIdx === cargoIndex ? {
13665
+ ...c,
13666
+ commodity: val
13667
+ } : c
13668
+ );
13669
+ onUpdateOwner(owner.id, {
13670
+ cargoItems: updatedCargoItems
13671
+ });
13672
+ setValue(
13673
+ `owners.${ownerIndex}.cargo.${cargoIndex}.loadType`,
13674
+ ""
13675
+ );
13676
+ },
13677
+ options: commodityOptions,
13678
+ placeholder: mergedLabels.selectPlaceholder,
13679
+ required: true,
13680
+ type: "select",
13681
+ size: "large"
13682
+ }
13683
+ )
13627
13684
  ] }),
13628
- /* @__PURE__ */ jsx(
13629
- InputDynamic_default,
13630
- {
13631
- control,
13632
- disabled: disabled || (getValues(
13633
- `owners.${index}.cargo.${cargoIndex}.commodity`
13634
- ) || "") === "",
13635
- name: `owners.${index}.cargo.${cargoIndex}.loadType`,
13636
- onChange: (val) => {
13637
- const name = `owners.${index}.cargo.${cargoIndex}.loadType`;
13638
- setValue(name, val);
13639
- const updatedCargoItems = owner.cargoItems?.map(
13640
- (c, cIdx) => cIdx === cargoIndex ? {
13641
- ...c,
13642
- loadType: val
13643
- } : c
13644
- );
13645
- onUpdateOwner(owner.id, {
13646
- cargoItems: updatedCargoItems
13647
- });
13648
- },
13649
- options: _loadTypeOptions,
13650
- placeholder: mergedLabels.selectPlaceholder,
13651
- required: true,
13652
- size: "large",
13653
- type: "select"
13654
- }
13655
- ),
13656
- /* @__PURE__ */ jsx(
13657
- Caption1,
13658
- {
13659
- style: {
13660
- color: tokens.colorNeutralForeground3,
13661
- marginTop: "0.25rem"
13662
- },
13663
- children: mergedLabels.loadTypeHelperText
13664
- }
13665
- )
13685
+ /* @__PURE__ */ jsxs(Col, { md: isLoadTypeOther ? 4 : 6, children: [
13686
+ /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13687
+ mergedLabels.loadTypeLabel,
13688
+ " ",
13689
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13690
+ ] }),
13691
+ /* @__PURE__ */ jsx(
13692
+ InputDynamic_default,
13693
+ {
13694
+ control,
13695
+ disabled: disabled || (getValues(
13696
+ `owners.${ownerIndex}.cargo.${cargoIndex}.commodity`
13697
+ ) || "") === "",
13698
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.loadType`,
13699
+ onChange: (val) => {
13700
+ const name = `owners.${ownerIndex}.cargo.${cargoIndex}.loadType`;
13701
+ setValue(name, val);
13702
+ const updatedCargoItems = owner.cargoItems?.map(
13703
+ (c, cIdx) => cIdx === cargoIndex ? {
13704
+ ...c,
13705
+ loadType: val
13706
+ } : c
13707
+ );
13708
+ onUpdateOwner(owner.id, {
13709
+ cargoItems: updatedCargoItems
13710
+ });
13711
+ },
13712
+ options: _loadTypeOptions,
13713
+ placeholder: mergedLabels.selectPlaceholder,
13714
+ required: true,
13715
+ size: "large",
13716
+ type: "select"
13717
+ }
13718
+ ),
13719
+ /* @__PURE__ */ jsx(
13720
+ Caption1,
13721
+ {
13722
+ style: {
13723
+ color: tokens.colorNeutralForeground3,
13724
+ marginTop: "0.25rem"
13725
+ },
13726
+ children: mergedLabels.loadTypeHelperText
13727
+ }
13728
+ )
13729
+ ] }),
13730
+ isLoadTypeOther && /* @__PURE__ */ jsxs(Col, { xl: 4, children: [
13731
+ /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13732
+ mergedLabels.loadTypeOthersLabel,
13733
+ " ",
13734
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13735
+ ] }),
13736
+ /* @__PURE__ */ jsx(
13737
+ InputDynamic_default,
13738
+ {
13739
+ control,
13740
+ disabled,
13741
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.loadTypeOther`,
13742
+ placeholder: mergedLabels.loadTypeOthersPlaceholder,
13743
+ required: true,
13744
+ size: "large",
13745
+ type: "text",
13746
+ onChange: (val) => {
13747
+ setValue(
13748
+ `owners.${ownerIndex}.cargo.${cargoIndex}.loadTypeOther`,
13749
+ val
13750
+ );
13751
+ const updatedCargoItems = owner.cargoItems?.map(
13752
+ (c, cIdx) => cIdx === cargoIndex ? {
13753
+ ...c,
13754
+ loadTypeOther: val
13755
+ } : c
13756
+ );
13757
+ onUpdateOwner(owner.id, {
13758
+ cargoItems: updatedCargoItems
13759
+ });
13760
+ }
13761
+ }
13762
+ )
13763
+ ] })
13666
13764
  ] }),
13667
- isLoadTypeOther && /* @__PURE__ */ jsxs(Col, { xl: 4, children: [
13668
- /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13669
- mergedLabels.loadTypeOthersLabel,
13670
- " ",
13671
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13765
+ /* @__PURE__ */ jsxs(Row, { children: [
13766
+ /* @__PURE__ */ jsxs(Col, { md: isIndustryTypeOther ? 4 : 6, children: [
13767
+ /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13768
+ mergedLabels.industryTypeLabel,
13769
+ " ",
13770
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13771
+ ] }),
13772
+ /* @__PURE__ */ jsx(
13773
+ InputDynamic_default,
13774
+ {
13775
+ control,
13776
+ disabled,
13777
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.industryType`,
13778
+ options: industryOptions,
13779
+ onChange: (val) => {
13780
+ const name = `owners.${ownerIndex}.cargo.${cargoIndex}.industryType`;
13781
+ setValue(name, val);
13782
+ const updatedCargoItems = owner.cargoItems?.map(
13783
+ (c, cIdx) => cIdx === cargoIndex ? {
13784
+ ...c,
13785
+ industryType: val
13786
+ } : c
13787
+ );
13788
+ onUpdateOwner(owner.id, {
13789
+ cargoItems: updatedCargoItems
13790
+ });
13791
+ },
13792
+ placeholder: mergedLabels.selectPlaceholder,
13793
+ required: true,
13794
+ size: "large",
13795
+ type: "select"
13796
+ }
13797
+ ),
13798
+ /* @__PURE__ */ jsx(
13799
+ Caption1,
13800
+ {
13801
+ style: {
13802
+ color: tokens.colorNeutralForeground3,
13803
+ marginTop: "0.25rem"
13804
+ },
13805
+ children: mergedLabels.industryTypeHelperText
13806
+ }
13807
+ )
13672
13808
  ] }),
13673
- /* @__PURE__ */ jsx(
13674
- InputDynamic_default,
13675
- {
13676
- control,
13677
- disabled,
13678
- name: `owners.${index}.cargo.${cargoIndex}.loadTypeOther`,
13679
- placeholder: mergedLabels.loadTypeOthersPlaceholder,
13680
- required: true,
13681
- size: "large",
13682
- type: "text",
13683
- onChange: (val) => {
13684
- setValue(
13685
- `owners.${index}.cargo.${cargoIndex}.loadTypeOther`,
13686
- val
13687
- );
13688
- const updatedCargoItems = owner.cargoItems?.map(
13689
- (c, cIdx) => cIdx === cargoIndex ? {
13690
- ...c,
13691
- loadTypeOther: val
13692
- } : c
13693
- );
13694
- onUpdateOwner(owner.id, {
13695
- cargoItems: updatedCargoItems
13696
- });
13809
+ isIndustryTypeOther && /* @__PURE__ */ jsxs(Col, { xl: 4, children: [
13810
+ /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13811
+ mergedLabels.industryTypeOthersLabel,
13812
+ " ",
13813
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13814
+ ] }),
13815
+ /* @__PURE__ */ jsx(
13816
+ InputDynamic_default,
13817
+ {
13818
+ control,
13819
+ disabled,
13820
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.industryTypeOther`,
13821
+ placeholder: mergedLabels.industryTypeOthersPlaceholder,
13822
+ required: true,
13823
+ size: "large",
13824
+ type: "text",
13825
+ onChange: (val) => {
13826
+ setValue(
13827
+ `owners.${ownerIndex}.cargo.${cargoIndex}.industryTypeOther`,
13828
+ val
13829
+ );
13830
+ const updatedCargoItems = owner.cargoItems?.map(
13831
+ (c, cIdx) => cIdx === cargoIndex ? {
13832
+ ...c,
13833
+ industryTypeOther: val
13834
+ } : c
13835
+ );
13836
+ onUpdateOwner(owner.id, {
13837
+ cargoItems: updatedCargoItems
13838
+ });
13839
+ }
13697
13840
  }
13698
- }
13699
- )
13700
- ] })
13701
- ] }),
13702
- /* @__PURE__ */ jsxs(Row, { children: [
13703
- /* @__PURE__ */ jsxs(Col, { md: isIndustryTypeOther ? 4 : 6, children: [
13704
- /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13705
- mergedLabels.industryTypeLabel,
13706
- " ",
13707
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13841
+ )
13708
13842
  ] }),
13709
- /* @__PURE__ */ jsx(
13710
- InputDynamic_default,
13711
- {
13712
- control,
13713
- disabled,
13714
- name: `owners.${index}.cargo.${cargoIndex}.industryType`,
13715
- options: industryOptions,
13716
- onChange: (val) => {
13717
- const name = `owners.${index}.cargo.${cargoIndex}.industryType`;
13718
- setValue(name, val);
13719
- const updatedCargoItems = owner.cargoItems?.map(
13720
- (c, cIdx) => cIdx === cargoIndex ? {
13721
- ...c,
13722
- industryType: val
13723
- } : c
13724
- );
13725
- onUpdateOwner(owner.id, {
13726
- cargoItems: updatedCargoItems
13727
- });
13728
- },
13729
- placeholder: mergedLabels.selectPlaceholder,
13730
- required: true,
13731
- size: "large",
13732
- type: "select"
13733
- }
13734
- ),
13735
- /* @__PURE__ */ jsx(
13736
- Caption1,
13737
- {
13738
- style: {
13739
- color: tokens.colorNeutralForeground3,
13740
- marginTop: "0.25rem"
13741
- },
13742
- children: mergedLabels.industryTypeHelperText
13743
- }
13744
- )
13843
+ /* @__PURE__ */ jsxs(Col, { md: isIndustryTypeOther ? 4 : 6, children: [
13844
+ /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13845
+ mergedLabels.cargoCategoryLabel,
13846
+ " ",
13847
+ /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13848
+ ] }),
13849
+ /* @__PURE__ */ jsx(
13850
+ InputDynamic_default,
13851
+ {
13852
+ control,
13853
+ disabled,
13854
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.cargoCategory`,
13855
+ options: loadCategoryOptions,
13856
+ onChange: (val) => {
13857
+ const name = `owners.${ownerIndex}.cargo.${cargoIndex}.cargoCategory`;
13858
+ setValue(name, val);
13859
+ const updatedCargoItems = owner.cargoItems?.map(
13860
+ (c, cIdx) => cIdx === cargoIndex ? {
13861
+ ...c,
13862
+ cargoCategory: val
13863
+ } : c
13864
+ );
13865
+ onUpdateOwner(owner.id, {
13866
+ cargoItems: updatedCargoItems
13867
+ });
13868
+ },
13869
+ placeholder: mergedLabels.selectPlaceholder,
13870
+ required: true,
13871
+ size: "large",
13872
+ type: "select"
13873
+ }
13874
+ )
13875
+ ] })
13745
13876
  ] }),
13746
- isIndustryTypeOther && /* @__PURE__ */ jsxs(Col, { xl: 4, children: [
13747
- /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13748
- mergedLabels.industryTypeOthersLabel,
13749
- " ",
13750
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13751
- ] }),
13752
- /* @__PURE__ */ jsx(
13877
+ /* @__PURE__ */ jsxs(Row, { children: [
13878
+ /* @__PURE__ */ jsx(Col, { lg: 12, children: /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.cargoLabel }) }),
13879
+ /* @__PURE__ */ jsx(Col, { md: 12, children: /* @__PURE__ */ jsx(
13753
13880
  InputDynamic_default,
13754
13881
  {
13755
13882
  control,
13756
13883
  disabled,
13757
- name: `owners.${index}.cargo.${cargoIndex}.industryTypeOther`,
13758
- placeholder: mergedLabels.industryTypeOthersPlaceholder,
13759
- required: true,
13884
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.cargoWeight`,
13885
+ placeholder: mergedLabels.cargoWeightPlaceholder,
13760
13886
  size: "large",
13761
- type: "text",
13887
+ type: "number",
13888
+ step: "1",
13762
13889
  onChange: (val) => {
13763
13890
  setValue(
13764
- `owners.${index}.cargo.${cargoIndex}.industryTypeOther`,
13765
- val
13891
+ `owners.${ownerIndex}.cargo.${cargoIndex}.cargoWeight`,
13892
+ val ? Number(val) : 0
13766
13893
  );
13767
13894
  const updatedCargoItems = owner.cargoItems?.map(
13768
13895
  (c, cIdx) => cIdx === cargoIndex ? {
13769
13896
  ...c,
13770
- industryTypeOther: val
13771
- } : c
13772
- );
13773
- onUpdateOwner(owner.id, {
13774
- cargoItems: updatedCargoItems
13775
- });
13776
- }
13777
- }
13778
- )
13779
- ] }),
13780
- /* @__PURE__ */ jsxs(Col, { md: isIndustryTypeOther ? 4 : 6, children: [
13781
- /* @__PURE__ */ jsxs(Body1, { className: styles.label, children: [
13782
- mergedLabels.cargoCategoryLabel,
13783
- " ",
13784
- /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
13785
- ] }),
13786
- /* @__PURE__ */ jsx(
13787
- InputDynamic_default,
13788
- {
13789
- control,
13790
- disabled,
13791
- name: `owners.${index}.cargo.${cargoIndex}.cargoCategory`,
13792
- options: loadCategoryOptions,
13793
- onChange: (val) => {
13794
- const name = `owners.${index}.cargo.${cargoIndex}.cargoCategory`;
13795
- setValue(name, val);
13796
- const updatedCargoItems = owner.cargoItems?.map(
13797
- (c, cIdx) => cIdx === cargoIndex ? {
13798
- ...c,
13799
- cargoCategory: val
13897
+ cargoWeight: val ? Number(val) : 0
13800
13898
  } : c
13801
13899
  );
13802
13900
  onUpdateOwner(owner.id, {
13803
13901
  cargoItems: updatedCargoItems
13804
13902
  });
13805
13903
  },
13806
- placeholder: mergedLabels.selectPlaceholder,
13807
- required: true,
13808
- size: "large",
13809
- type: "select"
13904
+ contentAfter: /* @__PURE__ */ jsx(
13905
+ "div",
13906
+ {
13907
+ style: {
13908
+ paddingRight: "12px",
13909
+ color: tokens.colorNeutralForeground1,
13910
+ fontSize: tokens.fontSizeBase300
13911
+ },
13912
+ children: "Ton"
13913
+ }
13914
+ )
13810
13915
  }
13811
- )
13812
- ] })
13813
- ] }),
13814
- /* @__PURE__ */ jsxs(Row, { children: [
13815
- /* @__PURE__ */ jsx(Col, { lg: 12, children: /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.estimatedLooseCargoLabel }) }),
13816
- /* @__PURE__ */ jsx(Col, { md: 12, children: /* @__PURE__ */ jsx(
13817
- InputDynamic_default,
13818
- {
13819
- control,
13820
- disabled,
13821
- name: `owners.${index}.cargo.${cargoIndex}.cargoWeight`,
13822
- placeholder: mergedLabels.estimatedLooseCargoWeightPlaceholder,
13823
- size: "large",
13824
- type: "number",
13825
- step: "1",
13826
- onChange: (val) => {
13827
- setValue(
13828
- `owners.${index}.cargo.${cargoIndex}.cargoWeight`,
13829
- val ? Number(val) : 0
13830
- );
13831
- const updatedCargoItems = owner.cargoItems?.map(
13832
- (c, cIdx) => cIdx === cargoIndex ? {
13833
- ...c,
13834
- estimatedLooseCargoWeight: val ? Number(val) : 0
13835
- } : c
13836
- );
13837
- onUpdateOwner(owner.id, {
13838
- cargoItems: updatedCargoItems
13839
- });
13840
- },
13841
- contentAfter: /* @__PURE__ */ jsx(
13842
- "div",
13843
- {
13844
- style: {
13845
- paddingRight: "12px",
13846
- color: tokens.colorNeutralForeground1,
13847
- fontSize: tokens.fontSizeBase300
13848
- },
13849
- children: "Ton"
13850
- }
13851
- )
13852
- }
13853
- ) })
13854
- ] }),
13855
- (() => {
13856
- if (!_selectedLoadType) return null;
13857
- return /* @__PURE__ */ jsxs(Row, { children: [
13858
- /* @__PURE__ */ jsxs(Col, { md: 12, children: [
13859
- /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.cargoQuantityLabel }),
13860
- /* @__PURE__ */ jsxs(
13861
- "div",
13862
- {
13863
- style: {
13864
- display: "flex",
13865
- alignItems: "center",
13866
- border: `1px solid ${tokens.colorNeutralStroke1}`,
13867
- borderRadius: tokens.borderRadiusMedium,
13868
- height: "40px",
13869
- padding: "0 12px",
13870
- backgroundColor: tokens.colorNeutralBackground1
13871
- },
13872
- children: [
13873
- /* @__PURE__ */ jsx("div", { style: { flex: 0.5 } }),
13874
- /* @__PURE__ */ jsxs(
13875
- "div",
13876
- {
13877
- style: {
13878
- display: "flex",
13879
- alignItems: "center",
13880
- gap: "12px"
13881
- },
13882
- children: [
13883
- /* @__PURE__ */ jsx(
13884
- Button,
13885
- {
13886
- appearance: "transparent",
13887
- disabled,
13888
- icon: /* @__PURE__ */ jsx(
13889
- Icon,
13890
- {
13891
- icon: "fluent:subtract-circle-24-regular",
13892
- style: {
13893
- fontSize: "24px",
13894
- color: tokens.colorNeutralForeground4
13895
- }
13896
- }
13897
- ),
13898
- "aria-label": mergedLabels.decrementQuantityAriaLabel,
13899
- size: "small",
13900
- onClick: () => {
13901
- const currentVal = getValues(
13902
- `owners.${index}.cargo.${cargoIndex}.quantity`
13903
- ) || 0;
13904
- const currentQty = Number(currentVal);
13905
- if (currentQty > 1) {
13906
- const newVal = currentQty - 1;
13907
- setValue(
13908
- `owners.${index}.cargo.${cargoIndex}.quantity`,
13909
- newVal
13910
- );
13911
- onUpdateCargoQuantity(
13912
- owner.id,
13913
- cargo.id,
13914
- newVal
13915
- );
13916
- }
13917
- },
13918
- style: {
13919
- minWidth: "32px",
13920
- padding: "0"
13921
- }
13922
- }
13923
- ),
13924
- /* @__PURE__ */ jsx("div", { style: { width: "40px" }, children: /* @__PURE__ */ jsx(
13925
- Controller,
13926
- {
13927
- name: `owners.${index}.cargo.${cargoIndex}.quantity`,
13928
- control,
13929
- disabled,
13930
- render: ({ field }) => /* @__PURE__ */ jsx(
13931
- "input",
13932
- {
13933
- ...field,
13934
- min: 1,
13935
- step: "1",
13936
- type: "number",
13937
- style: {
13938
- border: "none",
13939
- width: "100%",
13940
- textAlign: "center",
13941
- outline: "none",
13942
- backgroundColor: "transparent",
13943
- color: tokens.colorNeutralForeground1,
13944
- fontSize: tokens.fontSizeBase400,
13945
- fontFamily: tokens.fontFamilyBase
13946
- },
13947
- onKeyDown: (e) => {
13948
- if ([
13949
- "e",
13950
- "E",
13951
- "+",
13952
- "-",
13953
- ".",
13954
- ","
13955
- ].includes(e.key)) {
13956
- e.preventDefault();
13957
- }
13958
- },
13959
- onPaste: (e) => {
13960
- const paste = e.clipboardData.getData(
13961
- "text"
13962
- );
13963
- if (!/^\d+$/.test(paste)) {
13964
- e.preventDefault();
13916
+ ) })
13917
+ ] }),
13918
+ (() => {
13919
+ if (!_selectedLoadType) return null;
13920
+ return /* @__PURE__ */ jsxs(Row, { children: [
13921
+ /* @__PURE__ */ jsxs(Col, { md: 12, children: [
13922
+ /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.cargoQuantityLabel }),
13923
+ /* @__PURE__ */ jsxs(
13924
+ "div",
13925
+ {
13926
+ style: {
13927
+ display: "flex",
13928
+ alignItems: "center",
13929
+ border: `1px solid ${tokens.colorNeutralStroke1}`,
13930
+ borderRadius: tokens.borderRadiusMedium,
13931
+ height: "40px",
13932
+ padding: "0 12px",
13933
+ backgroundColor: tokens.colorNeutralBackground1
13934
+ },
13935
+ children: [
13936
+ /* @__PURE__ */ jsx("div", { style: { flex: 0.5 } }),
13937
+ /* @__PURE__ */ jsxs(
13938
+ "div",
13939
+ {
13940
+ style: {
13941
+ display: "flex",
13942
+ alignItems: "center",
13943
+ gap: "12px"
13944
+ },
13945
+ children: [
13946
+ /* @__PURE__ */ jsx(
13947
+ Button,
13948
+ {
13949
+ appearance: "transparent",
13950
+ disabled,
13951
+ icon: /* @__PURE__ */ jsx(
13952
+ Icon,
13953
+ {
13954
+ icon: "fluent:subtract-circle-24-regular",
13955
+ style: {
13956
+ fontSize: "24px",
13957
+ color: tokens.colorNeutralForeground4
13965
13958
  }
13966
- },
13967
- onWheel: (e) => e.target.blur(),
13968
- onChange: (e) => {
13969
- const newVal = Number(
13970
- e.target.value
13959
+ }
13960
+ ),
13961
+ "aria-label": mergedLabels.decrementQuantityAriaLabel,
13962
+ size: "small",
13963
+ onClick: () => {
13964
+ const currentVal = getValues(
13965
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
13966
+ ) || 0;
13967
+ const currentQty = Number(currentVal);
13968
+ if (currentQty > 1) {
13969
+ const newVal = currentQty - 1;
13970
+ setValue(
13971
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`,
13972
+ newVal
13971
13973
  );
13972
- field.onChange(e);
13973
13974
  onUpdateCargoQuantity(
13974
13975
  owner.id,
13975
13976
  cargo.id,
13976
13977
  newVal
13977
13978
  );
13978
13979
  }
13980
+ },
13981
+ style: {
13982
+ minWidth: "32px",
13983
+ padding: "0"
13979
13984
  }
13980
- ),
13981
- rules: {
13982
- required: true,
13983
- validate: (val) => Number(val) > 0
13984
13985
  }
13985
- }
13986
- ) }),
13987
- /* @__PURE__ */ jsx(
13988
- Button,
13989
- {
13990
- appearance: "transparent",
13991
- disabled,
13992
- icon: /* @__PURE__ */ jsx(
13993
- Icon,
13994
- {
13995
- icon: "fluent:add-circle-24-regular",
13996
- style: {
13997
- fontSize: "24px",
13998
- color: tokens.colorBrandStroke1
13986
+ ),
13987
+ /* @__PURE__ */ jsx(
13988
+ "div",
13989
+ {
13990
+ style: { width: "40px" },
13991
+ children: /* @__PURE__ */ jsx(
13992
+ Controller,
13993
+ {
13994
+ name: `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`,
13995
+ control,
13996
+ disabled,
13997
+ render: ({ field }) => /* @__PURE__ */ jsx(
13998
+ "input",
13999
+ {
14000
+ ...field,
14001
+ min: 1,
14002
+ step: "1",
14003
+ type: "number",
14004
+ style: {
14005
+ border: "none",
14006
+ width: "100%",
14007
+ textAlign: "center",
14008
+ outline: "none",
14009
+ backgroundColor: "transparent",
14010
+ color: tokens.colorNeutralForeground1,
14011
+ fontSize: tokens.fontSizeBase400,
14012
+ fontFamily: tokens.fontFamilyBase
14013
+ },
14014
+ onKeyDown: (e) => {
14015
+ if ([
14016
+ "e",
14017
+ "E",
14018
+ "+",
14019
+ "-",
14020
+ ".",
14021
+ ","
14022
+ ].includes(e.key)) {
14023
+ e.preventDefault();
14024
+ }
14025
+ },
14026
+ onPaste: (e) => {
14027
+ const paste = e.clipboardData.getData(
14028
+ "text"
14029
+ );
14030
+ if (!/^\d+$/.test(
14031
+ paste
14032
+ )) {
14033
+ e.preventDefault();
14034
+ }
14035
+ },
14036
+ onWheel: (e) => e.target.blur(),
14037
+ onChange: (e) => {
14038
+ const newVal = Number(
14039
+ e.target.value
14040
+ );
14041
+ field.onChange(e);
14042
+ onUpdateCargoQuantity(
14043
+ owner.id,
14044
+ cargo.id,
14045
+ newVal
14046
+ );
14047
+ }
14048
+ }
14049
+ ),
14050
+ rules: {
14051
+ required: true,
14052
+ validate: (val) => Number(val) > 0
14053
+ }
13999
14054
  }
14055
+ )
14056
+ }
14057
+ ),
14058
+ /* @__PURE__ */ jsx(
14059
+ Button,
14060
+ {
14061
+ appearance: "transparent",
14062
+ disabled,
14063
+ icon: /* @__PURE__ */ jsx(
14064
+ Icon,
14065
+ {
14066
+ icon: "fluent:add-circle-24-regular",
14067
+ style: {
14068
+ fontSize: "24px",
14069
+ color: tokens.colorBrandStroke1
14070
+ }
14071
+ }
14072
+ ),
14073
+ "aria-label": mergedLabels.incrementQuantityAriaLabel,
14074
+ size: "small",
14075
+ onClick: () => {
14076
+ const currentVal = getValues(
14077
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
14078
+ ) || 0;
14079
+ const currentQty = Number(currentVal);
14080
+ const newVal = currentQty + 1;
14081
+ setValue(
14082
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`,
14083
+ newVal
14084
+ );
14085
+ onUpdateCargoQuantity(
14086
+ owner.id,
14087
+ cargo.id,
14088
+ newVal
14089
+ );
14090
+ },
14091
+ style: {
14092
+ minWidth: "32px",
14093
+ padding: "0"
14000
14094
  }
14001
- ),
14002
- "aria-label": mergedLabels.incrementQuantityAriaLabel,
14003
- size: "small",
14004
- onClick: () => {
14005
- const currentVal = getValues(
14006
- `owners.${index}.cargo.${cargoIndex}.quantity`
14007
- ) || 0;
14008
- const currentQty = Number(currentVal);
14009
- const newVal = currentQty + 1;
14010
- setValue(
14011
- `owners.${index}.cargo.${cargoIndex}.quantity`,
14012
- newVal
14013
- );
14014
- onUpdateCargoQuantity(
14015
- owner.id,
14016
- cargo.id,
14017
- newVal
14018
- );
14019
- },
14020
- style: {
14021
- minWidth: "32px",
14022
- padding: "0"
14023
14095
  }
14096
+ )
14097
+ ]
14098
+ }
14099
+ ),
14100
+ /* @__PURE__ */ jsx(
14101
+ "div",
14102
+ {
14103
+ style: {
14104
+ flex: 1,
14105
+ textAlign: "left",
14106
+ color: tokens.colorNeutralForeground1,
14107
+ fontSize: tokens.fontSizeBase300,
14108
+ paddingRight: "8px"
14109
+ },
14110
+ children: (() => {
14111
+ const selectedLoadType2 = loadTypes.find(
14112
+ (loadType) => loadType.id.toString() === watchLoadType
14113
+ );
14114
+ return selectedLoadType2?.unit?.name;
14115
+ })()
14116
+ }
14117
+ )
14118
+ ]
14119
+ }
14120
+ )
14121
+ ] }),
14122
+ /* @__PURE__ */ jsxs(Col, { md: 12, children: [
14123
+ /* @__PURE__ */ jsx("div", { style: { flex: 0.5 } }),
14124
+ /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.priceLabel }),
14125
+ /* @__PURE__ */ jsx(
14126
+ Body2,
14127
+ {
14128
+ style: { marginTop: "0.5rem" },
14129
+ children: /* @__PURE__ */ jsxs(Row, { children: [
14130
+ /* @__PURE__ */ jsx(Col, { xl: 6, children: /* @__PURE__ */ jsxs(Body1Strong, { children: [
14131
+ _selectedLoadType.name,
14132
+ " \u2022",
14133
+ " ",
14134
+ watchQuantity,
14135
+ "x",
14136
+ " ",
14137
+ _selectedLoadType.unit?.name,
14138
+ " ",
14139
+ "\u2022",
14140
+ " ",
14141
+ _selectedLoadType.formattedPrice
14142
+ ] }) }),
14143
+ /* @__PURE__ */ jsx(
14144
+ Col,
14145
+ {
14146
+ xl: 6,
14147
+ style: {
14148
+ color: sharedColors["Shared_Secondary_Primary"],
14149
+ textAlign: "right"
14150
+ },
14151
+ children: /* @__PURE__ */ jsx(Body1Stronger, { children: new Intl.NumberFormat(
14152
+ "id-ID",
14153
+ {
14154
+ style: "currency",
14155
+ currency: "IDR",
14156
+ minimumFractionDigits: 0
14024
14157
  }
14025
- )
14026
- ]
14027
- }
14028
- ),
14029
- /* @__PURE__ */ jsx(
14030
- "div",
14031
- {
14032
- style: {
14033
- flex: 1,
14034
- textAlign: "left",
14035
- color: tokens.colorNeutralForeground1,
14036
- fontSize: tokens.fontSizeBase300,
14037
- paddingRight: "8px"
14038
- },
14039
- children: (() => {
14040
- const type = watch(
14041
- `owners.${index}.cargo.${cargoIndex}.loadType`
14042
- );
14043
- const selectedLoadType2 = loadTypes.find(
14044
- (loadType) => loadType.id.toString() === type
14045
- );
14046
- return selectedLoadType2?.unit?.name;
14047
- })()
14048
- }
14049
- )
14050
- ]
14051
- }
14052
- )
14053
- ] }),
14054
- /* @__PURE__ */ jsxs(Col, { md: 12, children: [
14055
- /* @__PURE__ */ jsx("div", { style: { flex: 0.5 } }),
14056
- /* @__PURE__ */ jsx(Body1, { className: styles.label, children: mergedLabels.priceLabel }),
14057
- /* @__PURE__ */ jsx(
14058
- Body2,
14059
- {
14060
- style: { marginTop: "0.5rem" },
14061
- children: /* @__PURE__ */ jsxs(Row, { children: [
14062
- /* @__PURE__ */ jsx(Col, { xl: 6, children: /* @__PURE__ */ jsxs(Body1Strong, { children: [
14063
- _selectedLoadType.name,
14064
- " \u2022",
14065
- " ",
14066
- watchQuantity,
14067
- "x",
14068
- " ",
14069
- _selectedLoadType.unit?.name,
14070
- " ",
14071
- "\u2022",
14072
- " ",
14073
- _selectedLoadType.formattedPrice
14074
- ] }) }),
14075
- /* @__PURE__ */ jsx(
14076
- Col,
14077
- {
14078
- xl: 6,
14079
- style: {
14080
- color: sharedColors["Shared_Secondary_Primary"],
14081
- textAlign: "right"
14082
- },
14083
- children: /* @__PURE__ */ jsx(Body1Stronger, { children: new Intl.NumberFormat(
14084
- "id-ID",
14085
- {
14086
- style: "currency",
14087
- currency: "IDR",
14088
- minimumFractionDigits: 0
14089
- }
14090
- ).format(
14091
- Number(
14092
- getValues(
14093
- `owners.${index}.cargo.${cargoIndex}.quantity`
14094
- ) || 0
14095
- ) * (_selectedLoadType.price || 0)
14096
- ) })
14097
- }
14098
- )
14099
- ] })
14100
- }
14101
- )
14102
- ] })
14103
- ] });
14104
- })(),
14105
- /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx(Col, { children: (owner.cargoItems?.length || 0) > 1 && /* @__PURE__ */ jsx(
14106
- Button,
14107
- {
14108
- disabled,
14109
- icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:delete-24-regular" }),
14110
- onClick: (e) => {
14111
- e.stopPropagation();
14112
- onDeleteCargo(owner.id, cargo.id);
14113
- },
14114
- onKeyDown: (e) => {
14115
- if (e.key === "Enter" || e.key === " ") {
14158
+ ).format(
14159
+ Number(
14160
+ getValues(
14161
+ `owners.${ownerIndex}.cargo.${cargoIndex}.quantity`
14162
+ ) || 0
14163
+ ) * (_selectedLoadType.price || 0)
14164
+ ).replace("Rp", "IDR") })
14165
+ }
14166
+ )
14167
+ ] })
14168
+ }
14169
+ )
14170
+ ] })
14171
+ ] });
14172
+ })(),
14173
+ /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx(Col, { children: (owner.cargoItems?.length || 0) > 1 && /* @__PURE__ */ jsx(
14174
+ Button,
14175
+ {
14176
+ disabled,
14177
+ icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:delete-24-regular" }),
14178
+ onClick: (e) => {
14116
14179
  e.stopPropagation();
14117
14180
  onDeleteCargo(
14118
14181
  owner.id,
14119
14182
  cargo.id
14120
14183
  );
14121
- }
14122
- },
14123
- size: "medium",
14124
- shape: "circular",
14125
- style: {
14126
- border: `1px solid ${tokens.colorPaletteRedForeground1}`,
14127
- color: tokens.colorPaletteRedForeground1,
14128
- width: "100%"
14129
- },
14130
- children: mergedLabels.deleteCargoButton
14131
- }
14132
- ) }) })
14133
- ] }) })
14134
- ]
14135
- },
14136
- cargo.id
14137
- );
14138
- })
14139
- }
14140
- ),
14141
- /* @__PURE__ */ jsx(
14142
- Button,
14143
- {
14144
- appearance: "secondary",
14145
- icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:add-24-regular" }),
14146
- shape: "circular",
14147
- style: {
14148
- borderColor: tokens.colorBrandStroke1,
14149
- color: tokens.colorBrandBackground,
14150
- marginTop: "1rem",
14151
- width: "100%"
14152
- },
14153
- onClick: () => onAddCargo(owner.id),
14154
- children: mergedLabels.addCargoButton
14155
- }
14156
- )
14157
- ] }) })
14158
- ] })
14159
- ] }) })
14160
- ]
14161
- },
14162
- owner.id
14163
- ))
14184
+ },
14185
+ onKeyDown: (e) => {
14186
+ if (e.key === "Enter" || e.key === " ") {
14187
+ e.stopPropagation();
14188
+ onDeleteCargo(
14189
+ owner.id,
14190
+ cargo.id
14191
+ );
14192
+ }
14193
+ },
14194
+ size: "medium",
14195
+ shape: "circular",
14196
+ style: {
14197
+ border: `1px solid ${tokens.colorPaletteRedForeground1}`,
14198
+ color: tokens.colorPaletteRedForeground1,
14199
+ width: "100%"
14200
+ },
14201
+ children: mergedLabels.deleteCargoButton
14202
+ }
14203
+ ) }) })
14204
+ ] }) })
14205
+ ]
14206
+ },
14207
+ cargo.id
14208
+ );
14209
+ })
14210
+ }
14211
+ ),
14212
+ /* @__PURE__ */ jsx(
14213
+ Button,
14214
+ {
14215
+ appearance: "secondary",
14216
+ icon: /* @__PURE__ */ jsx(Icon, { icon: "fluent:add-24-regular" }),
14217
+ shape: "circular",
14218
+ style: {
14219
+ borderColor: tokens.colorBrandStroke1,
14220
+ color: tokens.colorBrandBackground,
14221
+ marginTop: "1rem",
14222
+ width: "100%"
14223
+ },
14224
+ onClick: () => onAddCargo(owner.id),
14225
+ children: mergedLabels.addCargoButton
14226
+ }
14227
+ )
14228
+ ] }) })
14229
+ ] })
14230
+ ] }) })
14231
+ ]
14232
+ },
14233
+ owner.id
14234
+ )
14235
+ ] }, owner.id))
14164
14236
  }
14165
14237
  )
14166
14238
  ] });