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

@ -54,11 +54,14 @@ import { gridClasses } from '@mui/x-data-grid';
import Link from '@mui/material/Link';
import { PiDotsThree } from "react-icons/pi";
import {
GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton,
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector,
} from '@mui/x-data-grid';
GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton,
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector,
GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid';
import * as XLSX from 'xlsx';
const Apprenant = (props) => {
@ -333,7 +336,7 @@ const Apprenant = (props) => {
<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 className="gest_actions">
@ -4880,27 +4883,30 @@ function ExportButton(props) {
function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.field)
return mydata.field;
else
return "";
}),
keys: visibleColumnsField,
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName)
return mydata.headerName;
else
return "";
if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName;
}
}
}),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
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 mRow = {};
for (const key of local_config.keys) {

View File

@ -88,6 +88,9 @@ import {
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector,
GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid';
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_model2, setdatagrid_columns_size_model2] = useState(100);
// zzzz
const columns = [
{ 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 = [
{ field: 'id', headerName: 'id', hide: true },
{ field: '_id', headerName: '_id', hide: true },
@ -3167,7 +3172,7 @@ const DisplayPartnerSession = (props) => {
const New_status_inscription_add = [
{ "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" },
]
@ -11281,8 +11286,6 @@ const DisplayPartnerSession = (props) => {
function CustomToolbar(props) {
console.log(" my props = ", props);
return (
<GridToolbarContainer {...props}>
@ -11303,11 +11306,12 @@ const DisplayPartnerSession = (props) => {
// 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;
@ -11327,27 +11331,30 @@ const DisplayPartnerSession = (props) => {
function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.field)
return mydata.field;
else
return "";
}),
keys: visibleColumnsField,
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName)
return mydata.headerName;
else
return "";
if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName;
}
}
}),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
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 mRow = {};
for (const key of local_config.keys) {
@ -11368,6 +11375,7 @@ const DisplayPartnerSession = (props) => {
function ExportMenuItem(props) {
const apiRef = useGridApiContext();
const { hideMenu } = props;
return (
@ -11432,9 +11440,6 @@ const DisplayPartnerSession = (props) => {
}
/>
</DialogContent>
@ -14097,7 +14102,6 @@ const DisplayPartnerSession = (props) => {
Toolbar: CustomToolbar
}}
componentsProps={{ toolbar: { data_colums: columns } }}
onSelectionModelChange={(newSelectionModel) => {
setSelectionModel(newSelectionModel);
/*if (newSelectionModel.length === 1)
@ -14483,9 +14487,9 @@ const DisplayPartnerSession = (props) => {
rowsPerPageOptions={[10]}
disableSelectionOnClick
/* components={{
Toolbar: GridToolbar,
}}*/
/* components={{
Toolbar: GridToolbar,
}}*/
//sx={datagridSx}
getCellClassName={(params) => {

View File

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

View File

@ -43,11 +43,14 @@ import Link from '@mui/material/Link';
import { PiDotsThree } from "react-icons/pi";
import { IoAddCircleOutline, IoCloseCircleOutline } from "react-icons/io5";
import {
GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton,
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector,
} from '@mui/x-data-grid';
GridToolbarContainer, GridToolbarExport, GridToolbarColumnsButton,
GridToolbarFilterButton, GridToolbarDensitySelector, GridToolbarExportContainer, useGridApiContext,
gridFilteredSortedRowIdsSelector,
gridVisibleColumnFieldsSelector,
GridValueGetterParams,
GridPreferencePanelsValue,
} from '@mui/x-data-grid';
import * as XLSX from 'xlsx';
@ -1813,27 +1816,30 @@ function ExportButton(props) {
function handleExport(apiRef, data_colums) {
const data = getExcelData(apiRef);
const visibleColumnsField = gridVisibleColumnFieldsSelector(apiRef);
const local_config = {
keys: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.field)
return mydata.field;
else
return "";
}),
keys: visibleColumnsField,
columnNames: data_colums.filter((mydata) => (mydata).disableExport !== true).map(function (mydata) {
if (mydata.headerName)
return mydata.headerName;
else
return "";
if (mydata.headerName && visibleColumnsField.includes(mydata.field)) {
if (mydata.headerName) {
return mydata.headerName;
}
}
}),
fileName: 'data_' + String(new Date().toJSON().slice(0, 10)).replaceAll("-", "_") + '.xlsx',
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 mRow = {};
for (const key of local_config.keys) {

View File

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

View File

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

View File

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

View File

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