@movalib/movalib-commons 1.0.64 → 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.
|
@@ -38,18 +38,21 @@ var initialUserFormState = {
|
|
|
38
38
|
tireSpeedIndex: { value: '', isValid: true }
|
|
39
39
|
};
|
|
40
40
|
var VehicleFullCard = function (_a) {
|
|
41
|
-
var
|
|
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;
|
|
42
43
|
var theme = (0, material_1.useTheme)();
|
|
43
|
-
var
|
|
44
|
-
var
|
|
45
|
-
var
|
|
46
|
-
var
|
|
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];
|
|
47
48
|
// Formulaire utilisé pour les modifications d'informations sur le véhicule
|
|
48
|
-
var
|
|
49
|
-
var _j = (0, react_1.useState)([]), vehicleDocuments = _j[0], setVehicleDocuments = _j[1];
|
|
49
|
+
var _k = (0, react_1.useState)(initialUserFormState), form = _k[0], setForm = _k[1];
|
|
50
50
|
// Références aux éventuels documents uploadés depuis la fiche
|
|
51
51
|
var invoiceInputRef = (0, react_1.useRef)(null);
|
|
52
52
|
var tirePictureInputRef = (0, react_1.useRef)(null);
|
|
53
|
+
(0, react_1.useEffect)(function () {
|
|
54
|
+
setLocalEditMode(editMode);
|
|
55
|
+
}, [editMode]);
|
|
53
56
|
(0, react_1.useEffect)(function () {
|
|
54
57
|
initForm();
|
|
55
58
|
}, [vehicle]);
|
|
@@ -214,8 +217,8 @@ var VehicleFullCard = function (_a) {
|
|
|
214
217
|
'& input': { textTransform: 'uppercase' } // CSS pour forcer les majuscules dans l'input
|
|
215
218
|
}, helperText: Boolean(form.currentMileage.error && form.currentMileage.value > 0)
|
|
216
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 ?
|
|
217
|
-
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" })) })),
|
|
218
|
-
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 } }, { 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",
|
|
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,
|
|
219
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 &&
|
|
220
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 &&
|
|
221
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 &&
|
package/package.json
CHANGED
package/src/VehicleFullCard.tsx
CHANGED
|
@@ -49,11 +49,14 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, fullwidth, onError
|
|
|
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]);
|
|
@@ -362,7 +365,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, fullwidth, onError
|
|
|
362
365
|
</Grid>
|
|
363
366
|
|
|
364
367
|
{/** Les FACTURES du véhicule */}
|
|
365
|
-
{
|
|
368
|
+
{vehicle.documents && vehicle.documents?.filter(doc => doc.type === DocumentType.VEHICLE_MAINTENANCE_INVOICE)
|
|
366
369
|
.map((invoice, index) => (
|
|
367
370
|
<Grid container sx={{ justifyContent: 'center', alignItems: 'center' }} key={index+1}>
|
|
368
371
|
<Grid item xs={11} sm={6} md={4} key={(index+1)*50} sx={{ textAlign: 'left' }} >
|
|
@@ -379,7 +382,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, fullwidth, onError
|
|
|
379
382
|
))}
|
|
380
383
|
|
|
381
384
|
{/** Les PHOTOS du véhicule */}
|
|
382
|
-
{
|
|
385
|
+
{vehicle.documents && vehicle.documents?.filter(doc => doc.type === DocumentType.VEHICLE_TIRE_PHOTO)
|
|
383
386
|
.map((tirePhoto, index) => (
|
|
384
387
|
<Grid container sx={{ justifyContent: 'center', alignItems: 'center' }} key={index+1}>
|
|
385
388
|
<Grid item xs={11} sm={6} md={4} key={(index+1)*50} sx={{ textAlign: 'left' }} >
|
|
@@ -417,7 +420,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, fullwidth, onError
|
|
|
417
420
|
</div>
|
|
418
421
|
</Grid>
|
|
419
422
|
|
|
420
|
-
<Grid item xs={6} sx={{ mt: 2 }} >
|
|
423
|
+
<Grid item xs={6} sx={{ mt: 2, textAlign: 'center' }} >
|
|
421
424
|
{/* Input caché de type "file" */}
|
|
422
425
|
<div>
|
|
423
426
|
<input
|
|
@@ -429,7 +432,7 @@ const VehicleFullCard: FC<VehicleFullCardProps> = ({ vehicle, fullwidth, onError
|
|
|
429
432
|
onChange={(e) => handleFileChange(e, DocumentType.VEHICLE_TIRE_PHOTO)}
|
|
430
433
|
/>
|
|
431
434
|
<label htmlFor="raised-button-tire">
|
|
432
|
-
<Button component="span"
|
|
435
|
+
<Button component="span" variant="outlined"
|
|
433
436
|
sx={{ alignItems: 'normal', width:'90%', mt: 2, mb: 1, height: '70px', p:1,
|
|
434
437
|
color:darken(theme.palette.primary.main, 0.2) }}>
|
|
435
438
|
Ajouter Photo Pneu
|