maxence.lanone
/
JTT_CrM_test_ci
forked from CRM_Production/JTT_CrM
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Ajout d'un système de chargement

Browse Source
master
Théo DUPIN 3 years ago
parent 8c29a1ecee
commit 3db1522c5a
7 changed files with 67 additions and 19 deletions
Show Stats Download Patch File Download Diff File

16
package-lock.json generated
Unescape View File

@ -32,6 +32,7 @@
"react-big-calendar": "^1.5.0", "react-big-calendar": "^1.5.0",
"react-datepicker": "^4.8.0", "react-datepicker": "^4.8.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-loading": "^2.0.3",
"react-router-dom": "^6.4.2", "react-router-dom": "^6.4.2",
"react-scripts": "^5.0.1", "react-scripts": "^5.0.1",
"sass": "^1.55.0", "sass": "^1.55.0",
@ -14941,6 +14942,15 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
}, },
"node_modules/react-loading": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/react-loading/-/react-loading-2.0.3.tgz",
"integrity": "sha512-Vdqy79zq+bpeWJqC+xjltUjuGApyoItPgL0vgVfcJHhqwU7bAMKzysfGW/ADu6i0z0JiOCRJjo+IkFNkRNbA3A==",
"peerDependencies": {
"prop-types": "^15.6.0",
"react": ">=0.14.0"
}
},
"node_modules/react-onclickoutside": { "node_modules/react-onclickoutside": {
"version": "6.12.2", "version": "6.12.2",
"resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.12.2.tgz", "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.12.2.tgz",
@ -28394,6 +28404,12 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
}, },
"react-loading": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/react-loading/-/react-loading-2.0.3.tgz",
"integrity": "sha512-Vdqy79zq+bpeWJqC+xjltUjuGApyoItPgL0vgVfcJHhqwU7bAMKzysfGW/ADu6i0z0JiOCRJjo+IkFNkRNbA3A==",
"requires": {}
},
"react-onclickoutside": { "react-onclickoutside": {
"version": "6.12.2", "version": "6.12.2",
"resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.12.2.tgz", "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.12.2.tgz",

1
package.json
Unescape View File

@ -27,6 +27,7 @@
"react-big-calendar": "^1.5.0", "react-big-calendar": "^1.5.0",
"react-datepicker": "^4.8.0", "react-datepicker": "^4.8.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-loading": "^2.0.3",
"react-router-dom": "^6.4.2", "react-router-dom": "^6.4.2",
"react-scripts": "^5.0.1", "react-scripts": "^5.0.1",
"sass": "^1.55.0", "sass": "^1.55.0",

3
src/App.js
Unescape View File

@ -11,6 +11,8 @@ import Admin_create from './pages/Admin_create';
import Calendrier from './pages/Calendrier'; import Calendrier from './pages/Calendrier';
import Repertoire from './pages/Repertoire'; import Repertoire from './pages/Repertoire';
import Parametres from './pages/Parametres'; import Parametres from './pages/Parametres';
import Chargement from './pages/Chargement';
import { Component } from 'fullcalendar';
@ -30,6 +32,7 @@ const App = () => {
<Route path="/Calendrier" element={<Calendrier />} /> <Route path="/Calendrier" element={<Calendrier />} />
<Route path="/Repertoire" element={<Repertoire />} /> <Route path="/Repertoire" element={<Repertoire />} />
<Route path="/Parametres" element={<Parametres />} /> <Route path="/Parametres" element={<Parametres />} />
<Route path="/Chargement" element={<Chargement />} />
</Routes> </Routes>
</BrowserRouter> </BrowserRouter>
); );

13
src/pages/Chargement.js
Unescape View File

@ -0,0 +1,13 @@
import React, {Component} from 'react';
import ReactLoading from 'react-loading';
const Chargement = () => {
return (
<div className="chargement">
<ReactLoading type="bars" color="#a9a9a9"/>
</div>
);
}
export default Chargement;

10
src/pages/Compte.js
Unescape View File

@ -18,6 +18,14 @@ function Compte() {
setFile(URL.createObjectURL(e.target.files[0])); setFile(URL.createObjectURL(e.target.files[0]));
} }
const [modification, setModification] = useState(false);
const modificationHandler = () => {
setModification((modification) => !modification)
console.log("modificationHandler")
console.log(modification)
}
return ( return (
<body className={theme}> <body className={theme}>
@ -61,7 +69,7 @@ function Compte() {
<p id="texte" className="nom">Mateo Centeno</p> <p id="texte" className="nom">Mateo Centeno</p>
</div> </div>
<div className='bouton_submit'> <div className='bouton_submit'>
<button id="bouton" className="bouton_modifierNom" type="submit">Modifier</button> <button id="bouton" className="bouton_modifierNom" type="submit" onClick={modificationHandler}>{!modification ? "Modifier" : "Envoyer"}</button>
</div> </div>
</div> </div>
</div> </div>

6
src/styles/components/_chargement.scss
Unescape View File

@ -0,0 +1,6 @@
.chargement {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}

3
src/styles/index.scss
Unescape View File

@ -6,4 +6,5 @@
@import "./components/analyse"; @import "./components/analyse";
@import "./components/calendrier"; @import "./components/calendrier";
@import "./components/parametre"; @import "./components/parametre";
@import "./components/repertoire" @import "./components/repertoire";
@import "./components/chargement"
Write Preview
Loading…
Cancel
Save