diff --git a/src/components/Apprenant.js b/src/components/Apprenant.js index 99a7884..91fc2be 100644 --- a/src/components/Apprenant.js +++ b/src/components/Apprenant.js @@ -53,6 +53,13 @@ import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5"; import { gridClasses } from '@mui/x-data-grid'; import Link from '@mui/material/Link'; import { PiDotsThree } from "react-icons/pi"; +import { + GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton, + GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, + gridFilteredSortedRowIdsSelector, + gridVisibleColumnFieldsSelector, + } from '@mui/x-data-grid'; + import * as XLSX from 'xlsx'; const Apprenant = (props) => { @@ -116,8 +123,8 @@ const Apprenant = (props) => { const columns = [ - { field: 'id', headerName: 'id', hide: true }, - { field: '_id', headerName: '_id', hide: true }, + { field: 'id', headerName: 'id', hide: true , disableExport: true,}, + { field: '_id', headerName: '_id', hide: true , disableExport: true,}, { field: 'civilite', headerName: 'Civ.', minWidth: 100, flex: 1, maxWidth: 100, hide: false, editable: false, editable: false, @@ -156,7 +163,7 @@ const Apprenant = (props) => { { - field: "Detail", headerName: 'Voir détail', + field: "Detail", headerName: 'Voir détail', disableExport: true, renderCell: (cellValues) => { return ( @@ -176,7 +183,7 @@ const Apprenant = (props) => { }, { - field: "delete", headerName: 'Supprimer', + field: "delete", headerName: 'Supprimer', disableExport: true, renderCell: (cellValues) => { return ( @@ -4822,6 +4829,115 @@ const Apprenant = (props) => { } + +// DEBUT EXPORT EXCEL DATAGRID + +function CustomToolbar(props) { + + console.log(" my props = ", props); + + return ( + + + + + + + + + + + ); +} + +function getExcelData(apiRef) { + // Select rows and columns + const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef); + const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef); + + // Format the data. Here we only keep the value + const data = filteredSortedRowIds.map((id) => { + const row = {}; + visibleColumnsField.forEach((field) => { + row[field] = apiRef.current.getCellParams(id, field).value; + }); + return row; + }); + + return data; +} + + +function ExportButton(props) { + return ( + + + + ); +} + +function handleExport(apiRef, data_colums) { + const data = getExcelData(apiRef); + + const local_config = { + keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { + if (mydata.field) + return mydata.field; + else + return ""; + }), + + + columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { + if (mydata.headerName) + return mydata.headerName; + else + return ""; + }), + + fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', + sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), + }; + + const rows = data.map((row) => { + const mRow = {}; + for (const key of local_config.keys) { + mRow[key] = row[key]; + } + return mRow; + }); + + const worksheet = XLSX.utils.json_to_sheet(rows); + XLSX.utils.sheet_add_aoa(worksheet, [[...local_config.columnNames]], { + origin: 'A1', + }); + + const workbook = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(workbook, worksheet, local_config.sheetName); + XLSX.writeFile(workbook, local_config.fileName, { compression: true }); +} + +function ExportMenuItem(props) { + const apiRef = useGridApiContext(); + const { hideMenu } = props; + + return ( + { + handleExport(apiRef, props.data_colums); + // Hide the export menu after the export + hideMenu?.(); + }} + > + Export Excel + + ); +} + +// FIN EXPORT EXCEL DATAGRID + return (
@@ -5865,6 +5981,11 @@ const Apprenant = (props) => { { setSelectionModel(newSelectionModel); @@ -5941,9 +6062,9 @@ const Apprenant = (props) => { rowsPerPageOptions={[10]} disableSelectionOnClick - components={{ + /* components={{ Toolbar: GridToolbar, - }} + }}*/ //sx={datagridSx} getCellClassName={(params) => { //field === 'distantiel' diff --git a/src/components/DisplayPartnerSession.js b/src/components/DisplayPartnerSession.js index 8d985f8..fa98d3a 100644 --- a/src/components/DisplayPartnerSession.js +++ b/src/components/DisplayPartnerSession.js @@ -83,6 +83,14 @@ import FormGroup from '@mui/material/FormGroup'; import Checkbox from '@mui/material/Checkbox'; +import { + GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton, + GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, + gridFilteredSortedRowIdsSelector, + gridVisibleColumnFieldsSelector, +} from '@mui/x-data-grid'; +import * as XLSX from 'xlsx'; + const DisplayPartnerSession = (props) => { const history = useHistory(); @@ -199,9 +207,9 @@ const DisplayPartnerSession = (props) => { const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(100); const columns = [ - { field: 'id', headerName: 'id', hide: true }, - { field: '_id', headerName: '_id', hide: true }, - { field: 'class_id', headerName: 'class_id', hide: true }, + { field: 'id', headerName: 'id', hide: true, disableExport: true, }, + { field: '_id', headerName: '_id', hide: true, disableExport: true, }, + { field: 'class_id', headerName: 'class_id', hide: true, disableExport: true, }, { field: 'is_bpf', headerName: 'is_bpf', hide: true, }, { field: 'session_alert_message', headerName: 'session_alert_message', hide: true }, { field: 'class_internal_url', headerName: 'class_internal_url', hide: true }, @@ -317,7 +325,7 @@ const DisplayPartnerSession = (props) => { { field: 'domaine', headerName: 'Domaine', minWidth: datagrid_columns_size_model1, align: "center", hide: true, renderCell: (params) => , }, { field: 'published', headerName: 'publié', minWidth: datagrid_columns_size_model1, align: "center", hide: true, renderCell: (params) => , }, - { field: 'site_formation_id', headerName: 'site_formation_id', with: 0, align: "center", hide: true, }, + { field: 'site_formation_id', headerName: 'site_formation_id', with: 0, align: "center", hide: true, disableExport: true, }, { field: 'qty_in_quotation', headerName: 'Place Non validé ', with: 150, align: "center", hide: false, renderCell: (params) => , }, @@ -327,7 +335,6 @@ const DisplayPartnerSession = (props) => { { field: 'site_formation_nom', headerName: 'Site Ftion', with: 150, align: "center", hide: false, renderCell: (params) => , }, - { field: 'invoiced_statut', headerName: 'Facturé', minWidth: 100, flex: 1, maxWidth: 150, hide: false, editable: false, renderCell: (cellValues) => { @@ -349,7 +356,7 @@ const DisplayPartnerSession = (props) => { { field: 'duration', headerName: 'Durée', minWidth: datagrid_columns_size_model2, align: "center", hide: true, renderCell: (params) => , }, { - field: "Detail", headerName: 'Voir détail', + field: "Detail", headerName: 'Voir détail', disableExport: true, renderCell: (cellValues) => { return ( @@ -370,7 +377,7 @@ const DisplayPartnerSession = (props) => { }, { - field: "delete", headerName: 'Supprimer', + field: "delete", headerName: 'Supprimer', disableExport: true, renderCell: (cellValues) => { return ( @@ -11269,6 +11276,116 @@ const DisplayPartnerSession = (props) => { ]; + + // DEBUT EXPORT EXCEL DATAGRID + + function CustomToolbar(props) { + + console.log(" my props = ", props); + + return ( + + + + + + + + + + + ); + } + + function getExcelData(apiRef) { + // Select rows and columns + const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef); + const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef); + + // Format the data. Here we only keep the value + const data = filteredSortedRowIds.map((id) => { + const row = {}; + visibleColumnsField.forEach((field) => { + row[field] = apiRef.current.getCellParams(id, field).value; + }); + return row; + }); + + return data; + } + + + function ExportButton(props) { + return ( + + + + ); + } + + function handleExport(apiRef, data_colums) { + const data = getExcelData(apiRef); + + const local_config = { + keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { + if (mydata.field) + return mydata.field; + else + return ""; + }), + + + columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { + if (mydata.headerName) + return mydata.headerName; + else + return ""; + }), + + fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', + sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), + }; + + const rows = data.map((row) => { + const mRow = {}; + for (const key of local_config.keys) { + mRow[key] = row[key]; + } + return mRow; + }); + + const worksheet = XLSX.utils.json_to_sheet(rows); + XLSX.utils.sheet_add_aoa(worksheet, [[...local_config.columnNames]], { + origin: 'A1', + }); + + const workbook = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(workbook, worksheet, local_config.sheetName); + XLSX.writeFile(workbook, local_config.fileName, { compression: true }); + } + + function ExportMenuItem(props) { + const apiRef = useGridApiContext(); + const { hideMenu } = props; + + return ( + { + handleExport(apiRef, props.data_colums); + // Hide the export menu after the export + hideMenu?.(); + }} + > + Export Excel + + ); + } + + // FIN EXPORT EXCEL DATAGRID + + return (
@@ -13976,6 +14093,10 @@ const DisplayPartnerSession = (props) => { > { setSelectionModel(newSelectionModel); @@ -14065,9 +14186,9 @@ const DisplayPartnerSession = (props) => { rowsPerPageOptions={[10]} disableSelectionOnClick - components={{ + /*components={{ Toolbar: GridToolbar, - }} + }}*/ //sx={datagridSx} getCellClassName={(params) => { @@ -14269,6 +14390,11 @@ const DisplayPartnerSession = (props) => { }} > { @@ -14357,9 +14483,9 @@ const DisplayPartnerSession = (props) => { rowsPerPageOptions={[10]} disableSelectionOnClick - components={{ + /* components={{ Toolbar: GridToolbar, - }} + }}*/ //sx={datagridSx} getCellClassName={(params) => { diff --git a/src/components/DisplayPartnerStagiaires.js b/src/components/DisplayPartnerStagiaires.js index 7165711..88fea3a 100644 --- a/src/components/DisplayPartnerStagiaires.js +++ b/src/components/DisplayPartnerStagiaires.js @@ -60,6 +60,15 @@ import Module_Email_Management from "./Module_Email_Management"; import FormGroup from '@mui/material/FormGroup'; import FormControlLabel from '@mui/material/FormControlLabel'; +import { + GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton, + GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, + gridFilteredSortedRowIdsSelector, + gridVisibleColumnFieldsSelector, +} from '@mui/x-data-grid'; +import * as XLSX from 'xlsx'; + + const DisplayPartnerStagiaires = (props) => { const history = useHistory(); const [submenu, setsubmenu] = useState(""); @@ -95,11 +104,11 @@ const DisplayPartnerStagiaires = (props) => { const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(80); const columns = [ - { field: '_id', headerName: '_id', hide: true, editable: false, Width: 0, }, - { field: 'session_id', headerName: 'session_id', hide: true, editable: false, Width: 0 }, - { field: 'id', headerName: 'id', hide: true, Width: 0 }, - { field: 'class_id', headerName: 'class_id', hide: true, Width: 0 }, - { field: 'class_internal_url', headerName: 'class_internal_url', hide: true, editable: false, Width: 0 }, + { field: '_id', headerName: '_id', hide: true, editable: false, Width: 0, disableExport: true, }, + { field: 'session_id', headerName: 'session_id', hide: true, editable: false, Width: 0 , disableExport: true,}, + { field: 'id', headerName: 'id', hide: true, Width: 0 , disableExport: true,}, + { field: 'class_id', headerName: 'class_id', hide: true, Width: 0 , disableExport: true,}, + { field: 'class_internal_url', headerName: 'class_internal_url', hide: true, editable: false, Width: 0 , disableExport: true,}, { field: 'telephone', headerName: 'Téléphone', hide: true, editable: false, Width: 0 }, { field: 'date_naissance', headerName: 'date_naissance', hide: true, editable: false, Width: 0 }, @@ -238,7 +247,7 @@ const DisplayPartnerStagiaires = (props) => { { - field: "Detail", headerName: 'Voir détail', + field: "Detail", headerName: 'Voir détail', disableExport: true, renderCell: (cellValues) => { return ( @@ -259,7 +268,7 @@ const DisplayPartnerStagiaires = (props) => { } }, { - field: 'Action', headerName: 'Action', hide: false, minWidth: 100, maxWidth: 150, flex: 1, + field: 'Action', headerName: 'Action', hide: false, minWidth: 100, maxWidth: 150, flex: 1, disableExport: true, renderCell: (cellValues) => { return ( @@ -437,7 +446,7 @@ const DisplayPartnerStagiaires = (props) => { }, { - field: "Impr.", headerName: 'Imprimer detail', + field: "Impr.", headerName: 'Imprimer detail', disableExport: true, renderCell: (cellValues) => { return ( @@ -455,7 +464,7 @@ const DisplayPartnerStagiaires = (props) => { } }, { - field: "delete", headerName: 'Supprimer', + field: "delete", headerName: 'Supprimer', disableExport: true, renderCell: (cellValues) => { return ( @@ -6536,6 +6545,113 @@ const DisplayPartnerStagiaires = (props) => { setdisplay_stagiaire_with_alert(event.target.checked); }; +// DEBUT EXPORT EXCEL DATAGRID + +function CustomToolbar(props) { + + console.log(" my props = ", props); + + return ( + + + + + + + + + + + ); +} + +function getExcelData(apiRef) { + // Select rows and columns + const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef); + const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef); + + // Format the data. Here we only keep the value + const data = filteredSortedRowIds.map((id) => { + const row = {}; + visibleColumnsField.forEach((field) => { + row[field] = apiRef.current.getCellParams(id, field).value; + }); + return row; + }); + + return data; +} + + +function ExportButton(props) { + return ( + + + + ); +} + +function handleExport(apiRef, data_colums) { + const data = getExcelData(apiRef); + + const local_config = { + keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { + if (mydata.field) + return mydata.field; + else + return ""; + }), + + + columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { + if (mydata.headerName) + return mydata.headerName; + else + return ""; + }), + + fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', + sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), + }; + + const rows = data.map((row) => { + const mRow = {}; + for (const key of local_config.keys) { + mRow[key] = row[key]; + } + return mRow; + }); + + const worksheet = XLSX.utils.json_to_sheet(rows); + XLSX.utils.sheet_add_aoa(worksheet, [[...local_config.columnNames]], { + origin: 'A1', + }); + + const workbook = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(workbook, worksheet, local_config.sheetName); + XLSX.writeFile(workbook, local_config.fileName, { compression: true }); +} + +function ExportMenuItem(props) { + const apiRef = useGridApiContext(); + const { hideMenu } = props; + + return ( + { + handleExport(apiRef, props.data_colums); + // Hide the export menu after the export + hideMenu?.(); + }} + > + Export Excel + + ); +} + +// FIN EXPORT EXCEL DATAGRID return (
@@ -8005,6 +8121,10 @@ const DisplayPartnerStagiaires = (props) => { > { setSelectionModel(newSelectionModel); @@ -8107,9 +8227,9 @@ const DisplayPartnerStagiaires = (props) => { rowsPerPageOptions={[10]} disableSelectionOnClick - components={{ + /* components={{ Toolbar: GridToolbar, - }} + }}*/ //sx={datagridSx} getCellClassName={(params) => { //field === 'distantiel' diff --git a/src/components/DisplayPartnerTrainingsPagination.js b/src/components/DisplayPartnerTrainingsPagination.js index 3887220..a7761dc 100644 --- a/src/components/DisplayPartnerTrainingsPagination.js +++ b/src/components/DisplayPartnerTrainingsPagination.js @@ -42,6 +42,14 @@ import { gridClasses } from '@mui/x-data-grid'; import Link from '@mui/material/Link'; import { PiDotsThree } from "react-icons/pi"; import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5"; +import { + GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton, + GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, + gridFilteredSortedRowIdsSelector, + gridVisibleColumnFieldsSelector, + } from '@mui/x-data-grid'; + import * as XLSX from 'xlsx'; + const DistplayPartnerTraningsPage = (props) => { @@ -397,8 +405,8 @@ const DistplayPartnerTraningsPage = (props) => { const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(120); const columns = [ - { field: 'id', headerName: 'id', hide: true, maxWidth: 1, }, - { field: '_id', headerName: '_id', hide: true, maxWidth: 1, }, + { field: 'id', headerName: 'id', hide: true, maxWidth: 1, disableExport: true,}, + { field: '_id', headerName: '_id', hide: true, maxWidth: 1, disableExport: true, }, { field: 'lms_class_code', headerName: 'lms_class_code', hide: true, Width: 0, }, { field: 'duration', headerName: 'duration', hide: true, Width: 0, }, { field: 'presentiel', headerName: 'Présentiel', hide: true, Width: 0, }, @@ -408,8 +416,6 @@ const DistplayPartnerTraningsPage = (props) => { { field: 'duration_in_hour', headerName: 'duration_in_hour', hide: true, Width: 0, editable: false, }, { field: 'currency', headerName: 'currency', hide: true, Width: 0, editable: false, }, - - { field: 'zone_diffusion', headerName: 'zone_diffusion', hide: true, maxWidth: 1, editable: false, }, { field: 'internal_url', headerName: 'internal_url', hide: true, editable: false, }, { field: 'external_code', headerName: 'Code Formation', minWidth: 150, flex: 1, maxWidth: 250, editable: false, renderCell: (params) => , }, @@ -464,7 +470,7 @@ const DistplayPartnerTraningsPage = (props) => { } }, { - field: "visual", headerName: 'Visualiser', minWidth: 50, flex: 1, maxWidth: 100, + field: "visual", headerName: 'Visualiser', minWidth: 50, flex: 1, maxWidth: 100, disableExport: true, renderCell: (cellValues) => { return ( @@ -482,7 +488,7 @@ const DistplayPartnerTraningsPage = (props) => { } }, { - field: "Print", headerName: 'Editer', minWidth: 50, flex: 1, maxWidth: 100, + field: "Print", headerName: 'Editer', minWidth: 50, flex: 1, maxWidth: 100, disableExport: true, renderCell: (cellValues) => { return ( @@ -501,7 +507,7 @@ const DistplayPartnerTraningsPage = (props) => { }, { - field: "push_to_lms", headerName: 'E-learning Creation', minWidth: 100, flex: 1, maxWidth: 150, + field: "push_to_lms", headerName: 'E-learning Creation', minWidth: 100, flex: 1, maxWidth: 150, disableExport: true, renderCell: (cellValues) => { return (
- +
@@ -3918,6 +4056,10 @@ const Groupe_Apprenant = (props) => { > { @@ -3962,9 +4104,9 @@ const Groupe_Apprenant = (props) => { rowsPerPageOptions={[10]} disableSelectionOnClick - components={{ - Toolbar: GridToolbar, - }} + /* components={{ + Toolbar: GridToolbar, + }}*/ //sx={datagridSx} getCellClassName={(params) => { diff --git a/src/components/Partner_Commande.js b/src/components/Partner_Commande.js index 20164fb..95ac292 100644 --- a/src/components/Partner_Commande.js +++ b/src/components/Partner_Commande.js @@ -61,7 +61,13 @@ import Checkbox from '@mui/material/Checkbox'; import { FcOpenedFolder } from "react-icons/fc"; import { useParams } from 'react-router-dom'; - +import { + GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton, + GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, + gridFilteredSortedRowIdsSelector, + gridVisibleColumnFieldsSelector, +} from '@mui/x-data-grid'; +import * as XLSX from 'xlsx'; const useStyles = makeStyles((theme) => ({ @@ -147,8 +153,8 @@ const Partner_Commande = (props) => { } const columns = [ - { field: '_id', headerName: '_id', hide: true }, - { field: 'id', headerName: 'id', hide: true }, + { field: '_id', headerName: '_id', hide: true , disableExport: true,}, + { field: 'id', headerName: 'id', hide: true , disableExport: true,}, { field: 'order_header_ref_interne', headerName: 'Reference', maxWidth: 200, minWidth: 180, flex: 1, hide: false, editable: false, renderCell: (params) => , }, { field: 'order_header_type', headerName: 'Type', width: 100, hide: false, editable: false }, { @@ -188,15 +194,15 @@ const Partner_Commande = (props) => { }, - { field: 'order_header_client_id', headerName: 'Client_Id', width: 0, hide: true, editable: false }, + { field: 'order_header_client_id', headerName: 'Client_Id', width: 0, hide: true, editable: false , disableExport: true,}, { field: 'order_header_client_nom', headerName: 'Nom Client', minWidth: 200, flex: 1, renderCell: (params) => , }, - { field: 'order_header_vendeur_id', headerName: 'Vendeur Id', width: 0, hide: true, editable: false }, + { field: 'order_header_vendeur_id', headerName: 'Vendeur Id', width: 0, hide: true, editable: false , disableExport: true,}, { field: 'order_header_vendeur_nom_prenom', headerName: 'Vendeur', width: 150, flex: 1, editable: false, flex: 1 }, { field: 'order_header_date_cmd', headerName: 'Date', minWidth: 150, hide: false, editable: false, flex: 1, renderCell: (params) => , }, { field: 'order_header_date_expiration', headerName: 'Date Expiration', minWidth: 150, hide: false, editable: false }, { - field: "delete", headerName: 'Supprimer', + field: "delete", headerName: 'Supprimer', disableExport: true, renderCell: (cellValues) => { return ( @@ -3974,7 +3980,6 @@ const Partner_Commande = (props) => { function Check_Electronic_Sign_Before_Sending_Email() { if (partner_digital_signature_status && String(partner_digital_signature_status) === "1") { - setDialog_signature_digitale_open(true); } else { @@ -4597,6 +4602,113 @@ const Partner_Commande = (props) => { ]; + // DEBUT EXPORT EXCEL DATAGRID + + function CustomToolbar(props) { + + console.log(" my props = ", props); + + return ( + + + + + + + + + + + ); + } + + function getExcelData(apiRef) { + // Select rows and columns + const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef); + const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef); + + // Format the data. Here we only keep the value + const data = filteredSortedRowIds.map((id) => { + const row = {}; + visibleColumnsField.forEach((field) => { + row[field] = apiRef.current.getCellParams(id, field).value; + }); + return row; + }); + + return data; + } + + + function ExportButton(props) { + return ( + + + + ); + } + + function handleExport(apiRef, data_colums) { + const data = getExcelData(apiRef); + + const local_config = { + keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { + if (mydata.field) + return mydata.field; + else + return ""; + }), + + + columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { + if (mydata.headerName) + return mydata.headerName; + else + return ""; + }), + + fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', + sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), + }; + + const rows = data.map((row) => { + const mRow = {}; + for (const key of local_config.keys) { + mRow[key] = row[key]; + } + return mRow; + }); + + const worksheet = XLSX.utils.json_to_sheet(rows); + XLSX.utils.sheet_add_aoa(worksheet, [[...local_config.columnNames]], { + origin: 'A1', + }); + + const workbook = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(workbook, worksheet, local_config.sheetName); + XLSX.writeFile(workbook, local_config.fileName, { compression: true }); + } + + function ExportMenuItem(props) { + const apiRef = useGridApiContext(); + const { hideMenu } = props; + + return ( + { + handleExport(apiRef, props.data_colums); + // Hide the export menu after the export + hideMenu?.(); + }} + > + Export Excel + + ); + } + + // FIN EXPORT EXCEL DATAGRID return (
@@ -4896,7 +5008,7 @@ const Partner_Commande = (props) => { - {/* Dialog pour gerer la signature digitale */} + {/* Dialog pour gerer la signature digitale et ajouter une pièce jointe*/} { -
Type Document - - -
- - - {String(partner_digital_signature_status) === "1" &&
@@ -4962,7 +5057,7 @@ const Partner_Commande = (props) => {
- Pièces jointes Convention + Pièces jointes
@@ -5021,12 +5116,8 @@ const Partner_Commande = (props) => {
- - - -
@@ -6377,6 +6468,11 @@ const Partner_Commande = (props) => { > { setSelectionModel(newSelectionModel); @@ -6423,9 +6519,9 @@ const Partner_Commande = (props) => { rowsPerPageOptions={[10]} //disableSelectionOnClick - components={{ + /* components={{ Toolbar: GridToolbar, - }} + }}*/ //sx={datagridSx} getCellClassName={(params) => { diff --git a/src/components/Partner_Facture.js b/src/components/Partner_Facture.js index 2b98d8e..75ce989 100644 --- a/src/components/Partner_Facture.js +++ b/src/components/Partner_Facture.js @@ -15,6 +15,8 @@ import { gridVisibleColumnFieldsSelector, } from '@mui/x-data-grid'; import * as XLSX from 'xlsx'; +import { Fab } from "@material-ui/core"; +import { IoMdAddCircle, IoIosRemoveCircleOutline } from "react-icons/io"; import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css"; import { Editor } from '@tinymce/tinymce-react'; @@ -61,7 +63,7 @@ import { import { ContextMenu, ContextMenuTrigger } from "react-contextmenu"; import zIndex from "@material-ui/core/styles/zIndex"; import { FcOpenedFolder } from "react-icons/fc"; - +import Module_Historique_Action from "./Module_Historique_Action"; import { GridExportCsvOptions } from '@mui/x-data-grid'; @@ -1561,7 +1563,7 @@ const Partner_Facture = (props) => { const stored_cookie = getCookie('tokenmysypart'); var nom_fichier_cmd = "Facture_" + invoice_internal_ref + ".pdf"; - console.log(" nom_fichier_cmd = ", nom_fichier_cmd, " --- selected_id = ", selected_id); + // console.log(" nom_fichier_cmd = ", nom_fichier_cmd, " --- selected_id = ", selected_id); var url = process.env.REACT_APP_API_URL + "myclass/api/GerneratePDF_Partner_Invoice/" + stored_cookie + "/" + selected_id; @@ -1659,6 +1661,11 @@ const Partner_Facture = (props) => { form.append("token", stored_cookie); form.append("invoice_id", selected_id); + for (let i = 0; i < tab_invoice_mail_pieces_jointes_result.length; i++) { + form.append('File', tab_invoice_mail_pieces_jointes_result[i]); + } + + //console.log("### form = ", form); var myurl = process.env.REACT_APP_API_URL + "myclass/api/Send_Partner_Invoice_By_Email/"; @@ -2483,7 +2490,7 @@ const Partner_Facture = (props) => { function CustomToolbar(props) { - console.log(" my props = ", props); + // console.log(" my props = ", props); return ( @@ -2587,6 +2594,113 @@ const Partner_Facture = (props) => { // FIN EXPORT EXCEL DATAGRID + const [Dialog_send_invoice_with_PJ_message, setDialog_send_invoice_with_PJ_message] = React.useState(false); + const [Dialog_send_invoice_with_PJ_open, setDialog_send_invoice_with_PJ_open] = React.useState(false); + function Dialog_send_invoice_with_PJ_handle_change_participant_session(message) { + setDialog_send_invoice_with_PJ_message(message); + setDialog_send_invoice_with_PJ_open(true); + } + + const Dialog_send_invoice_with_PJ_handleClose = () => { + //alert(" Utiliser le bouton 'fermer' "); + //setOpen(false); + }; + + const Dialog_send_invoice_with_PJ_handleClose_buton = () => { + setDialog_send_invoice_with_PJ_open(false); + settab_invoice_mail_pieces_jointes_result([]); + }; + + + function Delete_invoice_email_Attached_Doc(event) { + + var doc_to_del_name = event.target.id; + const myArray = tab_invoice_mail_pieces_jointes_result; + + let new_myArray = myArray.filter(file => file.name !== String(doc_to_del_name)); + + var new_tab = [] + for (let i = 0; i < new_myArray.length; i++) { + new_tab.push(new_myArray[i]); + } + + settab_invoice_mail_pieces_jointes_result(new_tab); + + + } + + const [sessions_file_change_1_convention_api, setsessions_file_change_1_convention_api] = useState(); + const [sessions_file_change_1_convention_result, setsessions_file_change_1_convention_result] = useState(); + const [sessions_file_change_1_convention_message, setsessions_file_change_1_convention_message] = useState(); + const sessions_file_change_1_convention = event => { + + const fileUploaded = event.target.files[0]; + let file_size = event.target.files[0].size; + let file_type = event.target.files[0].type; + + + if (file_type !== "application/pdf") { + alert("Le fichier n'est pas de type PDF"); + return; + } + + + + if (file_size > 10000000) { + alert("Le fichier ne doit pas depasser un 1 Méga octets"); + console.log("Le fichier ne doit pas depasser un 1 Méga octets"); + return; + } + + //var new_node = {'name':event.target.files[0].name, 'type':event.target.files[0].type} + + + var new_tmp = []; + + if (tab_invoice_mail_pieces_jointes_result && tab_invoice_mail_pieces_jointes_result.length > 0) { + + tab_invoice_mail_pieces_jointes_result.map((x) => { + new_tmp.push(x); + + }); + + } + + new_tmp.push(event.target.files[0]) + + settab_invoice_mail_pieces_jointes_result(new_tmp); + + //console.log(" tab_invoice_mail_pieces_jointes_result = ", tab_invoice_mail_pieces_jointes_result) + + + return; + + + }; + + const [tab_invoice_mail_pieces_jointes_result, settab_invoice_mail_pieces_jointes_result] = useState([]); + + const [Dialog_invoice_history_message, setDialog_invoice_history_message] = React.useState(false); + const [Dialog_invoice_history_open, setDialog_invoice_history_open] = React.useState(false); + function Dialog_invoice_history_handle_change_participant_session(message) { + setDialog_invoice_history_message(message); + setDialog_invoice_history_open(true); + } + + const Dialog_invoice_history_handleClose = () => { + //alert(" Utiliser le bouton 'fermer' "); + //setOpen(false); + }; + + const Dialog_invoice_history_handleClose_buton = () => { + setDialog_invoice_history_open(false); + settab_invoice_mail_pieces_jointes_result([]); + + if (document.getElementsByName("invoice_history_bton") && document.getElementsByName("invoice_history_bton")[0]) { + document.getElementsByName("invoice_history_bton")[0].style.backgroundColor = "#d8edfc"; + document.getElementsByName("invoice_history_bton")[0].style.color = "#3b3e40"; + } + }; return ( @@ -2807,6 +2921,167 @@ const Partner_Facture = (props) => {
+ {/* Dialog affichage historique facture */} + null} > + + MySy Information + + +
+
+ +
+ + +
+ + +
+
+ + +
+ + + + +
+
+   +
+ + +
+ +
+
+ +
+ +
+ {/* FIN Dialog affichage historique facture */} + + + {/* Dialog envoie facture mail avec PJ */} + null} > + + MySy Information + + + Envoi Facture par email + + + +
+ +
+
+
+
+ +
+ Pièces jointes à la facture + +
+ +
+ +
+ +
+ + +
+ + + {tab_invoice_mail_pieces_jointes_result &&
+ +
+ Liste des pièces jointes
+ {
+ {tab_invoice_mail_pieces_jointes_result && tab_invoice_mail_pieces_jointes_result.map((val) => ( +
+
+ + +
+ ))} +
} +
+
} + + + +
+
+ + +
+ + + + +
+
+ +
+ + +
+ +
+
+ +
+ +
+ {/* FIN Dialog envoie facture mail avec PJ */} + + + + {/*** Paiement */} {
- - @@ -4108,7 +4381,17 @@ const Partner_Facture = (props) => {
- + + + + +