06/10/2024 - 19h30

recette2
cherif 2024-10-06 19:38:37 +02:00
parent 5cd470c38c
commit 8a4ec815b8
7 changed files with 1114 additions and 106 deletions

View File

@ -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 (
<GridToolbarContainer {...props}>
<GridToolbarColumnsButton />
<GridToolbarFilterButton />
<GridToolbarDensitySelector
slotProps={{ tooltip: { title: 'Change density' } }}
/>
<Box sx={{ flexGrow: 1 }} />
<ExportButton data_colums={props.data_colums} />
</GridToolbarContainer>
);
}
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 (
<GridToolbarExportContainer {...props}>
<ExportMenuItem data_colums={props.data_colums} />
</GridToolbarExportContainer>
);
}
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 (
<MenuItem
onClick={() => {
handleExport(apiRef, props.data_colums);
// Hide the export menu after the export
hideMenu?.();
}}
>
Export Excel
</MenuItem>
);
}
// FIN EXPORT EXCEL DATAGRID
return (
<div className="apprenant">
@ -5865,6 +5981,11 @@ const Apprenant = (props) => {
<DataGrid
checkboxSelection
components={{
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns } }}
onSelectionModelChange={(newSelectionModel) => {
setSelectionModel(newSelectionModel);
@ -5941,9 +6062,9 @@ const Apprenant = (props) => {
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
/* components={{
Toolbar: GridToolbar,
}}
}}*/
//sx={datagridSx}
getCellClassName={(params) => {
//field === 'distantiel'

View File

@ -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) => <ExpandableCell_50 {...params} />, },
{ field: 'published', headerName: 'publié', minWidth: datagrid_columns_size_model1, align: "center", hide: true, renderCell: (params) => <ExpandableCell_50 {...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) => <ExpandableCell_50 {...params} />, },
@ -327,7 +335,6 @@ const DisplayPartnerSession = (props) => {
{ field: 'site_formation_nom', headerName: 'Site Ftion', with: 150, align: "center", hide: false, renderCell: (params) => <ExpandableCell_50 {...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) => <ExpandableCell_50 {...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 (
<GridToolbarContainer {...props}>
<GridToolbarColumnsButton />
<GridToolbarFilterButton />
<GridToolbarDensitySelector
slotProps={{ tooltip: { title: 'Change density' } }}
/>
<Box sx={{ flexGrow: 1 }} />
<ExportButton data_colums={props.data_colums} />
</GridToolbarContainer>
);
}
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 (
<GridToolbarExportContainer {...props}>
<ExportMenuItem data_colums={props.data_colums} />
</GridToolbarExportContainer>
);
}
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 (
<MenuItem
onClick={() => {
handleExport(apiRef, props.data_colums);
// Hide the export menu after the export
hideMenu?.();
}}
>
Export Excel
</MenuItem>
);
}
// FIN EXPORT EXCEL DATAGRID
return (
<div className="displaypartnersession">
@ -13976,6 +14093,10 @@ const DisplayPartnerSession = (props) => {
>
<DataGrid
checkboxSelection
components={{
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns } }}
onSelectionModelChange={(newSelectionModel) => {
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) => {
}}
>
<DataGrid
components={{
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns } }}
checkboxSelection
onSelectionModelChange={(newSelectionModel) => {
@ -14357,9 +14483,9 @@ const DisplayPartnerSession = (props) => {
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
/* components={{
Toolbar: GridToolbar,
}}
}}*/
//sx={datagridSx}
getCellClassName={(params) => {

View File

@ -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 (
<GridToolbarContainer {...props}>
<GridToolbarColumnsButton />
<GridToolbarFilterButton />
<GridToolbarDensitySelector
slotProps={{ tooltip: { title: 'Change density' } }}
/>
<Box sx={{ flexGrow: 1 }} />
<ExportButton data_colums={props.data_colums} />
</GridToolbarContainer>
);
}
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 (
<GridToolbarExportContainer {...props}>
<ExportMenuItem data_colums={props.data_colums} />
</GridToolbarExportContainer>
);
}
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 (
<MenuItem
onClick={() => {
handleExport(apiRef, props.data_colums);
// Hide the export menu after the export
hideMenu?.();
}}
>
Export Excel
</MenuItem>
);
}
// FIN EXPORT EXCEL DATAGRID
return (
<div className="displaypartnerstagiaire">
@ -8005,6 +8121,10 @@ const DisplayPartnerStagiaires = (props) => {
>
<DataGrid
checkboxSelection
components={{
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns } }}
onSelectionModelChange={(newSelectionModel) => {
setSelectionModel(newSelectionModel);
@ -8107,9 +8227,9 @@ const DisplayPartnerStagiaires = (props) => {
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
/* components={{
Toolbar: GridToolbar,
}}
}}*/
//sx={datagridSx}
getCellClassName={(params) => {
//field === 'distantiel'

View File

@ -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) => <ExpandableCell_50 {...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 (
<nav style={{ "textAlign": "center" }}>
@ -565,7 +571,7 @@ const DistplayPartnerTraningsPage = (props) => {
}
},
{
field: "delete", headerName: 'Supprimer', minWidth: 50, flex: 1, maxWidth: 100,
field: "delete", headerName: 'Supprimer', minWidth: 50, flex: 1, maxWidth: 100, disableExport: true,
renderCell: (cellValues) => {
return (
@ -1756,6 +1762,115 @@ const DistplayPartnerTraningsPage = (props) => {
{ "id": "1", "label": "", "value": "1" }, // Cette ligne pour couvrir l'ajout d'une ligne de filter. C'est fait expres.
]
// DEBUT EXPORT EXCEL DATAGRID
function CustomToolbar(props) {
console.log(" my props = ", props);
return (
<GridToolbarContainer {...props}>
<GridToolbarColumnsButton />
<GridToolbarFilterButton />
<GridToolbarDensitySelector
slotProps={{ tooltip: { title: 'Change density' } }}
/>
<Box sx={{ flexGrow: 1 }} />
<ExportButton data_colums={props.data_colums} />
</GridToolbarContainer>
);
}
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 (
<GridToolbarExportContainer {...props}>
<ExportMenuItem data_colums={props.data_colums} />
</GridToolbarExportContainer>
);
}
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 (
<MenuItem
onClick={() => {
handleExport(apiRef, props.data_colums);
// Hide the export menu after the export
hideMenu?.();
}}
>
Export Excel
</MenuItem>
);
}
// FIN EXPORT EXCEL DATAGRID
return (
<div className='displaypartnertrainingpagination'>
@ -2291,6 +2406,11 @@ const DistplayPartnerTraningsPage = (props) => {
<DataGrid
checkboxSelection
components={{
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns } }}
onSelectionModelChange={(newSelectionModel) => {
setSelectionModel(newSelectionModel);
@ -2359,9 +2479,9 @@ const DistplayPartnerTraningsPage = (props) => {
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
/* components={{
Toolbar: GridToolbar,
}}
}}*/
getCellClassName={(params) => {
if (params.field === 'published' && String(params.value) === "1") {

View File

@ -65,6 +65,14 @@ import CancelPresentationIcon from '@mui/icons-material/CancelPresentation';
import { IconButton } from '@material-ui/core';
import Paper from '@material-ui/core/Paper';
import Draggable from 'react-draggable';
import {
GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton,
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector,
} from '@mui/x-data-grid';
import * as XLSX from 'xlsx';
const useStyles = makeStyles((theme) => ({
@ -178,14 +186,14 @@ const Groupe_Apprenant = (props) => {
const columns_grp_apprenant = [
{ field: '_id', headerName: '_id', hide: true, Width: 0 },
{ field: 'id', headerName: 'id', hide: true, Width: 0 },
{ field: '_id', headerName: '_id', hide: true, Width: 0, disableExport: true, },
{ field: 'id', headerName: 'id', hide: true, Width: 0, disableExport: true, },
{ field: 'code', headerName: 'Code', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'nom', headerName: 'Nom', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'type_groupe_code', headerName: 'Type GRoupe', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'nb_membre', headerName: 'Nb membres', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'class_id', headerName: 'class_id', hide: true, Width: 0 },
{ field: 'class_id', headerName: 'class_id', hide: true, Width: 0, disableExport: true, },
{
field: 'class_id_code', headerName: 'Ftion Code', minWidth: 150, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />,
@ -200,29 +208,46 @@ const Groupe_Apprenant = (props) => {
</div>
);
},
valueGetter: (cellValues) => {
if (cellValues.row.class_id) {
var mylabel = New_Getall_Partner_Class_Reduice_Fields_result.filter((data) => (data)._id === String(cellValues.row.class_id))[0].label;
return mylabel;
}
return "";
},
},
{ field: 'session_id', headerName: 'session_id', hide: true, Width: 0 },
{ field: 'session_id', headerName: 'session_id', hide: true, Width: 0, disableExport: true, },
{
field: 'session_code', headerName: 'Classe', minWidth: 150, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />,
renderCell: (cellValues) => {
return (
<div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
{New_Getall_Partner_Session_Reduice_Fields_result && New_Getall_Partner_Session_Reduice_Fields_result.length > 0 && <nav>
{New_Getall_Partner_Session_Reduice_Fields_result && New_Getall_Partner_Session_Reduice_Fields_result.length > 0 &&
<nav>
{New_Getall_Partner_Session_Reduice_Fields_result.filter((data) => (data)._id === String(cellValues.row.session_id))[0].label}
</nav>}
</div>
);
},
valueGetter: (cellValues) => {
if (cellValues.row.session_id) {
var mylabel = New_Getall_Partner_Session_Reduice_Fields_result.filter((data) => (data)._id === String(cellValues.row.session_id))[0].label;
return mylabel;
}
return "";
},
},
{
field: "delete", headerName: 'Supprimer',
field: "delete", headerName: 'Supprimer', disableExport: true,
renderCell: (cellValues) => {
return (
<nav>
@ -291,16 +316,15 @@ const Groupe_Apprenant = (props) => {
]
const columns_grp_membre = [
{ field: '_id', headerName: '_id', hide: true, Width: 0 },
{ field: 'id', headerName: 'id', hide: true, Width: 0 },
{ field: '_id', headerName: '_id', hide: true, Width: 0, disableExport: true, },
{ field: 'id', headerName: 'id', hide: true, Width: 0, disableExport: true, },
{ field: 'nom', headerName: 'nom', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'prenom', headerName: 'prenom', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'email', headerName: 'email', flex: 1, hide: false, minWidth: 180, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{
field: "delete", headerName: 'Supprimer',
field: "delete", headerName: 'Supprimer', disableExport: true,
renderCell: (cellValues) => {
return (
@ -2146,6 +2170,114 @@ const Groupe_Apprenant = (props) => {
};
// DEBUT EXPORT EXCEL DATAGRID
function CustomToolbar(props) {
console.log(" my props = ", props);
return (
<GridToolbarContainer {...props}>
<GridToolbarColumnsButton />
<GridToolbarFilterButton />
<GridToolbarDensitySelector
slotProps={{ tooltip: { title: 'Change density' } }}
/>
<Box sx={{ flexGrow: 1 }} />
<ExportButton data_colums={props.data_colums} />
</GridToolbarContainer>
);
}
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 (
<GridToolbarExportContainer {...props}>
<ExportMenuItem data_colums={props.data_colums} />
</GridToolbarExportContainer>
);
}
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 (
<MenuItem
onClick={() => {
handleExport(apiRef, props.data_colums);
// Hide the export menu after the export
hideMenu?.();
}}
>
Export Excel
</MenuItem>
);
}
// FIN EXPORT EXCEL DATAGRID
return (
<div className="groupe_apprenant">
{isLoading && <div className="loader-container">
@ -2865,6 +2997,12 @@ const Groupe_Apprenant = (props) => {
>
<DataGrid
checkboxSelection
components={{
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns_grp_apprenant } }}
onSelectionModelChange={(newSelectionModel) => {
setselectionModel_grp_apprenant(newSelectionModel);
/*if (newSelectionModel.length === 1)
@ -2909,9 +3047,9 @@ const Groupe_Apprenant = (props) => {
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
/* components={{
Toolbar: GridToolbar,
}}
}}*/
//sx={datagridSx}
getCellClassName={(params) => {
@ -3918,6 +4056,10 @@ const Groupe_Apprenant = (props) => {
>
<DataGrid
//onCellEditCommit={OnchangeCellDataGrid}
components={{
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns_grp_membre } }}
checkboxSelection
onSelectionModelChange={(newSelectionModel) => {
@ -3962,9 +4104,9 @@ const Groupe_Apprenant = (props) => {
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
/* components={{
Toolbar: GridToolbar,
}}
}}*/
//sx={datagridSx}
getCellClassName={(params) => {

View File

@ -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) => <ExpandableCell_50 {...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) => <ExpandableCell_50 {...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) => <ExpandableCell_50 {...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 (
<GridToolbarContainer {...props}>
<GridToolbarColumnsButton />
<GridToolbarFilterButton />
<GridToolbarDensitySelector
slotProps={{ tooltip: { title: 'Change density' } }}
/>
<Box sx={{ flexGrow: 1 }} />
<ExportButton data_colums={props.data_colums} />
</GridToolbarContainer>
);
}
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 (
<GridToolbarExportContainer {...props}>
<ExportMenuItem data_colums={props.data_colums} />
</GridToolbarExportContainer>
);
}
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 (
<MenuItem
onClick={() => {
handleExport(apiRef, props.data_colums);
// Hide the export menu after the export
hideMenu?.();
}}
>
Export Excel
</MenuItem>
);
}
// FIN EXPORT EXCEL DATAGRID
return (
<div className="partner_commande">
@ -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*/}
<Dialog
open={Dialog_signature_digitale_open}
// onClose={Dialog_signature_digitale_handleClose}
@ -4911,23 +5023,6 @@ const Partner_Commande = (props) => {
</DialogContentText>
<div className="session_caract_Dialog" > Type Document
<TextField
sx={{ '& legend': { display: 'none' }, '& fieldset': { top: 0 }, }}
name="event_dialog_type_doc"
id="event_dialog_type_doc"
fullWidth
value="Email"
/>
</div>
{String(partner_digital_signature_status) === "1" && <div className="session_caract_Dialog" >
<div className="session_caract_Dialog" >
<Tooltip className="tooltip_css" id="tooltip_signat_dig" style={{ "fontSize": "12px" }} />
@ -4962,7 +5057,7 @@ const Partner_Commande = (props) => {
</div>
<div className="div_row" style={{ "border": "None", "fontSize": "22px", "fontWeight": "600", "padding": "5px" }}>
Pièces jointes Convention
Pièces jointes
</div>
@ -5021,12 +5116,8 @@ const Partner_Commande = (props) => {
</div>
</DialogContent>
<DialogActions>
<div className="div_row">
<div className="div_row_gauche">
@ -6377,6 +6468,11 @@ const Partner_Commande = (props) => {
>
<DataGrid
checkboxSelection
components={{
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns } }}
disableSelectionOnClick
onSelectionModelChange={(newSelectionModel) => {
setSelectionModel(newSelectionModel);
@ -6423,9 +6519,9 @@ const Partner_Commande = (props) => {
rowsPerPageOptions={[10]}
//disableSelectionOnClick
components={{
/* components={{
Toolbar: GridToolbar,
}}
}}*/
//sx={datagridSx}
getCellClassName={(params) => {

View File

@ -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 (
<GridToolbarContainer {...props}>
@ -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) => {
</DialogActions>
</Dialog>
{/* Dialog affichage historique facture */}
<Dialog
open={Dialog_invoice_history_open}
// onClose={Dialog_invoice_history_handleClose}
className="displaypartnersession"
static
onClose={() => null} >
<DialogTitle>MySy Information</DialogTitle>
<DialogContent className="DialogContent_width" style={{ "minHeight": "20rem" }}>
<div>
<div>
<div className="div_row" style={{ "border": "None", "fontSize": "22px", "fontWeight": "600", "padding": "5px" }}>
<Module_Historique_Action related_collection="partner_invoice_header"
related_collection_recid={selected_id}
read_access={"1"}
write_access={"1"} />
</div>
</div>
</div>
</DialogContent>
<DialogActions>
<div className="div_row">
<div className="div_row_gauche">
&nbsp;
</div>
<div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_invoice_history_handleClose_buton} className="bton_annule_dialog" >Fermer</Button>
</div>
</div>
</DialogActions>
</Dialog>
{/* FIN Dialog affichage historique facture */}
{/* Dialog envoie facture mail avec PJ */}
<Dialog
open={Dialog_send_invoice_with_PJ_open}
// onClose={Dialog_send_invoice_with_PJ_handleClose}
className="displaypartnersession"
static
onClose={() => null} >
<DialogTitle>MySy Information</DialogTitle>
<DialogContent className="DialogContent_width" style={{ "minHeight": "20rem" }}>
<DialogContentText>
Envoi Facture par email
</DialogContentText>
<div>
<div>
<div className="div_row" style={{ "border": "None" }}>
<hr className="hr_break" />
</div>
<div className="div_row" style={{ "border": "None", "fontSize": "22px", "fontWeight": "600", "padding": "5px" }}>
Pièces jointes à la facture
</div>
<div className="div_row" style={{ "padding": "5px" }}>
<div style={{ "fontSize": "12px" }}>
<label htmlFor="upload_convention_file">
<input
style={{ display: "none" }}
id="upload_convention_file"
name="upload_convention_file"
type="file"
onChange={sessions_file_change_1_convention}
/>
<Fab
color="secondary"
size="small"
component="span"
aria-label="add"
variant="extended"
>
<IoMdAddCircle /> <nav style={{ "fontSize": "12px" }}> Ajouter un fichier </nav>
</Fab>
</label>
</div>
</div>
{tab_invoice_mail_pieces_jointes_result && <div className="div_row" style={{ "padding": "5px" }}>
<div className="div_row">
Liste des pièces jointes <br />
{<div className="div_row">
{tab_invoice_mail_pieces_jointes_result && tab_invoice_mail_pieces_jointes_result.map((val) => (
<div className="div_row_list_pj_convention" >
<nav style={{ "color": "orange", "cursor": "pointer" }}
onClick={(e) => {
Delete_invoice_email_Attached_Doc(e);
}}
name={val.name} id={val.name}> Supprimer {val.name} </nav> <br />
</div>
))}
</div>}
</div>
</div>}
</div>
</div>
</DialogContent>
<DialogActions>
<div className="div_row">
<div className="div_row_gauche">
<Button onClick={(e) => {
Dialog_send_invoice_with_PJ_handleClose_buton();
Send_Invoice_By_Email();
}}
className="bton_enreg_dialog">Envoyer </Button>
</div>
<div className="div_row_droite" style={{ "textAlign": 'center' }}>
<Button onClick={Dialog_send_invoice_with_PJ_handleClose_buton} className="bton_annule_dialog" >Fermer</Button>
</div>
</div>
</DialogActions>
</Dialog>
{/* FIN Dialog envoie facture mail avec PJ */}
{/*** Paiement */}
<Dialog
open={Dialog_Paiement_1_open}
@ -2922,8 +3197,6 @@ const Partner_Facture = (props) => {
</div>
</DialogContent>
@ -4108,7 +4381,17 @@ const Partner_Facture = (props) => {
<div style={{ "width": "23%", "float": "left", "textAlign": "right", "paddingTop": "2rem" }}>
<Button variant="outlined" onClick={print_invoice_pdf} className="detail_class_submenu" id='order_header_main' name='order_header_main'>Imprimer pdf</Button>
<Button variant="outlined" onClick={Send_Invoice_By_Email} className="detail_class_submenu" id='order_header_main' name='order_header_main'>envoyer par mail</Button>
<Button variant="outlined" onClick={(event) => {
setDialog_send_invoice_with_PJ_open(true);
}
} className="detail_class_submenu" id='order_header_main' name='order_header_main'>envoyer par mail</Button>
<Button variant="outlined" onClick={(event) => {
setDialog_invoice_history_open(true);
}
} className="detail_class_submenu" id='invoice_history_bton' name='invoice_history_bton'>Historique</Button>
<div className="div_row"> &nbsp; </div>
<Button variant="outlined" onClick={(event) => {