recette2
cherif 2024-10-11 14:19:20 +02:00
parent 77368feb32
commit 1a992b8809
8 changed files with 171 additions and 113 deletions

View File

@ -58,7 +58,10 @@ import {
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector, gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector, gridVisibleColumnFieldsSelector,
} from '@mui/x-data-grid'; GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid';
import * as XLSX from 'xlsx'; import * as XLSX from 'xlsx';
const Apprenant = (props) => { const Apprenant = (props) => {
@ -333,7 +336,7 @@ const Apprenant = (props) => {
<div className="gest_content"> <div className="gest_content">
{' '} {' '}
En confirmant cette opération, la session de formation sera <i><font color="red"> définitivement supprimée</font></i>. <br /> En confirmant cette opération, l'inscription sera <i><font color="red"> définitivement supprimée</font></i>. <br />
</div> </div>
<div className="gest_actions"> <div className="gest_actions">
@ -4880,27 +4883,30 @@ function ExportButton(props) {
function handleExport(apiRef, data_colums) { function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef); const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = { const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { keys: visibleColumnsField,
if (mydata.field)
return mydata.field;
else
return "";
}),
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName) if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName; return mydata.headerName;
else }
return ""; }
}), }),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"),
}; };
local_config.columnNames = local_config.columnNames.filter(function( element ) {
return element !== undefined;
});
const rows = data.map((row) => { const rows = data.map((row) => {
const mRow = {}; const mRow = {};
for (const key of local_config.keys) { for (const key of local_config.keys) {

View File

@ -88,6 +88,9 @@ import {
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector, gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector, gridVisibleColumnFieldsSelector,
GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid'; } from '@mui/x-data-grid';
import * as XLSX from 'xlsx'; import * as XLSX from 'xlsx';
@ -206,6 +209,9 @@ const DisplayPartnerSession = (props) => {
const [datagrid_columns_size_model1, setdatagrid_columns_size_model1] = useState(200); const [datagrid_columns_size_model1, setdatagrid_columns_size_model1] = useState(200);
const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(100); const [datagrid_columns_size_model2, setdatagrid_columns_size_model2] = useState(100);
// zzzz
const columns = [ const columns = [
{ field: 'id', headerName: 'id', hide: true, disableExport: true, }, { field: 'id', headerName: 'id', hide: true, disableExport: true, },
{ field: '_id', headerName: '_id', hide: true, disableExport: true, }, { field: '_id', headerName: '_id', hide: true, disableExport: true, },
@ -436,10 +442,9 @@ const DisplayPartnerSession = (props) => {
); );
} }
}, },
] ]
const columns_preinscrit = [ const columns_preinscrit = [
{ field: 'id', headerName: 'id', hide: true }, { field: 'id', headerName: 'id', hide: true },
{ field: '_id', headerName: '_id', hide: true }, { field: '_id', headerName: '_id', hide: true },
@ -3167,7 +3172,7 @@ const DisplayPartnerSession = (props) => {
const New_status_inscription_add = [ const New_status_inscription_add = [
{ "id": "0", "label": "PréInscription", "value": "0" }, { "id": "0", "label": "PréInscription", "value": "0" },
// { "id": "1", "label": "Inscription", "value": "1" }, { "id": "1", "label": "Inscription", "value": "1" },
{ "id": "2", "label": "En Cours", "value": "2" }, { "id": "2", "label": "En Cours", "value": "2" },
] ]
@ -11281,8 +11286,6 @@ const DisplayPartnerSession = (props) => {
function CustomToolbar(props) { function CustomToolbar(props) {
console.log(" my props = ", props);
return ( return (
<GridToolbarContainer {...props}> <GridToolbarContainer {...props}>
@ -11303,11 +11306,12 @@ const DisplayPartnerSession = (props) => {
// Select rows and columns // Select rows and columns
const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef); const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef); const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
// Format the data. Here we only keep the value // Format the data. Here we only keep the value
const data = filteredSortedRowIds.map((id) => { const data = filteredSortedRowIds.map((id) => {
const row = {}; const row = {};
visibleColumnsField.forEach((field) => { visibleColumnsField.forEach((field) => {
row[field] = apiRef.current.getCellParams(id, field).value; row[field] = apiRef.current.getCellParams(id, field).value;
}); });
return row; return row;
@ -11327,27 +11331,30 @@ const DisplayPartnerSession = (props) => {
function handleExport(apiRef, data_colums) { function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef); const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = { const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { keys: visibleColumnsField,
if (mydata.field)
return mydata.field;
else
return "";
}),
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName) if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName; return mydata.headerName;
else }
return ""; }
}), }),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"),
}; };
local_config.columnNames = local_config.columnNames.filter(function( element ) {
return element !== undefined;
});
const rows = data.map((row) => { const rows = data.map((row) => {
const mRow = {}; const mRow = {};
for (const key of local_config.keys) { for (const key of local_config.keys) {
@ -11368,6 +11375,7 @@ const DisplayPartnerSession = (props) => {
function ExportMenuItem(props) { function ExportMenuItem(props) {
const apiRef = useGridApiContext(); const apiRef = useGridApiContext();
const { hideMenu } = props; const { hideMenu } = props;
return ( return (
@ -11432,9 +11440,6 @@ const DisplayPartnerSession = (props) => {
} }
/> />
</DialogContent> </DialogContent>
@ -14097,7 +14102,6 @@ const DisplayPartnerSession = (props) => {
Toolbar: CustomToolbar Toolbar: CustomToolbar
}} }}
componentsProps={{ toolbar: { data_colums: columns } }} componentsProps={{ toolbar: { data_colums: columns } }}
onSelectionModelChange={(newSelectionModel) => { onSelectionModelChange={(newSelectionModel) => {
setSelectionModel(newSelectionModel); setSelectionModel(newSelectionModel);
/*if (newSelectionModel.length === 1) /*if (newSelectionModel.length === 1)

View File

@ -65,7 +65,11 @@ import {
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector, gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector, gridVisibleColumnFieldsSelector,
GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid'; } from '@mui/x-data-grid';
import * as XLSX from 'xlsx'; import * as XLSX from 'xlsx';
@ -445,7 +449,7 @@ const DisplayPartnerStagiaires = (props) => {
} }
}, },
{ /*{
field: "Impr.", headerName: 'Imprimer detail', disableExport: true, field: "Impr.", headerName: 'Imprimer detail', disableExport: true,
renderCell: (cellValues) => { renderCell: (cellValues) => {
return ( return (
@ -462,7 +466,7 @@ const DisplayPartnerStagiaires = (props) => {
); );
} }
}, },*/
{ {
field: "delete", headerName: 'Supprimer', disableExport: true, field: "delete", headerName: 'Supprimer', disableExport: true,
renderCell: (cellValues) => { renderCell: (cellValues) => {
@ -6595,27 +6599,30 @@ function ExportButton(props) {
function handleExport(apiRef, data_colums) { function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef); const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = { const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { keys: visibleColumnsField,
if (mydata.field)
return mydata.field;
else
return "";
}),
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName) if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName; return mydata.headerName;
else }
return ""; }
}), }),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"),
}; };
local_config.columnNames = local_config.columnNames.filter(function( element ) {
return element !== undefined;
});
const rows = data.map((row) => { const rows = data.map((row) => {
const mRow = {}; const mRow = {};
for (const key of local_config.keys) { for (const key of local_config.keys) {

View File

@ -47,7 +47,10 @@ import {
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector, gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector, gridVisibleColumnFieldsSelector,
} from '@mui/x-data-grid'; GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid';
import * as XLSX from 'xlsx'; import * as XLSX from 'xlsx';
@ -1813,27 +1816,30 @@ function ExportButton(props) {
function handleExport(apiRef, data_colums) { function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef); const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = { const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { keys: visibleColumnsField,
if (mydata.field)
return mydata.field;
else
return "";
}),
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName) if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName; return mydata.headerName;
else }
return ""; }
}), }),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"),
}; };
local_config.columnNames = local_config.columnNames.filter(function( element ) {
return element !== undefined;
});
const rows = data.map((row) => { const rows = data.map((row) => {
const mRow = {}; const mRow = {};
for (const key of local_config.keys) { for (const key of local_config.keys) {

View File

@ -70,6 +70,9 @@ import {
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector, gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector, gridVisibleColumnFieldsSelector,
GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid'; } from '@mui/x-data-grid';
import * as XLSX from 'xlsx'; import * as XLSX from 'xlsx';
@ -2220,27 +2223,30 @@ const Groupe_Apprenant = (props) => {
function handleExport(apiRef, data_colums) { function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef); const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = { const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { keys: visibleColumnsField,
if (mydata.field)
return mydata.field;
else
return "";
}),
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName) if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName; return mydata.headerName;
else }
return ""; }
}), }),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"),
}; };
local_config.columnNames = local_config.columnNames.filter(function( element ) {
return element !== undefined;
});
const rows = data.map((row) => { const rows = data.map((row) => {
const mRow = {}; const mRow = {};
for (const key of local_config.keys) { for (const key of local_config.keys) {

View File

@ -66,6 +66,9 @@ import {
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext, GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector, gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector, gridVisibleColumnFieldsSelector,
GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid'; } from '@mui/x-data-grid';
import * as XLSX from 'xlsx'; import * as XLSX from 'xlsx';
@ -4652,27 +4655,30 @@ const Partner_Commande = (props) => {
function handleExport(apiRef, data_colums) { function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef); const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = { const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { keys: visibleColumnsField,
if (mydata.field)
return mydata.field;
else
return "";
}),
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName) if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName; return mydata.headerName;
else }
return ""; }
}), }),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"),
}; };
local_config.columnNames = local_config.columnNames.filter(function( element ) {
return element !== undefined;
});
const rows = data.map((row) => { const rows = data.map((row) => {
const mRow = {}; const mRow = {};
for (const key of local_config.keys) { for (const key of local_config.keys) {
@ -4690,7 +4696,6 @@ const Partner_Commande = (props) => {
XLSX.utils.book_append_sheet(workbook, worksheet, local_config.sheetName); XLSX.utils.book_append_sheet(workbook, worksheet, local_config.sheetName);
XLSX.writeFile(workbook, local_config.fileName, { compression: true }); XLSX.writeFile(workbook, local_config.fileName, { compression: true });
} }
function ExportMenuItem(props) { function ExportMenuItem(props) {
const apiRef = useGridApiContext(); const apiRef = useGridApiContext();
const { hideMenu } = props; const { hideMenu } = props;

View File

@ -9,10 +9,8 @@ import { getCookie, setCookie } from 'react-use-cookie';
import { useHistory } from "react-router-dom"; import { useHistory } from "react-router-dom";
import CheckOut from "./CheckOut"; import CheckOut from "./CheckOut";
import { import {
DataGrid, frFR, GridToolbar, GridToolbarExport, GridToolbarColumnsButton, DataGrid, frFR, GridToolbar,
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector,
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 { Fab } from "@material-ui/core";
@ -54,8 +52,12 @@ import Link from '@mui/material/Link';
import { PiDotsThree } from "react-icons/pi"; import { PiDotsThree } from "react-icons/pi";
import { gridClasses } from '@mui/x-data-grid'; import { gridClasses } from '@mui/x-data-grid';
import { import {
GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton,
GridToolbarContainer, GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector,
GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid'; } from '@mui/x-data-grid';
@ -2536,27 +2538,30 @@ const Partner_Facture = (props) => {
function handleExport(apiRef, data_colums) { function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef); const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = { const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { keys: visibleColumnsField,
if (mydata.field)
return mydata.field;
else
return "";
}),
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) { columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName) if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName; return mydata.headerName;
else }
return ""; }
}), }),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx', fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"), sheetName: 'Export_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_"),
}; };
local_config.columnNames = local_config.columnNames.filter(function( element ) {
return element !== undefined;
});
const rows = data.map((row) => { const rows = data.map((row) => {
const mRow = {}; const mRow = {};
for (const key of local_config.keys) { for (const key of local_config.keys) {
@ -3663,7 +3668,7 @@ const Partner_Facture = (props) => {
} }
selectionModel={selectionModel} selectionModel={selectionModel}
// localeText={frFR.components.MuiDataGrid.defaultProps.localeText} localeText={frFR.components.MuiDataGrid.defaultProps.localeText}
rows={rowss.map((item, index) => ( rows={rowss.map((item, index) => (
{ {
id: index, id: index,

View File

@ -162,6 +162,8 @@ const TestUrl_New = (props) => {
} }
function handleExport(apiRef, data_colums) { function handleExport(apiRef, data_colums) {
console.log(" coucouuu ### columnVisibilityModel = ", columnVisibilityModel);
const data = getExcelData(apiRef); const data = getExcelData(apiRef);
const local_config = { const local_config = {
@ -843,6 +845,12 @@ const TestUrl_New = (props) => {
function display_data() { function display_data() {
console.log(" Data = ", data); console.log(" Data = ", data);
} }
const [columnVisibilityModel, setColumnVisibilityModel] = React.useState({
});
const [visibleColumns, setVisibleColumns] = React.useState();
return ( return (
<div className="testurl_new"> <div className="testurl_new">
@ -1034,7 +1042,18 @@ const TestUrl_New = (props) => {
components={{ components={{
Toolbar: CustomToolbar Toolbar: CustomToolbar
}} }}
componentsProps={{ toolbar: { data_colums: data.columns } }} componentsProps={{
toolbar: { data_colums: data.columns }
}}
columnVisibilityModel={columnVisibilityModel}
onColumnVisibilityModelChange={(newModel) => {
setColumnVisibilityModel(newModel);
}}
/> />
</div> </div>