08/02/2024 -20h

recette2
cherif 2024-02-08 21:51:30 +01:00
parent b0b17dbb26
commit a0e33d7fcc
9 changed files with 448 additions and 113 deletions

View File

@ -25,6 +25,9 @@ import 'reactjs-popup/dist/index.css';
import ToggleSwitch from "./ToggleSwitch"; import ToggleSwitch from "./ToggleSwitch";
import { FcSpeaker } from "react-icons/fc"; import { FcSpeaker } from "react-icons/fc";
import Autocomplete from '@mui/material/Autocomplete'; import Autocomplete from '@mui/material/Autocomplete';
import { gridClasses } from '@mui/x-data-grid';
import Link from '@mui/material/Link';
import { PiDotsThree } from "react-icons/pi";
const AddParnerClient = (props) => { const AddParnerClient = (props) => {
@ -88,6 +91,48 @@ const AddParnerClient = (props) => {
const [selected_contact_id, setelected_contact_id] = useState(""); const [selected_contact_id, setelected_contact_id] = useState("");
function ExpandableCell_50({ value }) {
const [expanded, setExpanded] = React.useState(false);
return (
<nav>
{value && <div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
{expanded ? value : String(value).slice(0, 50)}&nbsp;
{value.length > 50 && (
// eslint-disable-next-line jsx-a11y/anchor-is-valid
<Link
type="button"
component="button"
sx={{ fontSize: 'inherit' }}
onClick={() => setExpanded(!expanded)}
>
{expanded ? <nav> <PiDotsThree />Réduire</nav> : <nav> <PiDotsThree />Voir</nav>}
</Link>
)}
</div>}
{!value && <div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
&nbsp;
</div>
}
</nav>
);
}
function Display_Colunm_text({ value }) {
return (
<div style={{ paddingLeft: "5px", paddingRight: "10px", "display": "block", wordBreak: "break-all" }}>
{value}&nbsp;
</div>
);
}
function sleep(ms) { function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms)); return new Promise(resolve => setTimeout(resolve, ms));
@ -1885,8 +1930,8 @@ const AddParnerClient = (props) => {
form.append("fonction", contact_fonction); form.append("fonction", contact_fonction);
var contact_civilite = "" var contact_civilite = ""
if (document.getElementsByName("contact_civilite")) { if (p_contact_civilite) {
contact_civilite = document.getElementsByName("contact_civilite")[0].value; contact_civilite = p_contact_civilite;
} }
form.append("civilite", contact_civilite); form.append("civilite", contact_civilite);
@ -2212,6 +2257,7 @@ const AddParnerClient = (props) => {
{ "id": "Mme", "label": "Mme", "value": "Mme" }, { "id": "Mme", "label": "Mme", "value": "Mme" },
{ "id": "M", "label": "M", "value": "M" }, { "id": "M", "label": "M", "value": "M" },
{ "id": "Neutre", "label": "Neutre", "value": "Neutre" }, { "id": "Neutre", "label": "Neutre", "value": "Neutre" },
{ "id": "", "label": "", "value": "" },
] ]
return ( return (
@ -3043,11 +3089,12 @@ const AddParnerClient = (props) => {
name="contact_civilite" name="contact_civilite"
id="contact_civilite" id="contact_civilite"
className="disabled_style enable_style" className="disabled_style enable_style"
value={New_civilite.filter((data) => (data).value === String(p_contact_civilite))[0].label}
options={New_civilite} options={New_civilite}
onChange={(event, value) => { onChange={(event, value) => {
if (value && value.value) { if (value && value.value) {
setp_contact_civilite(value.value); setp_contact_civilite(value.value);
setdatamodification_contact("1");
} }
}} }}
renderInput={(params) => <TextField {...params} label="" /> renderInput={(params) => <TextField {...params} label="" />
@ -3081,7 +3128,7 @@ const AddParnerClient = (props) => {
<TextField <TextField
required required
name="contact_civilite" name="contact_civilite"
label="Civilité" //label=""
InputLabelProps={{ InputLabelProps={{
shrink: true, shrink: true,
}} }}
@ -3089,7 +3136,7 @@ const AddParnerClient = (props) => {
disabled={false} disabled={false}
className="disabled_style" className="disabled_style"
value={p_contact_civilite} value={p_contact_civilite}
onChange={(e) => setp_contact_civilite(e.target.value)}
/> />

View File

@ -2072,13 +2072,13 @@ const DisplayPartnerSession = (props) => {
if (document.getElementById("emargement")) { if (document.getElementById("emargement")) {
document.getElementById("emargement").style.backgroundColor = "#d8edfc"; document.getElementById("emargement").style.backgroundColor = "#d8edfc";
document.getElementById("emargement").style.color = "black"; document.getElementById("emargement").style.color = "black";
document.getElementById("emargement").style.fontWeight = "black"; document.getElementById("emargement").style.fontWeight = "normal";
} }
if (document.getElementById("attestation")) { if (document.getElementById("attestation")) {
document.getElementById("attestation").style.backgroundColor = "#d8edfc"; document.getElementById("attestation").style.backgroundColor = "#d8edfc";
document.getElementById("attestation").style.color = "black"; document.getElementById("attestation").style.color = "black";
document.getElementById("attestation").style.fontWeight = "black"; document.getElementById("attestation").style.fontWeight = "normal";
} }
if (document.getElementById("editique")) { if (document.getElementById("editique")) {
@ -6162,7 +6162,7 @@ const DisplayPartnerSession = (props) => {
form.append("token", stored_cookie); form.append("token", stored_cookie);
form.append("session_id", selected_session_id); form.append("session_id", selected_session_id);
form.append("tab_ids", local_tab_ids); form.append("tab_ids", local_tab_ids);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/SendTrainingEvaluationEmail_from_tab_ids/"; var myurl = process.env.REACT_APP_API_URL + "myclass/api/SendTrainingEvaluationEmail_from_tab_ids/";
setLoading(true); setLoading(true);
@ -6180,7 +6180,7 @@ const DisplayPartnerSession = (props) => {
GetListeInscrit(selected_session_id, selected_internal_url); GetListeInscrit(selected_session_id, selected_internal_url);
GetListeEmargement(selected_session_id, selected_internal_url); GetListeEmargement(selected_session_id, selected_internal_url);
GetListeEvaluation(selected_session_id); GetListeEvaluation(selected_session_id);
alert(res.data.message); alert(res.data.message);
} else if (String(res.data.status) === String("Err_Connexion")) { } else if (String(res.data.status) === String("Err_Connexion")) {
@ -9056,7 +9056,7 @@ const DisplayPartnerSession = (props) => {
.then((data) => data.json()) .then((data) => data.json())
.then((data) => { .then((data) => {
setLoading(false); setLoading(false);
console.log('GetListeEvaluation -- Success:', data['message'], "data['status'] = ", data['status']); //console.log('GetListeEvaluation -- Success:', data['message'], "data['status'] = ", data['status']);
setGetListePreinscrit_evaluation_result(data['message']); setGetListePreinscrit_evaluation_result(data['message']);
setRows_evaluation(data['message']); setRows_evaluation(data['message']);
if (String(data['status']) === String("Err_Connexion")) { if (String(data['status']) === String("Err_Connexion")) {
@ -9117,19 +9117,19 @@ const DisplayPartnerSession = (props) => {
var liste_formation = GetSelectedRows_Evaluation_Ids(); var liste_formation = GetSelectedRows_Evaluation_Ids();
var tab_ids_inscription = [] var tab_ids_inscription = []
for (var i = 0; i < selectionModel_evaluation.length; i++) { for (var i = 0; i < selectionModel_evaluation.length; i++) {
var myid = parseInt(String(selectionModel_evaluation[i])); var myid = parseInt(String(selectionModel_evaluation[i]));
var line = JSON.parse(rowss_evaluation[myid]); var line = JSON.parse(rowss_evaluation[myid]);
var line_id = JSON.parse(rowss_evaluation[myid])._id; var line_id = JSON.parse(rowss_evaluation[myid])._id;
tab_ids_inscription.push(line_id); tab_ids_inscription.push(line_id);
} }
SendEvaluationEmail_Many_Ids(tab_ids_inscription); SendEvaluationEmail_Many_Ids(tab_ids_inscription);
} }
function PrintEvaluationDetail() { function PrintEvaluationDetail() {
@ -10634,7 +10634,7 @@ const DisplayPartnerSession = (props) => {
<Button variant="outlined" onClick={submenu_emargement} className="detail_class_submenu" id='emargement' name='emargement'>Emargement </Button> <Button variant="outlined" onClick={submenu_emargement} className="detail_class_submenu" id='emargement' name='emargement'>Emargement </Button>
<Button variant="outlined" onClick={submenu_evaluation} className="detail_class_submenu" id='menu_eval' name='menu_eval'>Les avis</Button> <Button variant="outlined" onClick={submenu_evaluation} className="detail_class_submenu" id='menu_eval' name='menu_eval'>Les avis</Button>
<Button variant="outlined" onClick={submenu_attestation} className="detail_class_submenu" id='menu_eval' name='menu_eval'>Attestation</Button> <Button variant="outlined" onClick={submenu_attestation} className="detail_class_submenu" id='menu_eval' name='menu_eval'>Attestation</Button>
<Button variant="outlined" onClick={submenu_historique} className="detail_class_submenu" id='historique' name='historique'>Historique </Button> <Button variant="outlined" onClick={submenu_historique} className="detail_class_submenu" id='historique' name='historique'>Historique </Button>
</div>} </div>}
@ -15167,50 +15167,98 @@ const DisplayPartnerSession = (props) => {
}}>Actualiser la liste</Button><br /> }}>Actualiser la liste</Button><br />
</div> </div>
<div className="session_data" style={{ height: 500, width: '100%' }}> <div className="session_data" style={{height: "750px", width: '100%', padding:"10px" }}>
<Box
sx={{
height: "500px",
width: '100%',
paddingRight: '2px',
"& .MuiDataGrid-columnHeaders": {
backgroundColor: "#c8cfd5",
color: "black",
fontSize: 14
},
'& .line--emarg_envoye': {
backgroundColor: '#ffffcc',
color: 'black',
},
'& .line--emarg_fait': {
backgroundColor: '#ccffcc',
color: 'black',
fontWeight:'600',
},
<DataGrid
checkboxSelection
onSelectionModelChange={(newSelectionModel_emarg) => {
setSelectionModel_emarg(newSelectionModel_emarg);
//console.log("ch selected--" + newSelectionModel_emarg);
}} }}
>
<DataGrid
checkboxSelection
onSelectionModelChange={(newSelectionModel_emarg) => {
setSelectionModel_emarg(newSelectionModel_emarg);
//console.log("ch selected--" + newSelectionModel_emarg);
selectionModel={selectionModel_emarg} }}
localeText={frFR.components.MuiDataGrid.defaultProps.localeText}
rows={rowss_emarg.map((item, index) => (
{
id: index,
_id: JSON.parse(item)._id,
nom: JSON.parse(item).nom,
prenom: JSON.parse(item).prenom,
email: JSON.parse(item).email,
date: JSON.parse(item).date,
matin: JSON.parse(item).matin,
apresmidi: JSON.parse(item).apresmidi,
sequence_start: JSON.parse(item).sequence_start, selectionModel={selectionModel_emarg}
sequence_end: JSON.parse(item).sequence_end, localeText={frFR.components.MuiDataGrid.defaultProps.localeText}
is_present: JSON.parse(item).is_present, rows={rowss_emarg.map((item, index) => (
{
id: index,
_id: JSON.parse(item)._id,
nom: JSON.parse(item).nom,
prenom: JSON.parse(item).prenom,
email: JSON.parse(item).email,
date: JSON.parse(item).date,
matin: JSON.parse(item).matin,
apresmidi: JSON.parse(item).apresmidi,
statut: JSON.parse(item).statut, sequence_start: JSON.parse(item).sequence_start,
date_envoi: JSON.parse(item).date_envoi, sequence_end: JSON.parse(item).sequence_end,
} is_present: JSON.parse(item).is_present,
))}
columns={columns_list_emargement} statut: JSON.parse(item).statut,
pageSize={10} date_envoi: JSON.parse(item).date_envoi,
className="datagridclass" }
))}
rowsPerPageOptions={[10]} columns={columns_list_emargement}
disableSelectionOnClick pageSize={10}
components={{ className="datagridclass"
Toolbar: GridToolbar,
}}
rowsPerPageOptions={[10]}
disableSelectionOnClick
components={{
Toolbar: GridToolbar,
}}
getRowClassName={(params) => {
if (String(params.row.statut) === "0") {
return 'line--emarg_init';
}
if (String(params.row.statut) === "1") {
return 'line--emarg_envoye';
}
if (String(params.row.statut) === "2") {
return 'line--emarg_fait';
}
}}
/>
</Box>
/>
<div className="div_row"> &nbsp; </div> <div className="div_row"> &nbsp; </div>
<div className="div_row"> <div className="div_row">
{selectionModel_emarg && selectionModel_emarg.length >= 1 && {selectionModel_emarg && selectionModel_emarg.length >= 1 &&
@ -15338,8 +15386,35 @@ const DisplayPartnerSession = (props) => {
GetListeEvaluation(selected_session_id); GetListeEvaluation(selected_session_id);
}}>Actualiser la liste</Button><br /> }}>Actualiser la liste</Button><br />
</div> </div>
<div style={{ height: "600px", width: '100%' }} className="session_data"> <div style={{ height: "750px", width: '100%', padding:"10px" }} className="session_data">
<Box
sx={{
height: "500px",
width: '100%',
paddingRight: '2px',
"& .MuiDataGrid-columnHeaders": {
backgroundColor: "#c8cfd5",
color: "black",
fontSize: 14
},
'& .line--eval_envoye': {
backgroundColor: '#ffffcc',
color: 'black',
},
'& .line--eval_fait': {
backgroundColor: '#ccffcc',
color: 'black',
fontWeight:'600',
},
}}
>
<DataGrid <DataGrid
checkboxSelection checkboxSelection
onSelectionModelChange={(newSelectionModel_evaluation) => { onSelectionModelChange={(newSelectionModel_evaluation) => {
@ -15376,10 +15451,24 @@ const DisplayPartnerSession = (props) => {
components={{ components={{
Toolbar: GridToolbar, Toolbar: GridToolbar,
}} }}
getRowClassName={(params) => {
if (String(params.row.eval_status) === "0") {
return 'line--eval_envoye';
}
if (String(params.row.eval_status) === "1") {
return 'line--eval_fait';
}
}}
/> />
</Box>
{selectionModel_evaluation && selectionModel_evaluation.length >= 1 && {selectionModel_evaluation && selectionModel_evaluation.length >= 1 &&
<div className="block_en_mass"> <div className="block_en_mass">
<br /> <br />

View File

@ -1908,7 +1908,8 @@ const DistplayPartnerTraningsPage = (props) => {
'& .line--statut--selected': { '& .line--statut--selected': {
backgroundColor: '#FBF2EF', backgroundColor: '#FBF2EF',
color: 'black', color: 'black',
}, [`& .${gridClasses.cell}`]: { },
[`& .${gridClasses.cell}`]: {
py: 1, py: 1,
}, },

View File

@ -5683,7 +5683,8 @@ const Employes = (props) => {
'& .line--statut--impair': { '& .line--statut--impair': {
backgroundColor: '#FFFFFF', backgroundColor: '#FFFFFF',
color: 'black', color: 'black',
}, [`& .${gridClasses.cell}`]: { },
[`& .${gridClasses.cell}`]: {
py: 1, py: 1,
}, },

View File

@ -481,7 +481,7 @@ const PartnerClientActivite = (props) => {
//console.log(" In recordPartnerClient_Activite_Data res.data.message = " + res.data.message); //console.log(" In recordPartnerClient_Activite_Data res.data.message = " + res.data.message);
setrecord_One_PartnerClient_Activite_Data_api("true"); setrecord_One_PartnerClient_Activite_Data_api("true");
setrecord_One_PartnerClient_Activite_Data_result(res.data.message); setrecord_One_PartnerClient_Activite_Data_result(res.data.message);
Clear_activite_P_fields();
setshowactivite_detail("0"); setshowactivite_detail("0");
Get_List_Activite_Of_client_Part(); Get_List_Activite_Of_client_Part();
alert(res.data.message); alert(res.data.message);
@ -714,6 +714,13 @@ const PartnerClientActivite = (props) => {
setp_activite_type(""); setp_activite_type("");
setp_activite_status(""); setp_activite_status("");
setp_activite_status_label(""); setp_activite_status_label("");
setp_activite_detail("");
setone_activite_description("");
setone_activite_type("");
setone_activite_status("call");
setone_activite_detail("");
} }
@ -750,14 +757,11 @@ const PartnerClientActivite = (props) => {
const [one_activite_detail, setone_activite_detail] = useState(); const [one_activite_detail, setone_activite_detail] = useState();
function Close_add_one_activite() { function Close_add_one_activite() {
setone_activite_description(); setone_activite_description("");
setone_activite_deadline(new Date().toLocaleDateString('fr-FR')); setone_activite_deadline(new Date().toLocaleDateString('fr-FR'));
setone_activite_type("call"); setone_activite_type("call");
setone_activite_status("0"); setone_activite_status("0");
setone_activite_detail(); setone_activite_detail("");
setshowactivite_detail(); setshowactivite_detail();

View File

@ -63,7 +63,8 @@ import { CiTrash } from "react-icons/ci";
import { MdAddCircleOutline, MdRemoveCircleOutline } from "react-icons/md"; import { MdAddCircleOutline, MdRemoveCircleOutline } from "react-icons/md";
import Popup from 'reactjs-popup'; import Popup from 'reactjs-popup';
import 'reactjs-popup/dist/index.css'; import 'reactjs-popup/dist/index.css';
import Link from '@mui/material/Link';
import { PiDotsThree } from "react-icons/pi";
const Partner_Client = (props) => { const Partner_Client = (props) => {
@ -74,22 +75,62 @@ const Partner_Client = (props) => {
const [selected_id, setselected_id] = useState(""); const [selected_id, setselected_id] = useState("");
function ExpandableCell_50({ value }) {
const [expanded, setExpanded] = React.useState(false);
return (
<nav>
{value && <div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
{expanded ? value : String(value).slice(0, 50)}&nbsp;
{value.length > 50 && (
// eslint-disable-next-line jsx-a11y/anchor-is-valid
<Link
type="button"
component="button"
sx={{ fontSize: 'inherit' }}
onClick={() => setExpanded(!expanded)}
>
{expanded ? <nav> <PiDotsThree />Réduire</nav> : <nav> <PiDotsThree />Voir</nav>}
</Link>
)}
</div>}
{!value && <div style={{ paddingLeft: "5px", paddingRight: "15px", "display": "block", wordBreak: "break-all" }}>
&nbsp;
</div>
}
</nav>
);
}
function Display_Colunm_text({ value }) {
return (
<div style={{ paddingLeft: "5px", paddingRight: "10px", "display": "block", wordBreak: "break-all" }}>
{value}&nbsp;
</div>
);
}
const columns_clients = [ const columns_clients = [
{ field: 'id', headerName: 'id', hide: true }, { field: 'id', headerName: 'id', hide: true },
{ field: '_id', headerName: '_id', hide: true }, { field: '_id', headerName: '_id', hide: true },
{ field: 'raison_sociale', headerName: 'Raison sociale', minWidth: 50, maxWidth: 100, flex: 1, hide: false, editable: false, }, { field: 'raison_sociale', headerName: 'Raison sociale', Width: 200, flex: 1, hide: false, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'nom', headerName: 'nom', width: 100, hide: false, editable: false, minWidth: 10, flex: 1 }, { field: 'nom', headerName: 'nom', width: 100, hide: false, editable: false, Width: 200, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'email', headerName: 'email', width: 100, hideable: false, minWidth: 100, flex: 1 }, { field: 'email', headerName: 'email', width: 100, hideable: false, width: 200, flex: 1, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'telephone', headerName: 'Téléphone', width: 100, hide: false, editable: false, minWidth: 100, maxWidth: 150, flex: 1 }, { field: 'telephone', headerName: 'Téléphone', width: 100, hide: false, editable: false, width: 100, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'adr_adresse', headerName: 'Adresse', width: 100, hide: true, editable: false, minWidth: 50, maxWidth: 70, flex: 1 }, { field: 'adr_adresse', headerName: 'Adresse', width: 100, hide: true, editable: false, width: 100, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'adr_code_postal', headerName: 'Code Postal', width: 100, hide: false, editable: false, minWidth: 50, maxWidth: 70, flex: 1 }, { field: 'adr_code_postal', headerName: 'Code Postal', width: 100, hide: false, editable: false, width: 100, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'adr_ville', headerName: 'Ville', width: 100, hide: false, editable: false, minWidth: 50, maxWidth: 70, flex: 1 }, { field: 'adr_ville', headerName: 'Ville', width: 100, hide: false, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'adr_pays', headerName: 'Pays', width: 100, hide: true, editable: false, minWidth: 50, maxWidth: 70, flex: 1 }, { field: 'adr_pays', headerName: 'Pays', width: 100, hide: true, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'siret', headerName: 'Siret', width: 100, hide: true, editable: false, minWidth: 50, maxWidth: 70, flex: 1 }, { field: 'siret', headerName: 'Siret', width: 100, hide: true, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
{ field: 'website', headerName: 'Siteweb', width: 100, hide: true, editable: false, minWidth: 50, maxWidth: 70, flex: 1 }, { field: 'website', headerName: 'Siteweb', width: 100, hide: true, editable: false, renderCell: (params) => <ExpandableCell_50 {...params} />, },
/*{ /*{
@ -819,6 +860,9 @@ const Partner_Client = (props) => {
backgroundColor: '#FFFFFF', backgroundColor: '#FFFFFF',
color: 'black', color: 'black',
}, },
[`& .${gridClasses.cell}`]: {
py: 1,
},
}} }}
> >
@ -889,6 +933,14 @@ const Partner_Client = (props) => {
} }
}} }}
sx={{
"& .MuiDataGrid-cellContent": {
minHeight: 100,
}
}}
/> />
</Box> </Box>
<br /> <br />

View File

@ -41,7 +41,7 @@ import DialogTitle from '@mui/material/DialogTitle';
import { TransitionProps } from '@mui/material/transitions'; import { TransitionProps } from '@mui/material/transitions';
import img_loading_spin from "./../mysy_img/mysy_spin_loading.gif"; import img_loading_spin from "./../mysy_img/mysy_spin_loading.gif";
import { Global } from "recharts"; import { Global } from "recharts";
import { FcAddDatabase } from "react-icons/fc";
const Partner_Commande = (props) => { const Partner_Commande = (props) => {
@ -5194,9 +5194,11 @@ const Partner_Commande = (props) => {
<div className="session_data" > <div className="session_data" >
<div style={{ "border": "None" }}> <div style={{ "border": "None" }}>
<nav onClick={Ajouter_une_ligne_article} style={{ "fontSize": "18px", "fontWeight": '600', "marginLeft": "10px", "marginTop": "10px", "cursor": "pointer" }}> <Button> Ajouter une ligne <nav onClick={Ajouter_une_ligne_article} style={{ "fontSize": "18px", "fontWeight": '600', "marginLeft": "10px", "marginTop": "10px", "cursor": "pointer" }}
&nbsp; className="bton_add_line"> <Button> Ajouter une ligne
</Button> <img src={add_plus} alt="ajout commande" className="icon_plus_line" /> </nav> &nbsp; <FcAddDatabase style={{"fontSize":"medium"}}/>
</Button>
</nav>
<div style={{ height: 550, width: '100%', paddingRight: '1px' }}> <div style={{ height: 550, width: '100%', paddingRight: '1px' }}>
&nbsp; &nbsp;
<Box <Box

View File

@ -88,12 +88,8 @@ const Test_Drag_Drop = (props) => {
if (String(e.type) === "mouseup") { if (String(e.type) === "mouseup") {
console.log('Event Type', e.type); console.log('Event Type', e.type);
var al = data.lastX; var al = data.lastX;
console.log('data lastX', al); console.log('data lastX', al);
@ -132,6 +128,9 @@ const Test_Drag_Drop = (props) => {
const [table_step, settable_step] = useState(); const [table_step, settable_step] = useState();
const New_step_x = [{"step":"nouveau"}, {"step":"qualifie"}, {"step":"proposition"}, {"step":"gagne"}, {"step":"perdu"}]
const [New_Getall_Partner_CRM_Opport_Step_result, setNew_Getall_Partner_CRM_Opport_Step_result] = useState([]); const [New_Getall_Partner_CRM_Opport_Step_result, setNew_Getall_Partner_CRM_Opport_Step_result] = useState([]);
const [Getall_Partner_CRM_Opport_Step_api, setGetall_Partner_CRM_Opport_Step_api] = useState(); const [Getall_Partner_CRM_Opport_Step_api, setGetall_Partner_CRM_Opport_Step_api] = useState();
@ -155,7 +154,7 @@ const Test_Drag_Drop = (props) => {
setGetall_Partner_CRM_Opport_Step_api("true"); setGetall_Partner_CRM_Opport_Step_api("true");
setGetall_Partner_CRM_Opport_Step_result(res.data.message); setGetall_Partner_CRM_Opport_Step_result(res.data.message);
let table = "<table style='width:100%' class='step_td'><thead><tr>"; let table = "<table style='width:100%; position:absolute; top:6rem; zIndex:2' class='step_td'><thead><tr>";
var new_data2 = []; var new_data2 = [];
const new_data = res.data.message.map((x) => { const new_data = res.data.message.map((x) => {
@ -199,7 +198,7 @@ const Test_Drag_Drop = (props) => {
if (new_data2.length > 0) { if (new_data2.length > 0) {
setNew_Getall_Partner_CRM_Opport_Step_result(new_data2); setNew_Getall_Partner_CRM_Opport_Step_result(new_data2);
table += "<tbody style='height:10rem;' class='step_td' ><tr>"; table += "<tbody style='height:50rem;zIndex:2' class='step_td' ><tr>";
var tmp = 0; var tmp = 0;
const new_data = res.data.message.map((x) => { const new_data = res.data.message.map((x) => {
@ -209,7 +208,7 @@ const Test_Drag_Drop = (props) => {
}); });
table += "</tr></tbody>"; table += "</tr></tbody> </table>";
console.log(" ### table = ", table); console.log(" ### table = ", table);
@ -235,8 +234,80 @@ const Test_Drag_Drop = (props) => {
}) })
} }
const [New_Get_List_Oppurtunite_With_Filter_result, setNew_Get_List_Oppurtunite_With_Filter_result] = useState([]);
const [Get_List_Oppurtunite_With_Filter_api, setGet_List_Oppurtunite_With_Filter_api] = useState();
const [Get_List_Oppurtunite_With_Filter_message, setGet_List_Oppurtunite_With_Filter_message] = useState();
const [Get_List_Oppurtunite_With_Filter_result, setGet_List_Oppurtunite_With_Filter_result] = useState();
function Get_List_Oppurtunite_With_Filter(event) {
var form = new FormData();
const stored_cookie = getCookie('tokenmysypart');
form.append("token", stored_cookie);
var myurl = process.env.REACT_APP_API_URL + "myclass/api/Get_List_CRM_Opportunite_with_filter/";
axios.post(myurl, form).then(res => {
if (String(res.data.status) === String("true")) {
//console.log(" In Get_List_Oppurtunite_With_Filter res.data.status = " + res.data.status);
console.log(" In Get_List_Oppurtunite_With_Filter res.data.message r_class = " + res.data.message);
setGet_List_Oppurtunite_With_Filter_api("true");
setGet_List_Oppurtunite_With_Filter_result(res.data.message);
var new_data2 = [];
const new_data = res.data.message.map((x) => {
//---
var localid = JSON.parse(x).id;
var local_id = JSON.parse(x)._id;
var local_statut = JSON.parse(x).statut;
var local_contact_nom = JSON.parse(x).contact_nom;
var local_contact_email = JSON.parse(x).contact_email;
//---
var node = {
"_id": local_id,
"id": localid,
"label": local_statut,
"statut": local_statut,
"contact_nom": local_contact_nom,
"contact_email": local_contact_email,
};
new_data2.push(node);
});
if (new_data2.length > 0)
setNew_Get_List_Oppurtunite_With_Filter_result(new_data2);
}
else {
setGet_List_Oppurtunite_With_Filter_api("false");
setGet_List_Oppurtunite_With_Filter_message(res.data.message);
alert(res.data.message);
}
}).catch((error) => {
console.warn('Not good man :( Get_List_Oppurtunite_With_Filter = ', error);
setGet_List_Oppurtunite_With_Filter_api("false");
alert(" Impossible de recuperer la liste des opportunités ");
//setmyApimyApiMessage("")
})
}
function test_td_element() {
let element = document.getElementById('cherif');
element.innerHTML = table_step;
}
return ( return (
@ -246,11 +317,32 @@ const Test_Drag_Drop = (props) => {
</div>} </div>}
<h3> Test Page Drag & Drop</h3> <h3> Test Page Drag & Drop</h3>
<Button variant="contained"
color="success"
className="btn_abonnement"
onClick={(e) => {
Get_List_Oppurtunite_With_Filter();
}}
> Get All opportunités
</Button>
---
<Button variant="contained"
color="success"
className="btn_abonnement"
onClick={(e) => {
test_td_element();
}}
> Test TD element
</Button>
<div className="div_row">
&nbsp;
</div>
<Draggable <Draggable
// grid={[10, 5]} // grid={[10, 5]}
scale={1} scale={1}
defaultPosition={{ x: 10, y: 20 }} defaultPosition={{ x: 10, y: 20 }}
onMouseDown={eventHandler} onMouseDown={eventHandler}
@ -258,12 +350,35 @@ const Test_Drag_Drop = (props) => {
onDrag={eventHandler} onDrag={eventHandler}
onStop={eventHandler} onStop={eventHandler}
> >
<div style={{ border: "2px solid red", padding: "1rem", width: "10%" }}> <div style={{ border: "2px solid red", padding: "1rem", width: "10%" , "zIndex":"97", "position":"relative"}}>
<div className="handle">Drag from here</div> <div className="handle">Drag from here</div>
<div> Step = {task_column}</div> <div> Step = {task_column}</div>
</div> </div>
</Draggable> </Draggable>
{New_Get_List_Oppurtunite_With_Filter_result && New_Get_List_Oppurtunite_With_Filter_result.length > 0 &&
New_Get_List_Oppurtunite_With_Filter_result.map((data) => (
<Draggable
// grid={[10, 5]}
scale={1}
defaultPosition={{ x: parseFloat(document.getElementById(data.statut).getBoundingClientRect().left)+10, y: data.id*2 }}
onMouseDown={eventHandler}
onStart={eventHandler}
onDrag={eventHandler}
onStop={eventHandler}
>
<div style={{ border: "2px solid red", padding: "1rem", width: "10%", "zIndex":"99", "position":"relative"}}>
<div className="handle">Drag from here</div>
<div> Step = {data.contact_email}</div>
</div>
</Draggable>
))}
<div style={{ "width": "90%", "marginLeft": "auto", "marginRight": "auto" }}> <div style={{ "width": "90%", "marginLeft": "auto", "marginRight": "auto" }}>
<div className="div_row" id="cherif" style={{ "width": "90%", "marginLeft": "auto", "marginRight": "auto" }}> <div className="div_row" id="cherif" style={{ "width": "90%", "marginLeft": "auto", "marginRight": "auto" }}>

View File

@ -3,8 +3,8 @@
.tooltip_css { .tooltip_css {
background: #81BC3A; background: #81BC3A;
z-index: 9999; z-index: 9999;
} }
.Mui-disabled { .Mui-disabled {
font-size: small !important; font-size: small !important;
padding: 0px !important; padding: 0px !important;
@ -249,7 +249,7 @@
width: 6%; width: 6%;
} }
.icon_plus_line { .icon_plus_line {
width: 3%; width: 3%;
} }
@ -828,7 +828,7 @@
width: 6%; width: 6%;
} }
.icon_plus_line { .icon_plus_line {
width: 4%; width: 4%;
} }
@ -1347,7 +1347,7 @@
} }
.css-11u53oe-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input { .css-11u53oe-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input {
padding: 1px !important; padding: 1px !important;
@ -1435,7 +1435,7 @@
width: 8%; width: 8%;
} }
.icon_plus_line { .icon_plus_line {
width: 3%; width: 3%;
} }
@ -2265,7 +2265,7 @@
text-align: center; text-align: center;
} }
.css-l4u8b9-MuiInputBase-root-MuiInput-root{ .css-l4u8b9-MuiInputBase-root-MuiInput-root {
text-align: left !important; text-align: left !important;
} }
@ -2293,18 +2293,42 @@
margin-left: 10px; margin-left: 10px;
margin-right: 10px; margin-right: 10px;
} }
} }
.bton_add_line {
box-shadow: 0 0 5px -1px rgba(0, 0, 0, 0.2);
display: inline-block;
text-align: center;
cursor: pointer;
background: #d8edfc;
border-radius: 15px;
margin-right: 1rem;
text-align: left;
border: 1px solid #9cf;
color: #3b3e40;
font-family: "verdana", "Quicksand", "Signika", sans-serif;
font-size: small;
letter-spacing: 0.1rem;
font-weight: normal;
padding-left: 10px;
padding-left: 30px;
padding-right: 30px;
}
// end media // end media
.css-md26zr-MuiInputBase-root-MuiOutlinedInput-root{ .css-md26zr-MuiInputBase-root-MuiOutlinedInput-root {
height: 3.5rem !important; height: 3.5rem !important;
} }
.css-1bp1ao6{ .css-1bp1ao6 {
height: 3.5rem !important; height: 3.5rem !important;
} }
@ -2367,27 +2391,27 @@
align-items: center; align-items: center;
text-align: center; text-align: center;
margin-bottom: 0.5rem !important; margin-bottom: 0.5rem !important;
} }
.separator::before, .separator::before,
.separator::after { .separator::after {
content: ''; content: '';
flex: 1; flex: 1;
border-bottom: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;
} }
.separator:not(:empty)::before {
margin-right: .35em;
}
.separator:not(:empty)::after {
margin-left: .35em;
}
.MuiSelect-select{ .separator:not(:empty)::before {
margin-right: .35em;
}
.separator:not(:empty)::after {
margin-left: .35em;
}
.MuiSelect-select {
//height: 3rem !important; //height: 3rem !important;
} }
} }