06/10/2024 - 19h30
parent
5cd470c38c
commit
8a4ec815b8
|
@ -53,6 +53,13 @@ import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5";
|
||||||
import { gridClasses } from '@mui/x-data-grid';
|
import { gridClasses } from '@mui/x-data-grid';
|
||||||
import Link from '@mui/material/Link';
|
import Link from '@mui/material/Link';
|
||||||
import { PiDotsThree } from "react-icons/pi";
|
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) => {
|
const Apprenant = (props) => {
|
||||||
|
|
||||||
|
@ -116,8 +123,8 @@ const Apprenant = (props) => {
|
||||||
|
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{ field: 'id', headerName: 'id', hide: true },
|
{ field: 'id', headerName: 'id', hide: true , disableExport: true,},
|
||||||
{ field: '_id', headerName: '_id', hide: 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,
|
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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
|
|
||||||
|
@ -176,7 +183,7 @@ const Apprenant = (props) => {
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
field: "delete", headerName: 'Supprimer',
|
field: "delete", headerName: 'Supprimer', disableExport: true,
|
||||||
renderCell: (cellValues) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
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 (
|
return (
|
||||||
<div className="apprenant">
|
<div className="apprenant">
|
||||||
|
|
||||||
|
@ -5865,6 +5981,11 @@ const Apprenant = (props) => {
|
||||||
<DataGrid
|
<DataGrid
|
||||||
checkboxSelection
|
checkboxSelection
|
||||||
|
|
||||||
|
components={{
|
||||||
|
Toolbar: CustomToolbar
|
||||||
|
}}
|
||||||
|
componentsProps={{ toolbar: { data_colums: columns } }}
|
||||||
|
|
||||||
onSelectionModelChange={(newSelectionModel) => {
|
onSelectionModelChange={(newSelectionModel) => {
|
||||||
setSelectionModel(newSelectionModel);
|
setSelectionModel(newSelectionModel);
|
||||||
|
|
||||||
|
@ -5941,9 +6062,9 @@ const Apprenant = (props) => {
|
||||||
|
|
||||||
rowsPerPageOptions={[10]}
|
rowsPerPageOptions={[10]}
|
||||||
disableSelectionOnClick
|
disableSelectionOnClick
|
||||||
components={{
|
/* components={{
|
||||||
Toolbar: GridToolbar,
|
Toolbar: GridToolbar,
|
||||||
}}
|
}}*/
|
||||||
//sx={datagridSx}
|
//sx={datagridSx}
|
||||||
getCellClassName={(params) => {
|
getCellClassName={(params) => {
|
||||||
//field === 'distantiel'
|
//field === 'distantiel'
|
||||||
|
|
|
@ -83,6 +83,14 @@ import FormGroup from '@mui/material/FormGroup';
|
||||||
|
|
||||||
import Checkbox from '@mui/material/Checkbox';
|
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 DisplayPartnerSession = (props) => {
|
||||||
|
|
||||||
const history = useHistory();
|
const history = useHistory();
|
||||||
|
@ -199,9 +207,9 @@ const DisplayPartnerSession = (props) => {
|
||||||
const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(100);
|
const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(100);
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{ field: 'id', headerName: 'id', hide: true },
|
{ field: 'id', headerName: 'id', hide: true, disableExport: true, },
|
||||||
{ field: '_id', headerName: '_id', hide: true },
|
{ field: '_id', headerName: '_id', hide: true, disableExport: true, },
|
||||||
{ field: 'class_id', headerName: 'class_id', hide: true },
|
{ field: 'class_id', headerName: 'class_id', hide: true, disableExport: true, },
|
||||||
{ field: 'is_bpf', headerName: 'is_bpf', hide: true, },
|
{ field: 'is_bpf', headerName: 'is_bpf', hide: true, },
|
||||||
{ field: 'session_alert_message', headerName: 'session_alert_message', hide: true },
|
{ field: 'session_alert_message', headerName: 'session_alert_message', hide: true },
|
||||||
{ field: 'class_internal_url', headerName: 'class_internal_url', 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: '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: '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} />, },
|
{ 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: '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,
|
field: 'invoiced_statut', headerName: 'Facturé', minWidth: 100, flex: 1, maxWidth: 150, hide: false, editable: false,
|
||||||
renderCell: (cellValues) => {
|
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: '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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
|
|
||||||
|
@ -370,7 +377,7 @@ const DisplayPartnerSession = (props) => {
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
field: "delete", headerName: 'Supprimer',
|
field: "delete", headerName: 'Supprimer', disableExport: true,
|
||||||
renderCell: (cellValues) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
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 (
|
return (
|
||||||
<div className="displaypartnersession">
|
<div className="displaypartnersession">
|
||||||
|
|
||||||
|
@ -13976,6 +14093,10 @@ const DisplayPartnerSession = (props) => {
|
||||||
>
|
>
|
||||||
<DataGrid
|
<DataGrid
|
||||||
checkboxSelection
|
checkboxSelection
|
||||||
|
components={{
|
||||||
|
Toolbar: CustomToolbar
|
||||||
|
}}
|
||||||
|
componentsProps={{ toolbar: { data_colums: columns } }}
|
||||||
|
|
||||||
onSelectionModelChange={(newSelectionModel) => {
|
onSelectionModelChange={(newSelectionModel) => {
|
||||||
setSelectionModel(newSelectionModel);
|
setSelectionModel(newSelectionModel);
|
||||||
|
@ -14065,9 +14186,9 @@ const DisplayPartnerSession = (props) => {
|
||||||
|
|
||||||
rowsPerPageOptions={[10]}
|
rowsPerPageOptions={[10]}
|
||||||
disableSelectionOnClick
|
disableSelectionOnClick
|
||||||
components={{
|
/*components={{
|
||||||
Toolbar: GridToolbar,
|
Toolbar: GridToolbar,
|
||||||
}}
|
}}*/
|
||||||
//sx={datagridSx}
|
//sx={datagridSx}
|
||||||
getCellClassName={(params) => {
|
getCellClassName={(params) => {
|
||||||
|
|
||||||
|
@ -14269,6 +14390,11 @@ const DisplayPartnerSession = (props) => {
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<DataGrid
|
<DataGrid
|
||||||
|
|
||||||
|
components={{
|
||||||
|
Toolbar: CustomToolbar
|
||||||
|
}}
|
||||||
|
componentsProps={{ toolbar: { data_colums: columns } }}
|
||||||
checkboxSelection
|
checkboxSelection
|
||||||
|
|
||||||
onSelectionModelChange={(newSelectionModel) => {
|
onSelectionModelChange={(newSelectionModel) => {
|
||||||
|
@ -14357,9 +14483,9 @@ const DisplayPartnerSession = (props) => {
|
||||||
|
|
||||||
rowsPerPageOptions={[10]}
|
rowsPerPageOptions={[10]}
|
||||||
disableSelectionOnClick
|
disableSelectionOnClick
|
||||||
components={{
|
/* components={{
|
||||||
Toolbar: GridToolbar,
|
Toolbar: GridToolbar,
|
||||||
}}
|
}}*/
|
||||||
//sx={datagridSx}
|
//sx={datagridSx}
|
||||||
getCellClassName={(params) => {
|
getCellClassName={(params) => {
|
||||||
|
|
||||||
|
|
|
@ -60,6 +60,15 @@ import Module_Email_Management from "./Module_Email_Management";
|
||||||
import FormGroup from '@mui/material/FormGroup';
|
import FormGroup from '@mui/material/FormGroup';
|
||||||
import FormControlLabel from '@mui/material/FormControlLabel';
|
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 DisplayPartnerStagiaires = (props) => {
|
||||||
const history = useHistory();
|
const history = useHistory();
|
||||||
const [submenu, setsubmenu] = useState("");
|
const [submenu, setsubmenu] = useState("");
|
||||||
|
@ -95,11 +104,11 @@ const DisplayPartnerStagiaires = (props) => {
|
||||||
const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(80);
|
const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(80);
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{ field: '_id', headerName: '_id', 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 },
|
{ field: 'session_id', headerName: 'session_id', hide: true, editable: false, Width: 0 , disableExport: true,},
|
||||||
{ field: 'id', headerName: 'id', hide: true, Width: 0 },
|
{ field: 'id', headerName: 'id', hide: true, Width: 0 , disableExport: true,},
|
||||||
{ field: 'class_id', headerName: 'class_id', hide: true, Width: 0 },
|
{ 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 },
|
{ 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: 'telephone', headerName: 'Téléphone', hide: true, editable: false, Width: 0 },
|
||||||
{ field: 'date_naissance', headerName: 'date_naissance', 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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
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) => {
|
renderCell: (cellValues) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -437,7 +446,7 @@ const DisplayPartnerStagiaires = (props) => {
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
field: "Impr.", headerName: 'Imprimer detail',
|
field: "Impr.", headerName: 'Imprimer detail', disableExport: true,
|
||||||
renderCell: (cellValues) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
|
|
||||||
|
@ -455,7 +464,7 @@ const DisplayPartnerStagiaires = (props) => {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: "delete", headerName: 'Supprimer',
|
field: "delete", headerName: 'Supprimer', disableExport: true,
|
||||||
renderCell: (cellValues) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
|
|
||||||
|
@ -6536,6 +6545,113 @@ const DisplayPartnerStagiaires = (props) => {
|
||||||
setdisplay_stagiaire_with_alert(event.target.checked);
|
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 (
|
return (
|
||||||
<div className="displaypartnerstagiaire">
|
<div className="displaypartnerstagiaire">
|
||||||
|
@ -8005,6 +8121,10 @@ const DisplayPartnerStagiaires = (props) => {
|
||||||
>
|
>
|
||||||
<DataGrid
|
<DataGrid
|
||||||
checkboxSelection
|
checkboxSelection
|
||||||
|
components={{
|
||||||
|
Toolbar: CustomToolbar
|
||||||
|
}}
|
||||||
|
componentsProps={{ toolbar: { data_colums: columns } }}
|
||||||
|
|
||||||
onSelectionModelChange={(newSelectionModel) => {
|
onSelectionModelChange={(newSelectionModel) => {
|
||||||
setSelectionModel(newSelectionModel);
|
setSelectionModel(newSelectionModel);
|
||||||
|
@ -8107,9 +8227,9 @@ const DisplayPartnerStagiaires = (props) => {
|
||||||
|
|
||||||
rowsPerPageOptions={[10]}
|
rowsPerPageOptions={[10]}
|
||||||
disableSelectionOnClick
|
disableSelectionOnClick
|
||||||
components={{
|
/* components={{
|
||||||
Toolbar: GridToolbar,
|
Toolbar: GridToolbar,
|
||||||
}}
|
}}*/
|
||||||
//sx={datagridSx}
|
//sx={datagridSx}
|
||||||
getCellClassName={(params) => {
|
getCellClassName={(params) => {
|
||||||
//field === 'distantiel'
|
//field === 'distantiel'
|
||||||
|
|
|
@ -42,6 +42,14 @@ import { gridClasses } from '@mui/x-data-grid';
|
||||||
import Link from '@mui/material/Link';
|
import Link from '@mui/material/Link';
|
||||||
import { PiDotsThree } from "react-icons/pi";
|
import { PiDotsThree } from "react-icons/pi";
|
||||||
import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5";
|
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) => {
|
const DistplayPartnerTraningsPage = (props) => {
|
||||||
|
|
||||||
|
@ -397,8 +405,8 @@ const DistplayPartnerTraningsPage = (props) => {
|
||||||
const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(120);
|
const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(120);
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{ 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, },
|
{ field: '_id', headerName: '_id', hide: true, maxWidth: 1, disableExport: true, },
|
||||||
{ field: 'lms_class_code', headerName: 'lms_class_code', hide: true, Width: 0, },
|
{ field: 'lms_class_code', headerName: 'lms_class_code', hide: true, Width: 0, },
|
||||||
{ field: 'duration', headerName: 'duration', hide: true, Width: 0, },
|
{ field: 'duration', headerName: 'duration', hide: true, Width: 0, },
|
||||||
{ field: 'presentiel', headerName: 'Présentiel', 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: 'duration_in_hour', headerName: 'duration_in_hour', hide: true, Width: 0, editable: false, },
|
||||||
{ field: 'currency', headerName: 'currency', 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: 'zone_diffusion', headerName: 'zone_diffusion', hide: true, maxWidth: 1, editable: false, },
|
||||||
{ field: 'internal_url', headerName: 'internal_url', hide: true, 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} />, },
|
{ 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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
<nav style={{ "textAlign": "center" }}>
|
<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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
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.
|
{ "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 (
|
return (
|
||||||
|
|
||||||
<div className='displaypartnertrainingpagination'>
|
<div className='displaypartnertrainingpagination'>
|
||||||
|
@ -2291,6 +2406,11 @@ const DistplayPartnerTraningsPage = (props) => {
|
||||||
|
|
||||||
<DataGrid
|
<DataGrid
|
||||||
checkboxSelection
|
checkboxSelection
|
||||||
|
components={{
|
||||||
|
Toolbar: CustomToolbar
|
||||||
|
}}
|
||||||
|
componentsProps={{ toolbar: { data_colums: columns } }}
|
||||||
|
|
||||||
|
|
||||||
onSelectionModelChange={(newSelectionModel) => {
|
onSelectionModelChange={(newSelectionModel) => {
|
||||||
setSelectionModel(newSelectionModel);
|
setSelectionModel(newSelectionModel);
|
||||||
|
@ -2359,9 +2479,9 @@ const DistplayPartnerTraningsPage = (props) => {
|
||||||
|
|
||||||
rowsPerPageOptions={[10]}
|
rowsPerPageOptions={[10]}
|
||||||
disableSelectionOnClick
|
disableSelectionOnClick
|
||||||
components={{
|
/* components={{
|
||||||
Toolbar: GridToolbar,
|
Toolbar: GridToolbar,
|
||||||
}}
|
}}*/
|
||||||
|
|
||||||
getCellClassName={(params) => {
|
getCellClassName={(params) => {
|
||||||
if (params.field === 'published' && String(params.value) === "1") {
|
if (params.field === 'published' && String(params.value) === "1") {
|
||||||
|
|
|
@ -65,6 +65,14 @@ import CancelPresentationIcon from '@mui/icons-material/CancelPresentation';
|
||||||
import { IconButton } from '@material-ui/core';
|
import { IconButton } from '@material-ui/core';
|
||||||
import Paper from '@material-ui/core/Paper';
|
import Paper from '@material-ui/core/Paper';
|
||||||
import Draggable from 'react-draggable';
|
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) => ({
|
const useStyles = makeStyles((theme) => ({
|
||||||
|
|
||||||
|
@ -178,14 +186,14 @@ const Groupe_Apprenant = (props) => {
|
||||||
|
|
||||||
|
|
||||||
const columns_grp_apprenant = [
|
const columns_grp_apprenant = [
|
||||||
{ 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 },
|
{ 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: '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: '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: '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: '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} />,
|
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>
|
</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} />,
|
field: 'session_code', headerName: 'Classe', minWidth: 150, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />,
|
||||||
renderCell: (cellValues) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
<div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
|
<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}
|
{New_Getall_Partner_Session_Reduice_Fields_result.filter((data) => (data)._id === String(cellValues.row.session_id))[0].label}
|
||||||
</nav>}
|
</nav>}
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
<nav>
|
<nav>
|
||||||
|
@ -291,16 +316,15 @@ const Groupe_Apprenant = (props) => {
|
||||||
]
|
]
|
||||||
|
|
||||||
const columns_grp_membre = [
|
const columns_grp_membre = [
|
||||||
{ 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 },
|
{ 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: '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: '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: '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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
|
|
||||||
|
@ -840,7 +864,7 @@ const Groupe_Apprenant = (props) => {
|
||||||
// Cette fontion desactive tous les menu header et reactive just le menu_header concerné
|
// Cette fontion desactive tous les menu header et reactive just le menu_header concerné
|
||||||
function inactive_active_menu_header(current_menu_header) {
|
function inactive_active_menu_header(current_menu_header) {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const list_menu_header_names = ['detail_groupe', 'apprenant', 'piece_jointe', 'selection',]
|
const list_menu_header_names = ['detail_groupe', 'apprenant', 'piece_jointe', 'selection',]
|
||||||
for (let i = 0; i < list_menu_header_names.length; i++) {
|
for (let i = 0; i < list_menu_header_names.length; i++) {
|
||||||
|
@ -848,7 +872,7 @@ const Groupe_Apprenant = (props) => {
|
||||||
document.getElementsByName(String(list_menu_header_names[i]))[0].style.fontWeight = "400";
|
document.getElementsByName(String(list_menu_header_names[i]))[0].style.fontWeight = "400";
|
||||||
document.getElementsByName(String(list_menu_header_names[i]))[0].style.backgroundColor = "#d8edfc";
|
document.getElementsByName(String(list_menu_header_names[i]))[0].style.backgroundColor = "#d8edfc";
|
||||||
document.getElementsByName(String(list_menu_header_names[i]))[0].style.color = "#3b3e40";
|
document.getElementsByName(String(list_menu_header_names[i]))[0].style.color = "#3b3e40";
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1491,7 +1515,7 @@ const Groupe_Apprenant = (props) => {
|
||||||
setgrp_apprenant_data_edit_mode("");
|
setgrp_apprenant_data_edit_mode("");
|
||||||
clear_DetailFieds();
|
clear_DetailFieds();
|
||||||
|
|
||||||
handleClick_edit_evaluation_From_Line(gridline_id);
|
handleClick_edit_evaluation_From_Line(gridline_id);
|
||||||
|
|
||||||
if (selected_id && String(selected_id).length > 5) {
|
if (selected_id && String(selected_id).length > 5) {
|
||||||
Disable_Grp_Apprenant_DetailFields();
|
Disable_Grp_Apprenant_DetailFields();
|
||||||
|
@ -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 (
|
return (
|
||||||
<div className="groupe_apprenant">
|
<div className="groupe_apprenant">
|
||||||
{isLoading && <div className="loader-container">
|
{isLoading && <div className="loader-container">
|
||||||
|
@ -2865,6 +2997,12 @@ const Groupe_Apprenant = (props) => {
|
||||||
>
|
>
|
||||||
<DataGrid
|
<DataGrid
|
||||||
checkboxSelection
|
checkboxSelection
|
||||||
|
|
||||||
|
components={{
|
||||||
|
Toolbar: CustomToolbar
|
||||||
|
}}
|
||||||
|
componentsProps={{ toolbar: { data_colums: columns_grp_apprenant } }}
|
||||||
|
|
||||||
onSelectionModelChange={(newSelectionModel) => {
|
onSelectionModelChange={(newSelectionModel) => {
|
||||||
setselectionModel_grp_apprenant(newSelectionModel);
|
setselectionModel_grp_apprenant(newSelectionModel);
|
||||||
/*if (newSelectionModel.length === 1)
|
/*if (newSelectionModel.length === 1)
|
||||||
|
@ -2909,9 +3047,9 @@ const Groupe_Apprenant = (props) => {
|
||||||
|
|
||||||
rowsPerPageOptions={[10]}
|
rowsPerPageOptions={[10]}
|
||||||
disableSelectionOnClick
|
disableSelectionOnClick
|
||||||
components={{
|
/* components={{
|
||||||
Toolbar: GridToolbar,
|
Toolbar: GridToolbar,
|
||||||
}}
|
}}*/
|
||||||
//sx={datagridSx}
|
//sx={datagridSx}
|
||||||
getCellClassName={(params) => {
|
getCellClassName={(params) => {
|
||||||
|
|
||||||
|
@ -3204,8 +3342,8 @@ const Groupe_Apprenant = (props) => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="session_caract"> Code couleur
|
<div className="session_caract"> Code couleur
|
||||||
<nav className="disabled_style" style={{ backgroundColor: p_detail_color, borderRadius:'10px' , paddingTop:'5px'}}
|
<nav className="disabled_style" style={{ backgroundColor: p_detail_color, borderRadius: '10px', paddingTop: '5px' }}
|
||||||
|
|
||||||
> </nav>
|
> </nav>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
@ -3386,7 +3524,7 @@ const Groupe_Apprenant = (props) => {
|
||||||
setp_detail_type_groupe_code("");
|
setp_detail_type_groupe_code("");
|
||||||
setgrp_apprenant_data_changed("1");
|
setgrp_apprenant_data_changed("1");
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
|
|
||||||
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
|
renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
|
||||||
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
|
inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
|
||||||
|
@ -3400,7 +3538,7 @@ const Groupe_Apprenant = (props) => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="session_caract"> Code couleur
|
<div className="session_caract"> Code couleur
|
||||||
<nav className="disabled_style" style={{ backgroundColor: p_detail_color, cursor:'pointer', borderRadius:'10px' , paddingTop:'15px'}} onClick={(event, value) => {
|
<nav className="disabled_style" style={{ backgroundColor: p_detail_color, cursor: 'pointer', borderRadius: '10px', paddingTop: '15px' }} onClick={(event, value) => {
|
||||||
setDialog_GRP_COLOR_open(true)
|
setDialog_GRP_COLOR_open(true)
|
||||||
}}
|
}}
|
||||||
> Cliquer pour choisir </nav>
|
> Cliquer pour choisir </nav>
|
||||||
|
@ -3638,20 +3776,20 @@ const Groupe_Apprenant = (props) => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="session_caract"> Code couleur
|
<div className="session_caract"> Code couleur
|
||||||
<nav className="disabled_style" style={{ backgroundColor: p_detail_color, cursor:'pointer', borderRadius:'10px' , paddingTop:'15px'}} onClick={(event, value) => {
|
<nav className="disabled_style" style={{ backgroundColor: p_detail_color, cursor: 'pointer', borderRadius: '10px', paddingTop: '15px' }} onClick={(event, value) => {
|
||||||
setDialog_GRP_COLOR_open(true)
|
setDialog_GRP_COLOR_open(true)
|
||||||
}}
|
}}
|
||||||
> Cliquer pour choisir </nav>
|
> Cliquer pour choisir </nav>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div className="div_row" style={{ "border": "None" }}>
|
<div className="div_row" style={{ "border": "None" }}>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="div_row" style={{ "border": "None" }}>
|
<div className="div_row" style={{ "border": "None" }}>
|
||||||
|
@ -3918,6 +4056,10 @@ const Groupe_Apprenant = (props) => {
|
||||||
>
|
>
|
||||||
<DataGrid
|
<DataGrid
|
||||||
//onCellEditCommit={OnchangeCellDataGrid}
|
//onCellEditCommit={OnchangeCellDataGrid}
|
||||||
|
components={{
|
||||||
|
Toolbar: CustomToolbar
|
||||||
|
}}
|
||||||
|
componentsProps={{ toolbar: { data_colums: columns_grp_membre } }}
|
||||||
|
|
||||||
checkboxSelection
|
checkboxSelection
|
||||||
onSelectionModelChange={(newSelectionModel) => {
|
onSelectionModelChange={(newSelectionModel) => {
|
||||||
|
@ -3962,9 +4104,9 @@ const Groupe_Apprenant = (props) => {
|
||||||
|
|
||||||
rowsPerPageOptions={[10]}
|
rowsPerPageOptions={[10]}
|
||||||
disableSelectionOnClick
|
disableSelectionOnClick
|
||||||
components={{
|
/* components={{
|
||||||
Toolbar: GridToolbar,
|
Toolbar: GridToolbar,
|
||||||
}}
|
}}*/
|
||||||
//sx={datagridSx}
|
//sx={datagridSx}
|
||||||
getCellClassName={(params) => {
|
getCellClassName={(params) => {
|
||||||
|
|
||||||
|
|
|
@ -61,7 +61,13 @@ import Checkbox from '@mui/material/Checkbox';
|
||||||
import { FcOpenedFolder } from "react-icons/fc";
|
import { FcOpenedFolder } from "react-icons/fc";
|
||||||
|
|
||||||
import { useParams } from 'react-router-dom';
|
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) => ({
|
const useStyles = makeStyles((theme) => ({
|
||||||
|
|
||||||
|
@ -147,8 +153,8 @@ const Partner_Commande = (props) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
{ field: '_id', headerName: '_id', hide: true },
|
{ field: '_id', headerName: '_id', hide: true , disableExport: true,},
|
||||||
{ field: 'id', headerName: 'id', hide: 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_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 },
|
{ 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_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_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_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: '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) => {
|
renderCell: (cellValues) => {
|
||||||
return (
|
return (
|
||||||
|
|
||||||
|
@ -3974,7 +3980,6 @@ const Partner_Commande = (props) => {
|
||||||
|
|
||||||
function Check_Electronic_Sign_Before_Sending_Email() {
|
function Check_Electronic_Sign_Before_Sending_Email() {
|
||||||
if (partner_digital_signature_status && String(partner_digital_signature_status) === "1") {
|
if (partner_digital_signature_status && String(partner_digital_signature_status) === "1") {
|
||||||
|
|
||||||
setDialog_signature_digitale_open(true);
|
setDialog_signature_digitale_open(true);
|
||||||
} else {
|
} 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 (
|
return (
|
||||||
|
|
||||||
<div className="partner_commande">
|
<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
|
<Dialog
|
||||||
open={Dialog_signature_digitale_open}
|
open={Dialog_signature_digitale_open}
|
||||||
// onClose={Dialog_signature_digitale_handleClose}
|
// onClose={Dialog_signature_digitale_handleClose}
|
||||||
|
@ -4911,23 +5023,6 @@ const Partner_Commande = (props) => {
|
||||||
</DialogContentText>
|
</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" >
|
{String(partner_digital_signature_status) === "1" && <div className="session_caract_Dialog" >
|
||||||
<div className="session_caract_Dialog" >
|
<div className="session_caract_Dialog" >
|
||||||
<Tooltip className="tooltip_css" id="tooltip_signat_dig" style={{ "fontSize": "12px" }} />
|
<Tooltip className="tooltip_css" id="tooltip_signat_dig" style={{ "fontSize": "12px" }} />
|
||||||
|
@ -4962,7 +5057,7 @@ const Partner_Commande = (props) => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="div_row" style={{ "border": "None", "fontSize": "22px", "fontWeight": "600", "padding": "5px" }}>
|
<div className="div_row" style={{ "border": "None", "fontSize": "22px", "fontWeight": "600", "padding": "5px" }}>
|
||||||
Pièces jointes Convention
|
Pièces jointes
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -5021,12 +5116,8 @@ const Partner_Commande = (props) => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<DialogActions>
|
<DialogActions>
|
||||||
<div className="div_row">
|
<div className="div_row">
|
||||||
<div className="div_row_gauche">
|
<div className="div_row_gauche">
|
||||||
|
@ -6377,6 +6468,11 @@ const Partner_Commande = (props) => {
|
||||||
>
|
>
|
||||||
<DataGrid
|
<DataGrid
|
||||||
checkboxSelection
|
checkboxSelection
|
||||||
|
components={{
|
||||||
|
Toolbar: CustomToolbar
|
||||||
|
}}
|
||||||
|
componentsProps={{ toolbar: { data_colums: columns } }}
|
||||||
|
|
||||||
disableSelectionOnClick
|
disableSelectionOnClick
|
||||||
onSelectionModelChange={(newSelectionModel) => {
|
onSelectionModelChange={(newSelectionModel) => {
|
||||||
setSelectionModel(newSelectionModel);
|
setSelectionModel(newSelectionModel);
|
||||||
|
@ -6423,9 +6519,9 @@ const Partner_Commande = (props) => {
|
||||||
|
|
||||||
rowsPerPageOptions={[10]}
|
rowsPerPageOptions={[10]}
|
||||||
//disableSelectionOnClick
|
//disableSelectionOnClick
|
||||||
components={{
|
/* components={{
|
||||||
Toolbar: GridToolbar,
|
Toolbar: GridToolbar,
|
||||||
}}
|
}}*/
|
||||||
//sx={datagridSx}
|
//sx={datagridSx}
|
||||||
getCellClassName={(params) => {
|
getCellClassName={(params) => {
|
||||||
|
|
||||||
|
|
|
@ -15,6 +15,8 @@ import {
|
||||||
gridVisibleColumnFieldsSelector,
|
gridVisibleColumnFieldsSelector,
|
||||||
} from '@mui/x-data-grid';
|
} from '@mui/x-data-grid';
|
||||||
import * as XLSX from 'xlsx';
|
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 "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";
|
||||||
import { Editor } from '@tinymce/tinymce-react';
|
import { Editor } from '@tinymce/tinymce-react';
|
||||||
|
@ -61,7 +63,7 @@ import {
|
||||||
import { ContextMenu, ContextMenuTrigger } from "react-contextmenu";
|
import { ContextMenu, ContextMenuTrigger } from "react-contextmenu";
|
||||||
import zIndex from "@material-ui/core/styles/zIndex";
|
import zIndex from "@material-ui/core/styles/zIndex";
|
||||||
import { FcOpenedFolder } from "react-icons/fc";
|
import { FcOpenedFolder } from "react-icons/fc";
|
||||||
|
import Module_Historique_Action from "./Module_Historique_Action";
|
||||||
import { GridExportCsvOptions } from '@mui/x-data-grid';
|
import { GridExportCsvOptions } from '@mui/x-data-grid';
|
||||||
|
|
||||||
|
|
||||||
|
@ -1561,7 +1563,7 @@ const Partner_Facture = (props) => {
|
||||||
const stored_cookie = getCookie('tokenmysypart');
|
const stored_cookie = getCookie('tokenmysypart');
|
||||||
|
|
||||||
var nom_fichier_cmd = "Facture_" + invoice_internal_ref + ".pdf";
|
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;
|
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("token", stored_cookie);
|
||||||
form.append("invoice_id", selected_id);
|
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);
|
//console.log("### form = ", form);
|
||||||
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Send_Partner_Invoice_By_Email/";
|
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) {
|
function CustomToolbar(props) {
|
||||||
|
|
||||||
console.log(" my props = ", props);
|
// console.log(" my props = ", props);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<GridToolbarContainer {...props}>
|
<GridToolbarContainer {...props}>
|
||||||
|
@ -2587,6 +2594,113 @@ const Partner_Facture = (props) => {
|
||||||
|
|
||||||
// FIN EXPORT EXCEL DATAGRID
|
// 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 (
|
return (
|
||||||
|
|
||||||
|
@ -2807,6 +2921,167 @@ const Partner_Facture = (props) => {
|
||||||
</DialogActions>
|
</DialogActions>
|
||||||
</Dialog>
|
</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">
|
||||||
|
|
||||||
|
</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 */}
|
{/*** Paiement */}
|
||||||
<Dialog
|
<Dialog
|
||||||
open={Dialog_Paiement_1_open}
|
open={Dialog_Paiement_1_open}
|
||||||
|
@ -2922,8 +3197,6 @@ const Partner_Facture = (props) => {
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
|
|
||||||
|
|
||||||
|
@ -4108,7 +4381,17 @@ const Partner_Facture = (props) => {
|
||||||
|
|
||||||
<div style={{ "width": "23%", "float": "left", "textAlign": "right", "paddingTop": "2rem" }}>
|
<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={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"> </div>
|
<div className="div_row"> </div>
|
||||||
<Button variant="outlined" onClick={(event) => {
|
<Button variant="outlined" onClick={(event) => {
|
||||||
|
|
Loading…
Reference in New Issue