@movalib/movalib-commons 1.0.63 → 1.0.65

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.
@@ -7,6 +7,7 @@ interface VehicleFullCardProps {
7
7
  onUploadDocument: (data: FormData) => void;
8
8
  onDeleteDocument: (documentId: string) => void;
9
9
  editMode: boolean;
10
+ fullwidth?: boolean;
10
11
  focused?: boolean;
11
12
  onUpdate?: (form: MovaVehicleForm) => void;
12
13
  onDelete?: () => void;
@@ -23,7 +23,6 @@ var ConfirmationDialog_1 = __importDefault(require("./ConfirmationDialog"));
23
23
  var Enums_1 = require("./helpers/Enums");
24
24
  var Tools_1 = require("./helpers/Tools");
25
25
  var MovaDigitalPassport_1 = __importDefault(require("./MovaDigitalPassport"));
26
- var Loader_1 = __importDefault(require("./Loader"));
27
26
  var DateUtils_1 = require("./helpers/DateUtils");
28
27
  var CloseRounded_1 = __importDefault(require("@mui/icons-material/CloseRounded"));
29
28
  var EditRounded_1 = __importDefault(require("@mui/icons-material/EditRounded"));
@@ -39,19 +38,21 @@ var initialUserFormState = {
39
38
  tireSpeedIndex: { value: '', isValid: true }
40
39
  };
41
40
  var VehicleFullCard = function (_a) {
42
- var vehicle = _a.vehicle, onError = _a.onError, onUploadDocument = _a.onUploadDocument, onDeleteDocument = _a.onDeleteDocument, _b = _a.editMode, editMode = _b === void 0 ? false : _b, _c = _a.focused, focused = _c === void 0 ? false : _c, onUpdate = _a.onUpdate, onDelete = _a.onDelete;
41
+ var _b, _c;
42
+ var vehicle = _a.vehicle, fullwidth = _a.fullwidth, onError = _a.onError, onUploadDocument = _a.onUploadDocument, onDeleteDocument = _a.onDeleteDocument, _d = _a.editMode, editMode = _d === void 0 ? false : _d, _e = _a.focused, focused = _e === void 0 ? false : _e, onUpdate = _a.onUpdate, onDelete = _a.onDelete;
43
43
  var theme = (0, material_1.useTheme)();
44
- var _d = (0, react_1.useState)(false), loading = _d[0], setLoading = _d[1];
45
- var _e = (0, react_1.useState)(editMode), localEditMode = _e[0], setLocalEditMode = _e[1];
46
- var _f = (0, react_1.useState)(false), openConfirmDocumentDelete = _f[0], setOpenConfirmDocumentDelete = _f[1];
47
- var _g = (0, react_1.useState)(false), openConfirmVehicleDelete = _g[0], setOpenConfirmVehicleDelete = _g[1];
48
- var _h = (0, react_1.useState)(''), documentToDelete = _h[0], setDocumentToDelete = _h[1];
44
+ var _f = (0, react_1.useState)(editMode), localEditMode = _f[0], setLocalEditMode = _f[1];
45
+ var _g = (0, react_1.useState)(false), openConfirmDocumentDelete = _g[0], setOpenConfirmDocumentDelete = _g[1];
46
+ var _h = (0, react_1.useState)(false), openConfirmVehicleDelete = _h[0], setOpenConfirmVehicleDelete = _h[1];
47
+ var _j = (0, react_1.useState)(''), documentToDelete = _j[0], setDocumentToDelete = _j[1];
49
48
  // Formulaire utilisé pour les modifications d'informations sur le véhicule
50
- var _j = (0, react_1.useState)(initialUserFormState), form = _j[0], setForm = _j[1];
51
- var _k = (0, react_1.useState)([]), vehicleDocuments = _k[0], setVehicleDocuments = _k[1];
49
+ var _k = (0, react_1.useState)(initialUserFormState), form = _k[0], setForm = _k[1];
52
50
  // Références aux éventuels documents uploadés depuis la fiche
53
51
  var invoiceInputRef = (0, react_1.useRef)(null);
54
52
  var tirePictureInputRef = (0, react_1.useRef)(null);
53
+ (0, react_1.useEffect)(function () {
54
+ setLocalEditMode(editMode);
55
+ }, [editMode]);
55
56
  (0, react_1.useEffect)(function () {
56
57
  initForm();
57
58
  }, [vehicle]);
@@ -157,7 +158,6 @@ var VehicleFullCard = function (_a) {
157
158
  };
158
159
  var handleOnClickValidate = function () {
159
160
  if (validateForm()) {
160
- setLoading(true);
161
161
  Logger_1.default.info(form.tireSize.value);
162
162
  var query = {
163
163
  currentMileage: form.currentMileage.value,
@@ -203,7 +203,7 @@ var VehicleFullCard = function (_a) {
203
203
  }
204
204
  };
205
205
  return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [vehicle &&
206
- (0, jsx_runtime_1.jsxs)(material_1.Card, __assign({ variant: 'outlined', sx: { maxWidth: 345,
206
+ (0, jsx_runtime_1.jsxs)(material_1.Card, __assign({ variant: 'outlined', sx: { maxWidth: fullwidth ? '80%' : 345,
207
207
  backgroundColor: focused ? theme.palette.primary.light : 'white',
208
208
  overflow: 'visible', mt: 4, pb: 1 } }, { children: [(0, jsx_runtime_1.jsx)("img", { src: car_figure_png_1.default, style: {
209
209
  position: 'relative',
@@ -217,9 +217,9 @@ var VehicleFullCard = function (_a) {
217
217
  '& input': { textTransform: 'uppercase' } // CSS pour forcer les majuscules dans l'input
218
218
  }, helperText: Boolean(form.currentMileage.error && form.currentMileage.value > 0)
219
219
  ? form.currentMileage.error : "Sur ton tableau de bord 😉" }) })), !localEditMode && (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, textAlign: 'justify', sx: { pt: 2 } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 8 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: "body1", color: "text.secondary" }, { children: "Km moyen annuel :" })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 4, sx: { textAlign: 'right' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: "body1", color: "text.secondary" }, { children: (0, jsx_runtime_1.jsxs)("b", { children: [vehicle.averageMileagePerYear, " km"] }) })) }))] })), localEditMode && (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, __assign({ fullWidth: true, margin: "normal", error: Boolean(form.averageMileagePerYear.error) }, { children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, __assign({ id: "averageMileagePerYear-label" }, { children: "Kilom\u00E9trage moyen annuel" })), (0, jsx_runtime_1.jsxs)(material_1.Select, __assign({ labelId: "averageMileagePerYear-label", id: "averageMileagePerYear", name: "averageMileagePerYear", value: form.averageMileagePerYear.value ?
220
- String(form.averageMileagePerYear.value) : '', onChange: function (e) { return handleSelectChange(e); }, label: "Kilom\u00E9trage moyen annuel" }, { children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 5000 }, { children: "5 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 10000 }, { children: "10 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 15000 }, { children: "15 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 20000 }, { children: "20 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 25000 }, { children: "25 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 30000 }, { children: "30 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 50000 }, { children: "50 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 75000 }, { children: "75 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 100000 }, { children: "100 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 999999 }, { children: "+100 000" }))] })), (0, jsx_runtime_1.jsx)(material_1.FormHelperText, { children: form.averageMileagePerYear.error })] })) })), !localEditMode && (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, textAlign: 'justify', sx: { pt: 2 } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: "body1", color: "text.secondary" }, { children: "Pneumatiques :" })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 6, sx: { textAlign: 'right' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: "body1", color: "text.secondary" }, { children: isVehicleTireSizeDefined(vehicle) ? (0, jsx_runtime_1.jsx)("b", { children: (0, Tools_1.formatVehicleTire)(vehicle.tireSize) }) : '-' })) }))] })), localEditMode && (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12, sx: { mt: 1 } }, { children: (0, jsx_runtime_1.jsx)(MovaVehicleTireField_1.default, { vehicleTire: form.tireSize.value, onChangeVehicleTire: handleOnChangeVehicleTire }) }))] })), !localEditMode && (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: "h6", component: "div", align: "center", sx: { mt: 3, mb: 1 }, color: (0, material_1.darken)(theme.palette.primary.main, 0.2) }, { children: "CARNET DU V\u00C9HICULE" })) })), vehicleDocuments && (vehicleDocuments === null || vehicleDocuments === void 0 ? void 0 : vehicleDocuments.filter(function (doc) { return doc.type === Enums_1.DocumentType.VEHICLE_MAINTENANCE_INVOICE; }).map(function (invoice, index) { return ((0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, sx: { justifyContent: 'center', alignItems: 'center' } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 11, sm: 6, md: 4, sx: { textAlign: 'left' } }, { children: (0, jsx_runtime_1.jsxs)(material_1.Link, __assign({ color: (0, material_1.darken)('#F29ABA', 0.2), href: invoice.fileSignedUrl, target: "_blank", rel: "noopener" }, { children: ["Facture du ", (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, DateUtils_1.formatDateByCountryCode)(invoice.creationDate, 'fr', Enums_1.DateFormatTypes.SHORT_FORMAT_DATE) })] })) }), (index + 1) * 50), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 1, sm: 1, md: 1, sx: { textAlign: 'right' } }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, __assign({ onClick: function (e) { return handleDeleteDocument(e, invoice.id); } }, { children: (0, jsx_runtime_1.jsx)(CloseRounded_2.default, {}) })) }), (index + 1) * 100)] }), index + 1)); })), vehicleDocuments && (vehicleDocuments === null || vehicleDocuments === void 0 ? void 0 : vehicleDocuments.filter(function (doc) { return doc.type === Enums_1.DocumentType.VEHICLE_TIRE_PHOTO; }).map(function (tirePhoto, index) { return ((0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, sx: { justifyContent: 'center', alignItems: 'center' } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 11, sm: 6, md: 4, sx: { textAlign: 'left' } }, { children: (0, jsx_runtime_1.jsxs)(material_1.Link, __assign({ color: (0, material_1.darken)('#F29ABA', 0.2), href: tirePhoto.fileSignedUrl, target: "_blank", rel: "noopener" }, { children: ["Photo pneu du ", (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, DateUtils_1.formatDateByCountryCode)(tirePhoto.creationDate, 'fr', Enums_1.DateFormatTypes.SHORT_FORMAT_DATE) })] })) }), (index + 1) * 50), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 1, sm: 1, md: 1, sx: { textAlign: 'right' } }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, __assign({ onClick: function (e) { return handleDeleteDocument(e, tirePhoto.id); } }, { children: (0, jsx_runtime_1.jsx)(CloseRounded_2.default, {}) })) }), (index + 1) * 100)] }), index + 1)); })), (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 6, sm: 6, md: 4, sx: { mt: 2 } }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("input", { accept: "image/*, application/pdf", type: "file", style: { display: 'none' }, ref: invoiceInputRef, id: "raised-button-invoice", onChange: function (e) { return handleFileChange(e, Enums_1.DocumentType.VEHICLE_MAINTENANCE_INVOICE); } }), (0, jsx_runtime_1.jsx)("label", __assign({ htmlFor: "raised-button-invoice" }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, __assign({ size: 'large', component: "span", variant: "outlined", sx: { alignItems: 'normal', width: '90%', mt: 2, mb: 1, height: '70px', p: 1,
221
- color: (0, material_1.darken)(theme.palette.primary.main, 0.2) } }, { children: "Ajouter Facture" })) }))] }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 6, sm: 6, md: 4, sx: { mt: 2 } }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("input", { accept: "image/*", type: "file", style: { display: 'none' }, ref: tirePictureInputRef, id: "raised-button-tire", onChange: function (e) { return handleFileChange(e, Enums_1.DocumentType.VEHICLE_TIRE_PHOTO); } }), (0, jsx_runtime_1.jsx)("label", __assign({ htmlFor: "raised-button-tire" }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, __assign({ component: "span", size: 'large', variant: "outlined", sx: { alignItems: 'normal', width: '90%', mt: 2, mb: 1, height: '70px', p: 1,
222
- color: (0, material_1.darken)(theme.palette.primary.main, 0.2) } }, { children: "Ajouter Photo Pneu" })) }))] }) }))] }))] })] })), (0, jsx_runtime_1.jsx)(Loader_1.default, { loading: loading }), (0, jsx_runtime_1.jsxs)(material_1.CardActions, __assign({ sx: { mt: 3, justifyContent: localEditMode ? 'center' : 'end' } }, { children: [!localEditMode &&
220
+ String(form.averageMileagePerYear.value) : '', onChange: function (e) { return handleSelectChange(e); }, label: "Kilom\u00E9trage moyen annuel" }, { children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 5000 }, { children: "5 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 10000 }, { children: "10 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 15000 }, { children: "15 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 20000 }, { children: "20 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 25000 }, { children: "25 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 30000 }, { children: "30 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 50000 }, { children: "50 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 75000 }, { children: "75 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 100000 }, { children: "100 000" })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({ value: 999999 }, { children: "+100 000" }))] })), (0, jsx_runtime_1.jsx)(material_1.FormHelperText, { children: form.averageMileagePerYear.error })] })) })), !localEditMode && (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, textAlign: 'justify', sx: { pt: 2 } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 6 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: "body1", color: "text.secondary" }, { children: "Pneumatiques :" })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 6, sx: { textAlign: 'right' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: "body1", color: "text.secondary" }, { children: isVehicleTireSizeDefined(vehicle) ? (0, jsx_runtime_1.jsx)("b", { children: (0, Tools_1.formatVehicleTire)(vehicle.tireSize) }) : '-' })) }))] })), localEditMode && (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12, sx: { mt: 1 } }, { children: (0, jsx_runtime_1.jsx)(MovaVehicleTireField_1.default, { vehicleTire: form.tireSize.value, onChangeVehicleTire: handleOnChangeVehicleTire }) }))] })), !localEditMode && (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: "h6", component: "div", align: "center", sx: { mt: 3, mb: 1 }, color: (0, material_1.darken)(theme.palette.primary.main, 0.2) }, { children: "CARNET DU V\u00C9HICULE" })) })), vehicle.documents && ((_b = vehicle.documents) === null || _b === void 0 ? void 0 : _b.filter(function (doc) { return doc.type === Enums_1.DocumentType.VEHICLE_MAINTENANCE_INVOICE; }).map(function (invoice, index) { return ((0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, sx: { justifyContent: 'center', alignItems: 'center' } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 11, sm: 6, md: 4, sx: { textAlign: 'left' } }, { children: (0, jsx_runtime_1.jsxs)(material_1.Link, __assign({ color: (0, material_1.darken)('#F29ABA', 0.2), href: invoice.fileSignedUrl, target: "_blank", rel: "noopener" }, { children: ["Facture du ", (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, DateUtils_1.formatDateByCountryCode)(invoice.creationDate, 'fr', Enums_1.DateFormatTypes.SHORT_FORMAT_DATE) })] })) }), (index + 1) * 50), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 1, sm: 1, md: 1, sx: { textAlign: 'right' } }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, __assign({ onClick: function (e) { return handleDeleteDocument(e, invoice.id); } }, { children: (0, jsx_runtime_1.jsx)(CloseRounded_2.default, {}) })) }), (index + 1) * 100)] }), index + 1)); })), vehicle.documents && ((_c = vehicle.documents) === null || _c === void 0 ? void 0 : _c.filter(function (doc) { return doc.type === Enums_1.DocumentType.VEHICLE_TIRE_PHOTO; }).map(function (tirePhoto, index) { return ((0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true, sx: { justifyContent: 'center', alignItems: 'center' } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 11, sm: 6, md: 4, sx: { textAlign: 'left' } }, { children: (0, jsx_runtime_1.jsxs)(material_1.Link, __assign({ color: (0, material_1.darken)('#F29ABA', 0.2), href: tirePhoto.fileSignedUrl, target: "_blank", rel: "noopener" }, { children: ["Photo pneu du ", (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, DateUtils_1.formatDateByCountryCode)(tirePhoto.creationDate, 'fr', Enums_1.DateFormatTypes.SHORT_FORMAT_DATE) })] })) }), (index + 1) * 50), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 1, sm: 1, md: 1, sx: { textAlign: 'right' } }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, __assign({ onClick: function (e) { return handleDeleteDocument(e, tirePhoto.id); } }, { children: (0, jsx_runtime_1.jsx)(CloseRounded_2.default, {}) })) }), (index + 1) * 100)] }), index + 1)); })), (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 6, sx: { mt: 2 } }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("input", { accept: "image/*, application/pdf", type: "file", style: { display: 'none' }, ref: invoiceInputRef, id: "raised-button-invoice", onChange: function (e) { return handleFileChange(e, Enums_1.DocumentType.VEHICLE_MAINTENANCE_INVOICE); } }), (0, jsx_runtime_1.jsx)("label", __assign({ htmlFor: "raised-button-invoice" }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, __assign({ size: 'large', component: "span", variant: "outlined", sx: { alignItems: 'normal', width: '90%', mt: 2, mb: 1, height: '70px', p: 1,
221
+ color: (0, material_1.darken)(theme.palette.primary.main, 0.2) } }, { children: "Ajouter Facture" })) }))] }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 6, sx: { mt: 2, textAlign: 'center' } }, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("input", { accept: "image/*", type: "file", style: { display: 'none' }, ref: tirePictureInputRef, id: "raised-button-tire", onChange: function (e) { return handleFileChange(e, Enums_1.DocumentType.VEHICLE_TIRE_PHOTO); } }), (0, jsx_runtime_1.jsx)("label", __assign({ htmlFor: "raised-button-tire" }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, __assign({ component: "span", variant: "outlined", sx: { alignItems: 'normal', width: '90%', mt: 2, mb: 1, height: '70px', p: 1,
222
+ color: (0, material_1.darken)(theme.palette.primary.main, 0.2) } }, { children: "Ajouter Photo Pneu" })) }))] }) }))] }))] })] })), (0, jsx_runtime_1.jsxs)(material_1.CardActions, __assign({ sx: { mt: 3, justifyContent: localEditMode ? 'center' : 'end' } }, { children: [!localEditMode &&
223
223
  (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(material_1.Button, __assign({ onClick: handleOnClickEdit, color: "inherit", sx: { width: '45%' }, variant: 'text' }, { children: [(0, jsx_runtime_1.jsx)(EditRounded_1.default, { sx: { mr: 1 } }), "MODIFIER"] })) }), localEditMode &&
224
224
  (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Button, __assign({ onClick: handleOnClickCancel, sx: { width: '45%', color: theme.palette.text.secondary }, variant: 'text' }, { children: [(0, jsx_runtime_1.jsx)(CloseRounded_1.default, { sx: { mr: 1 } }), "ANNULER"] })), (0, jsx_runtime_1.jsxs)(material_1.Button, __assign({ onClick: handleOnClickValidate, sx: { width: '45%', color: (0, material_1.darken)(theme.palette.primary.main, 0.2) }, variant: 'text' }, { children: [(0, jsx_runtime_1.jsx)(EditRounded_1.default, { sx: { mr: 1 } }), "VALIDER"] }))] })] }))] })), localEditMode && onDelete &&
225
225
  (0, jsx_runtime_1.jsx)(material_1.Button, __assign({ onClick: function (e) { return handleOnClickDeleteVehicle(e); }, sx: { width: '90', mt: 4, color: theme.palette.error.light,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@movalib/movalib-commons",
3
- "version": "1.0.63",
3
+ "version": "1.0.65",
4
4
  "description": "Bibliothèque d'objets communs à l'ensemble des projets React de Movalib",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -24,6 +24,7 @@ interface VehicleFullCardProps {
24
24
  onUploadDocument: (data: FormData) => void,
25
25
  onDeleteDocument: (documentId: string) => void,
26
26
  editMode: boolean,
27
+ fullwidth?: boolean,
27
28
  focused?: boolean,
28
29
  onUpdate?: (form: MovaVehicleForm) => void,
29
30
  onDelete?: () => void;
@@ -39,21 +40,23 @@ const initialUserFormState = {
39
40
  tireSpeedIndex: { value: '', isValid: true }
40
41
  }
41
42
 
42
- const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadDocument, onDeleteDocument, editMode = false, focused = false, onUpdate, onDelete }) => {
43
+ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, fullwidth, onError, onUploadDocument, onDeleteDocument, editMode = false, focused = false, onUpdate, onDelete }) => {
43
44
 
44
45
  const theme = useTheme();
45
- const [loading, setLoading] = useState(false);
46
46
  const [localEditMode, setLocalEditMode] = useState(editMode);
47
47
  const [openConfirmDocumentDelete, setOpenConfirmDocumentDelete] = useState(false);
48
48
  const [openConfirmVehicleDelete, setOpenConfirmVehicleDelete] = useState(false);
49
49
  const [documentToDelete, setDocumentToDelete] = useState('');
50
50
  // Formulaire utilisé pour les modifications d'informations sur le véhicule
51
51
  const [form, setForm] = useState<MovaVehicleForm>(initialUserFormState);
52
- const [vehicleDocuments, setVehicleDocuments] = useState<Document[]>([]);
53
52
  // Références aux éventuels documents uploadés depuis la fiche
54
53
  const invoiceInputRef = useRef(null);
55
54
  const tirePictureInputRef = useRef(null);
56
55
 
56
+ useEffect(() => {
57
+ setLocalEditMode(editMode);
58
+ }, [editMode]);
59
+
57
60
  useEffect(() => {
58
61
  initForm();
59
62
  }, [vehicle]);
@@ -170,7 +173,6 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadD
170
173
  const handleOnClickValidate = () => {
171
174
 
172
175
  if(validateForm()) {
173
- setLoading (true);
174
176
 
175
177
  Logger.info(form.tireSize.value);
176
178
 
@@ -231,7 +233,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadD
231
233
  return (
232
234
  <>
233
235
  { vehicle &&
234
- <Card variant='outlined' sx={{ maxWidth: 345,
236
+ <Card variant='outlined' sx={{ maxWidth: fullwidth ? '80%' : 345,
235
237
  backgroundColor: focused ? theme.palette.primary.light : 'white',
236
238
  overflow: 'visible', mt: 4, pb: 1 }}
237
239
  >
@@ -363,7 +365,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadD
363
365
  </Grid>
364
366
 
365
367
  {/** Les FACTURES du véhicule */}
366
- {vehicleDocuments && vehicleDocuments?.filter(doc => doc.type === DocumentType.VEHICLE_MAINTENANCE_INVOICE)
368
+ {vehicle.documents && vehicle.documents?.filter(doc => doc.type === DocumentType.VEHICLE_MAINTENANCE_INVOICE)
367
369
  .map((invoice, index) => (
368
370
  <Grid container sx={{ justifyContent: 'center', alignItems: 'center' }} key={index+1}>
369
371
  <Grid item xs={11} sm={6} md={4} key={(index+1)*50} sx={{ textAlign: 'left' }} >
@@ -380,7 +382,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadD
380
382
  ))}
381
383
 
382
384
  {/** Les PHOTOS du véhicule */}
383
- {vehicleDocuments && vehicleDocuments?.filter(doc => doc.type === DocumentType.VEHICLE_TIRE_PHOTO)
385
+ {vehicle.documents && vehicle.documents?.filter(doc => doc.type === DocumentType.VEHICLE_TIRE_PHOTO)
384
386
  .map((tirePhoto, index) => (
385
387
  <Grid container sx={{ justifyContent: 'center', alignItems: 'center' }} key={index+1}>
386
388
  <Grid item xs={11} sm={6} md={4} key={(index+1)*50} sx={{ textAlign: 'left' }} >
@@ -397,7 +399,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadD
397
399
  ))}
398
400
 
399
401
  <Grid container >
400
- <Grid item xs={6} sm={6} md={4} sx={{ mt: 2 }} >
402
+ <Grid item xs={6} sx={{ mt: 2 }} >
401
403
  {/* Input caché de type "file" */}
402
404
  <div>
403
405
  <input
@@ -418,7 +420,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadD
418
420
  </div>
419
421
  </Grid>
420
422
 
421
- <Grid item xs={6} sm={6} md={4} sx={{ mt: 2 }} >
423
+ <Grid item xs={6} sx={{ mt: 2, textAlign: 'center' }} >
422
424
  {/* Input caché de type "file" */}
423
425
  <div>
424
426
  <input
@@ -430,7 +432,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadD
430
432
  onChange={(e) => handleFileChange(e, DocumentType.VEHICLE_TIRE_PHOTO)}
431
433
  />
432
434
  <label htmlFor="raised-button-tire">
433
- <Button component="span" size='large' variant="outlined"
435
+ <Button component="span" variant="outlined"
434
436
  sx={{ alignItems: 'normal', width:'90%', mt: 2, mb: 1, height: '70px', p:1,
435
437
  color:darken(theme.palette.primary.main, 0.2) }}>
436
438
  Ajouter Photo Pneu
@@ -445,8 +447,6 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, onError, onUploadD
445
447
 
446
448
  </CardContent>
447
449
 
448
- <Loader loading={loading} />
449
-
450
450
  <CardActions sx={{ mt: 3, justifyContent: localEditMode ? 'center' : 'end' }}>
451
451
  {!localEditMode &&
452
452
  <>