pb parametrage livraison

Bug244, 245, 247, 249
ancres
2021-05-12 17:20:11 +02:00 · 2021-05-10 10:04:08 +02:00 · 2021-05-03 23:03:49 +02:00 · 2021-05-03 22:06:08 +02:00 · 2021-05-03 16:45:07 +02:00 · 2021-05-03 13:25:59 +02:00
14 changed files with 1132 additions and 747 deletions
@@ -11,6 +11,7 @@ import Typography from '@material-ui/core/Typography';
 import WatchLater from '@material-ui/icons/WatchLater';
 import Home from '@material-ui/icons/Home';
 import People from '@material-ui/icons/People';
+import Place from '@material-ui/icons/Place';

 const variantIcon = {
  assignment: AssignmentIcon,
@@ -21,6 +22,7 @@ const variantIcon = {
  watch_later: WatchLater,
  home: Home,
  people: People,
+  place: Place,
 };

 const styles = theme => ({
@@ -10,6 +10,7 @@ import BusinessCenterIcon from '@material-ui/icons/BusinessCenter';
 import People from '@material-ui/icons/People';
 import Typography from '@material-ui/core/Typography';
 import Business from '@material-ui/icons/Business';
+import Place from '@material-ui/icons/Place';

 const variantIcon = {
  assignment: AssignmentIcon,
@@ -20,6 +21,7 @@ const variantIcon = {
  business_center: BusinessCenterIcon,
  business: Business,
  people: People,
+  place: Place,
 };

 const styles = theme => ({
@@ -29,9 +29,9 @@ const OgHead = props => {
            <meta name="twitter:description" content={props.seo_description}/>
            <meta name="twitter:image" content={props.image}/>
            
-            if (urlEnv=="development") {
-                // <meta name="robots" content="noindex, nofollow"></meta>
-            }
+            {/* A ENLEVER EN PROD */}
+            <meta name="robots" content="noindex, nofollow"></meta>
+            
            
            {/* <meta httpEquiv='cache-control' content='no-store,no-cache'></meta>
            <meta httpEquiv='expires' content='0'></meta>
@@ -2,12 +2,17 @@ import React, { useState, Component, Fragment } from 'react'
 import { withStyles } from '@material-ui/core/styles';
 import TextField from '@material-ui/core/TextField';
 import { Alert, AlertTitle } from '@material-ui/lab';
+
+import {
+    Grid
+} from '@material-ui/core';
 import Snackbar from '@material-ui/core/Snackbar';
 import { connect } from 'react-redux'
 import { updateUserRequest } from '../../actions/user'
 import getConfig from 'next/config'
 import Validator from "validator";
-import AccountProfile from '../organisms/AccountProfile';
+
+import { Typography, Hidden } from '@material-ui/core';
 import ReactHtmlParser, { processNodes, convertNodeToElement, htmlparser2 } from 'react-html-parser';
 import {
    Button,
@@ -19,6 +24,13 @@ import { geocodeByAddress } from 'react-places-autocomplete'
 //US487
 import Autosuggest from 'react-autosuggest';

+import VideoCam from '@material-ui/icons/Videocam';
+
+import Send from '@material-ui/icons/Send';
+
+import AccountCircleIcon from '@material-ui/icons/AccountCircle';
+
+

 const styles = theme => ({
    container: {
@@ -30,8 +42,8 @@ const styles = theme => ({
        alignItems: 'center',
        justifyContent: 'center',
        padding: '24px',
-        paddingBottom: theme.spacing(8),
-        marginBottom: theme.spacing(8),
+        paddingBottom: theme.spacing(3),
+        marginBottom: theme.spacing(3),
        '&>div': {
            marginTop: theme.spacing(1.5),
            marginBottom: theme.spacing(1.5),
@@ -65,6 +77,7 @@ const styles = theme => ({
    },
    labelGeoloc:{
        paddingLeft:"14px",
+        textAlign :"left !important",
        fontSize: "0.8rem",
        color:"#1E2327",
        fontFamily: '"Roboto", "Helvetica", "Arial", sans-serif',
@@ -80,7 +93,73 @@ const styles = theme => ({
    },
    conteneurGoogleComposant:{
        paddingLeft:"14px"
+    },
+    profil:{
+        padding: "0px 64px",
+        fontSize: "1.5em",
+        marginTop: "32px",
+        textAlign: "center",
+        fontFamily: "Roboto",
+        fontWeight: "600",
+        marginBottom: "24px",
+    },
+
+    menuIcon:{
+        color: theme.palette.primary.dark,
+    },
+    menu:{
+        color: theme.palette.primary.main,
+        fontSize:"1em",
+        textTransform:"uppercase",
+        fontFamily: '"Roboto", "Helvetica", "Arial", sans-serif',
+    },
+    information:{
+        padding: "1em",
+        width: "100%",
+        backgroundColor: theme.palette.secondary.main,
+        borderRadius: "5px",
+        marginBottom:"30px",
+        borderColor: "1px solid #E5E5E6"
+
+    },
+    grille :{
+        paddingTop:theme.spacing(4),
+        paddingBottom:theme.spacing(4),
+        width: "100%",
+        marginBottom:"30px",
+        
+        borderRadius: "5px",
+        border: "1px solid #1E2327",
+        color:theme.palette.primary.dark
+    },
+    menuLien:{
+        fontSize:"1em",
+        textTransform:"uppercase",
+        fontFamily: '"Roboto", "Helvetica", "Arial", sans-serif',
+        color: theme.palette.primary.dark,
+        textDecoration :"none",
+        '&:hover': {
+            color: theme.palette.primary.dark,
+          },
+        '&:active': {
+            color: theme.palette.primary.dark,
+          },
+        '&:visited': {
+            color: theme.palette.primary.dark,
+          },
+    },
+    grilleGauche :{
+        textAlign :"center"
+    },
+    grilleDroite :{
+        textAlign :"center"
+    },
+    grilleBas :{
+        backgroundColor: theme.palette.secondary.dark,
    }
+    
+
+    
 });

 const { publicRuntimeConfig } = getConfig();
@@ -162,6 +241,7 @@ class AccountEtape1 extends Component {
        this.setState({
            firstname: nextProps.user.firstname,
            lastname: nextProps.user.lastname,
+            alias: nextProps.user.alias,
            phone: nextProps.user.phone,
            email: nextProps.user.email,
            linkedin: nextProps.user.linkedin,
@@ -183,6 +263,7 @@ class AccountEtape1 extends Component {
        this.setState({
            firstname: this.props.user.firstname,
            lastname: this.props.user.lastname,
+            alias: this.props.user.alias,
            phone: this.props.user.phone,
            email: this.props.user.email,
            address1: this.props.user.address1,
@@ -286,6 +367,7 @@ class AccountEtape1 extends Component {
                    this.setState({ lat: obj.lat.toString()})     
                    this.setState({ lng: obj.lng.toString()})     
                }
+                this.soumettre("geoloc", "unitaire");
                
                
                // console.log("GEOLOC ON geocodeByAddress")
@@ -366,9 +448,13 @@ class AccountEtape1 extends Component {
    soumettre(champ, type){
        console.log("soumettre");
        console.log(champ);
-        const errors = this.validate(this.state, champ, type);
+        let errors = false;
        const success = {};
-        this.setState({ errors });
+        if(champ!="geoloc"){
+            errors = this.validate(this.state, champ, type);
+            this.setState({ errors });
+        }
+        
        if (!this.state.errors || !this.state.errors.message){
            
            success.message ="Profil mis à jour";
@@ -388,19 +474,31 @@ class AccountEtape1 extends Component {
            data.append('twitter', this.state.twitter)
            data.append('website', this.state.website)
            console.log("GEOLOC ON SUBMIT")
-            console.log(this.state)
-            data.append('geoloc', this.state.geoloc)
+            console.log(this.state.geoloc)
+            if(this.state.geoloc){
+                data.append('geoloc', this.state.geoloc)
+                console.log(this.state.street_number)
+                console.log(this.state.route)
+                console.log(this.state.locality)
+                console.log(this.state.administrative_area_level_2)
+                console.log(this.state.administrative_area_level_1)
+                console.log(this.state.country)
+                console.log(this.state.postal_code)
+                console.log(this.state.formatted_address)
+                console.log(this.state.lat)
+                console.log(this.state.lat)
+                data.append('street_number', this.state.street_number.replace('"', ''))
+                data.append('route', this.state.route.replace('"', ''))
+                data.append('locality', this.state.locality.replace('"', ''))
+                data.append('administrative_area_level_2', this.state.administrative_area_level_2.replace('"', ''))
+                data.append('administrative_area_level_1', this.state.administrative_area_level_1.replace('"', ''))
+                data.append('country', this.state.country.replace('"', ''))
+                data.append('postal_code', this.state.postal_code.replace('"', ''))
+                data.append('formatted_address', this.state.formatted_address.replace('"', ''))
+                data.append('lat', this.state.lat)
+                data.append('lng', this.state.lng)
+            }
            
-            data.append('street_number', this.state.street_number.replace('"', ''))
-            data.append('route', this.state.route.replace('"', ''))
-            data.append('locality', this.state.locality.replace('"', ''))
-            data.append('administrative_area_level_2', this.state.administrative_area_level_2.replace('"', ''))
-            data.append('administrative_area_level_1', this.state.administrative_area_level_1.replace('"', ''))
-            data.append('country', this.state.country.replace('"', ''))
-            data.append('postal_code', this.state.postal_code.replace('"', ''))
-            data.append('formatted_address', this.state.formatted_address.replace('"', ''))
-            data.append('lat', this.state.lat)
-            data.append('lng', this.state.lng)
            //Compétences
            data.append('appellationId', this.state.appellationId)
            data.append('appellationLibelle', this.state.appellationLibelle)
@@ -462,16 +560,16 @@ class AccountEtape1 extends Component {

    

-    inputFilesystemChange = (e) => {
+    // inputFilesystemChange = (e) => {

-        console.log("inputFilesystemChange");
-        var file = e.target.files[0]
-        this.setState({ picture: file })
+    //     console.log("inputFilesystemChange");
+    //     var file = e.target.files[0]
+    //     this.setState({ picture: file })

-        const data = new FormData()
-        data.append('file', file)
-        this.props.updateUserPictureRequest(data)
-    }
+    //     const data = new FormData()
+    //     data.append('file', file)
+    //     this.props.updateUserPictureRequest(data)
+    // }

    // METIER
    // Filter logic
@@ -519,7 +617,7 @@ class AccountEtape1 extends Component {
        </span>
    );
    refreshPage() {
-        window.location.replace("/profileStep");
+        window.location.replace("/");
    }

    choisirMetier = (code) =>{
@@ -597,277 +695,340 @@ class AccountEtape1 extends Component {
        const searchOptions = {
        componentRestrictions: { country: ['fr'] },
        }
+        

        return (
-          <section className={classes.container}>
-            <form className={classes.form}
-                    autoComplete="off" focused="true" name="monForm" ref="formToSubmit">
-                    {/* {!!logoUrl && <Avatar className={classes.logo}
-                        classes={{ img: classes.MuiAvatarImg }}
-                        src={publicRuntimeConfig.symphonyUrl + publicRuntimeConfig.postedContentUrl + logoUrl} alt="candidatLogo" />} */}
+          <section >
+            <Typography align="center" className={classes.profil}>
+                Mon profil
+            </Typography>
+            <Grid
+            container
+            direction="row"
+            justify="space-between"
+            alignItems="flex-start"
+            className={classes.grille}
+            justify="center"
+            alignItems="center">
+                <Grid item lg={6} md={6} xl={6} xs={12} className={classes.grilleGauche}>
+                        <a className={classes.menuLien}
+                        href={publicRuntimeConfig.cvThequeUrl+"/talent/"+this.state.alias} 
+                        target="_blank">
+                            <div><VideoCam className={classes.menuIcon}></VideoCam></div>
+                            <span className={classes.menuLien} >Voir mon profil Talents Tube</span>
+                        </a>
+                </Grid>
+                <Grid item lg={6} md={6} xl={6} xs={12} className={classes.grilleDroite}>
+                    <a className={classes.menuLien}
+                    target="_blank"
+                    href={"https://www.facebook.com/sharer/sharer.php?u=" + publicRuntimeConfig.cvThequeUrl + "/talent/" + user.alias + "%2F&amp;src=sdkpreparse"}
+                    >                
+                        <div><Send className={classes.menuIcon}></Send></div>
+                        <span  className={classes.menuLien}>Partager mon profil</span>
+                    </a>
+                </Grid>
+            </Grid>
+            <Hidden>&nbsp;</Hidden>
+            <Hidden>&nbsp;</Hidden>
+            <Grid
+            container

-                    {/* {!!user.pictureLoading && <Loader />}    
-                    {!!!user.pictureLoading && !!!logoUrl &&
-                        (<Fragment><input
-                            type="file" accept="image/*" capture="filesystem"
-                            className={classes.input}
-                            style={{ display: 'none' }}
-                            id="raised-button-file"
-                            multiple
-                            type="file"
-                            onChange={this.inputFilesystemChange}
-                        />
-                            <label htmlFor="raised-button-file">
-                                <Button component="span" className={classes.importButton} classes={{ root: classes.rootButton }}>
-                                    <img alt="talents-tube" src='/static/images/default/account-avatar-default.svg'
-                                        className={classes.iconButton} />
-                                    <Typography align="left" className={classes.textButton}>
-                                        J'<span className={classes.underlined}>importe</span> ma photo de profil
-                                    </Typography>
-                                    <KeyboardArrowRightIcon className={classes.InputKeyboardArrowRightIcon} />
-                                </Button>
-                            </label></Fragment>)
-                    } */}
-                    {this.AfficherErreurs()}
-                    {this.AfficherSuccess()}
+            direction="row"
+            justify="space-between"
+            alignItems="flex-start"
+            className={classes.grille}
+            justify="center"
+            alignItems="center">
+                
+                <Grid item lg={12} md={12} xl={12} xs={12} >
+
+                    <div>
                    
+                    <Typography 
+                    align="center"
+                    gutterBottom
+                    variant="headline"
+                    variant="h6"
+                    component="h2" 
+                    className={classes.h6}>
+                    <AccountCircleIcon className={classes.menuIcon}></AccountCircleIcon> <div id="information"></div>Mes informations
+                    </Typography>
+                    <Typography 
+                    align="center">Renseignez vos coordonnées pour permettre aux recruteurs de vous contacter plus facilement.</Typography>

-                    <TextField
-                        name="firstname"
-                        required
-                        id="outlined-required"
-                        label="Prénom"
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        value={this.state.firstname}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    />
-
-                    <TextField
-                        name="lastname"
-                        required
-                        id="outlined-required"
-                        label="Nom"
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        value={this.state.lastname}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    />
-
-                    <TextField
-                        disabled
-                        name="email"
-                        id="outlined"
-                        label="E-mail"
-                        required
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        value={this.state.email}
-                        onChange={this.handleChange}
-                        type="mail"
-                        onBlur={this.onBlur} 
-                    />
-
-                    <TextField
-                        name="phone"
-                        id="outlined"
-                        label="Téléphone"
-                        required
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        value={this.state.phone ? this.state.phone: ''}
-                        onChange={this.handleChange}
-                        type="tel"
-                        onBlur={this.onBlur} 
-                    />
-
-                    <Autosuggest
-                    suggestions={suggestionsMetier}
-                    onSuggestionsFetchRequested={this.onSuggestionsMetierFetchRequested}
-                    onSuggestionsClearRequested={this.onSuggestionsMetierClearRequested}
-                    getSuggestionValue={this.getSuggestionMetierValue}
-                    renderSuggestion={this.renderSuggestionMetier}
-                    inputProps={inputPropsMetier}
-                    />
-                    <input type="hidden" id="appellation_id" value={this.state.appellationId =='null' || this.state.appellationId ==''  ? '' :this.state.appellationId}></input>
-                    <input type="hidden" id="appellation_libelle" value={this.state.appellationLibelle =='null' || this.state.appellationLibelle ==''  ? '' :this.state.appellationLibelle}></input>
-
-                    {/* <TextField
-                        name="currentJob"
-                        id="outlined"
-                        label="Poste actuel"
-                        required
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        value={this.state.currentJob =='null' || this.state.currentJob ==''  ? '' :this.state.currentJob}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    /> */}
-                    <div className={classes.container}>
-                        <div 
-                        className={classes.conteneurGoogle}
-                        classes={{ root: classes.rootTextfield }} 
-                        style={{ position: 'relative', zIndex:2, width: '100%' }}>
-                            <label htmlFor="outlined-required"
-                            className={classes.labelGeoloc}>
-                                Adresse
-                            </label>
-                            <div className={classes.conteneurGoogleComposant}>
-                                <GooglePlaceAutocomplete
-                                    style={{ paddingLeft:'14px !important', left: 0, right: 0, zIndex: '2 !important', width: '100%' }}
-                                    name="location"
-                                    label="Location"
-                                    id="outlined-required"
-                                    variant="outlined"
-                                    textFieldProps={{ id: "outlined-required" }}
-                                    className={classes.textField}
-                                    value="test"
-                                    classes={{ root: classes.rootTextfield }} 
-                                    options={this.searchOptions}
-                                    onSuggestionSelected={this.onSuggestionSelected}
-                                    textFieldProps={{ onChange: (e) => this.onChange(e), value: this.state.value, placeholder: 'Ex : Rue de Rivoli, Paris, France', fullWidth: true, size:"small"}}
-                                    types={['(regions)']}
-                                    componentRestrictions={{country: 'fr'}}
-                                    renderTarget={() => (
-                                        <div   
-                                        style={{
-                                            
-                                            width: '100%',
-                                            zIndex:9
-                                        }}
-                                        >
-                                        </div>
-                                    )}
-                                />
-                            </div>
-                        </div>
-                        {/* <Input 
-                        name="geoloc" 
-                        id="geoloc" 
-                        label="geoloc" 
-                        ref="geoloc" 
-                        onChange={this.handleChange}
-                        value={this.state.geoloc =='null' || this.state.geoloc ==''  ? '' :this.state.geoloc}
-                        /> */}
                    </div>
+                    <form className={classes.form}
+                        autoComplete="off" focused="true" name="monForm" ref="formToSubmit">
+                        {/* {!!logoUrl && <Avatar className={classes.logo}
+                            classes={{ img: classes.MuiAvatarImg }}
+                            src={publicRuntimeConfig.symphonyUrl + publicRuntimeConfig.postedContentUrl + logoUrl} alt="candidatLogo" />} */}

-                    {/* <TextField
-                        name="address1"
-                        id="outlined"
-                        label="Adresse"
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        value={this.state.address1 ? this.state.address1 : ''}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    /> */}
-
-                    {/* <TextField
-                        name="address2"
-                        id="outlined"
-                        label="Adresse complémentaire"
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        value={this.state.address2 ? this.state.address2  : ''}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    />     */}
-                    {/* <div className={classes.container}> */}
-                    {/* <TextField
-                        name="zipCode"
-                        id="outlined"
-                        label="Code postal"
-                        className={classes.textField}
-                        classes={{ root: classes.textFieldSmall }}
-                        variant="outlined"
-                        value={this.state.zipCode ? this.state.zipCode : ''}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    />  */}
-
-                    {/* <TextField
-                        name="city"
-                        id="outlined"
-                        label="Ville"
-                        className={classes.textField}
-                        classes={{ root: classes.textFieldSmall }}
-                        variant="outlined"
-                        value={this.state.city ? this.state.city : ''}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    />       */}
-
-                    {/* <TextField
-                        name="country"
-                        id="outlined"
-                        label="Pays"
-                        className={classes.textField}
-                        classes={{ root: classes.textFieldSmall }}
-                        variant="outlined"
-                        value={this.state.country ? this.state.country : ''}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    /> */}
-                    {/* </div>            */}
-
-                    <TextField
-                        name="linkedin"
-                        id="outlined"
-                        label="Linkedin"
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        placeholder="http://www.linkedin.com/in/"
-                        value={this.state.linkedin =='null' || this.state.linkedin ==''  ? '' :this.state.linkedin}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-
-                    />
-
-                    <TextField
-                        name="twitter"
-                        id="outlined"
-                        label="Twitter"
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        placeholder="http://twitter.com/.."
-                        value={this.state.twitter =='null' || this.state.twitter ==''  ? '' :this.state.twitter}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    />
-
-                    <TextField
-                        name="website"
-                        id="outlined"
-                        label="Site internet"
-                        className={classes.textField}
-                        classes={{ root: classes.rootTextfield }}
-                        variant="outlined"
-                        placeholder="http://monsite.fr"
-                        value={this.state.website =='null' || this.state.website ==''  ? '' :this.state.website}
-                        onChange={this.handleChange}
-                        onBlur={this.onBlur} 
-                    />
-                    <Button
-                            onClick={this.refreshPage}
-                            variant="contained"
-                            color="primary"
-                            
-                            className={classes.button}>
-                            Enregistrer
-                        </Button>
+                        {/* {!!user.pictureLoading && <Loader />}    
+                        {!!!user.pictureLoading && !!!logoUrl &&
+                            (<Fragment><input
+                                type="file" accept="image/*" capture="filesystem"
+                                className={classes.input}
+                                style={{ display: 'none' }}
+                                id="raised-button-file"
+                                multiple
+                                type="file"
+                                onChange={this.inputFilesystemChange}
+                            />
+                                <label htmlFor="raised-button-file">
+                                    <Button component="span" className={classes.importButton} classes={{ root: classes.rootButton }}>
+                                        <img alt="talents-tube" src='/static/images/default/account-avatar-default.svg'
+                                            className={classes.iconButton} />
+                                        <Typography align="left" className={classes.textButton}>
+                                            J'<span className={classes.underlined}>importe</span> ma photo de profil
+                                        </Typography>
+                                        <KeyboardArrowRightIcon className={classes.InputKeyboardArrowRightIcon} />
+                                    </Button>
+                                </label></Fragment>)
+                        } */}
+                        {this.AfficherErreurs()}
+                        {this.AfficherSuccess()}
                        
-                </form>
+
+                        <TextField
+                            name="firstname"
+                            required
+                            id="outlined-required"
+                            label="Prénom"
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            value={this.state.firstname}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        />
+
+                        <TextField
+                            name="lastname"
+                            required
+                            id="outlined-required"
+                            label="Nom"
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            value={this.state.lastname}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        />
+
+                        <TextField
+                            disabled
+                            name="email"
+                            id="outlined"
+                            label="E-mail"
+                            required
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            value={this.state.email}
+                            onChange={this.handleChange}
+                            type="mail"
+                            onBlur={this.onBlur} 
+                        />
+
+                        <TextField
+                            name="phone"
+                            id="outlined"
+                            label="Téléphone"
+                            required
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            value={this.state.phone ? this.state.phone: ''}
+                            onChange={this.handleChange}
+                            type="tel"
+                            onBlur={this.onBlur} 
+                        />
+
+                        <Autosuggest
+                        suggestions={suggestionsMetier}
+                        onSuggestionsFetchRequested={this.onSuggestionsMetierFetchRequested}
+                        onSuggestionsClearRequested={this.onSuggestionsMetierClearRequested}
+                        getSuggestionValue={this.getSuggestionMetierValue}
+                        renderSuggestion={this.renderSuggestionMetier}
+                        inputProps={inputPropsMetier}
+                        />
+                        <input type="hidden" id="appellation_id" value={this.state.appellationId =='null' || this.state.appellationId ==''  ? '' :this.state.appellationId}></input>
+                        <input type="hidden" id="appellation_libelle" value={this.state.appellationLibelle =='null' || this.state.appellationLibelle ==''  ? '' :this.state.appellationLibelle}></input>
+
+                        {/* <TextField
+                            name="currentJob"
+                            id="outlined"
+                            label="Poste actuel"
+                            required
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            value={this.state.currentJob =='null' || this.state.currentJob ==''  ? '' :this.state.currentJob}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        /> */}
+                        <div className={classes.container}>
+                            <div 
+                            className={classes.conteneurGoogle}
+                            classes={{ root: classes.rootTextfield }} 
+                            style={{ position: 'relative', zIndex:2, width: '100%' }}>
+                                <label htmlFor="outlined-required"
+                                className={classes.labelGeoloc}>
+                                    Adresse
+                                </label>
+                                <div className={classes.conteneurGoogleComposant}>
+                                    <GooglePlaceAutocomplete
+                                        style={{ paddingLeft:'14px !important', left: 0, right: 0, zIndex: '2 !important', width: '100%', textAlign:"left !important", }}
+                                        name="location"
+                                        label="Location"
+                                        id="outlined-required"
+                                        variant="outlined"
+                                        textFieldProps={{ id: "outlined-required" }}
+                                        className={classes.textField}
+                                        classes={{ root: classes.rootTextfield }} 
+                                        options={this.searchOptions}
+                                        onSuggestionSelected={this.onSuggestionSelected}
+                                        textFieldProps={{ onChange: (e) => this.onChange(e), value: this.state.value, placeholder: 'Ex : Rue de Rivoli, Paris, France', fullWidth: true, size:"small"}}
+                                        types={['(regions)']}
+                                        componentRestrictions={{country: 'fr'}}
+                                        renderTarget={() => (
+                                            <div   
+                                            style={{
+                                                width: '100%',
+                                                zIndex:9
+                                            }}
+                                            >
+                                            </div>
+                                        )}
+                                    />
+                                </div>
+                            </div>
+                            {/* <Input 
+                            name="geoloc" 
+                            id="geoloc" 
+                            label="geoloc" 
+                            ref="geoloc" 
+                            onChange={this.handleChange}
+                            value={this.state.geoloc =='null' || this.state.geoloc ==''  ? '' :this.state.geoloc}
+                            /> */}
+                        </div>
+
+                        {/* <TextField
+                            name="address1"
+                            id="outlined"
+                            label="Adresse"
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            value={this.state.address1 ? this.state.address1 : ''}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        /> */}
+
+                        {/* <TextField
+                            name="address2"
+                            id="outlined"
+                            label="Adresse complémentaire"
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            value={this.state.address2 ? this.state.address2  : ''}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        />     */}
+                        {/* <div className={classes.container}> */}
+                        {/* <TextField
+                            name="zipCode"
+                            id="outlined"
+                            label="Code postal"
+                            className={classes.textField}
+                            classes={{ root: classes.textFieldSmall }}
+                            variant="outlined"
+                            value={this.state.zipCode ? this.state.zipCode : ''}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        />  */}
+
+                        {/* <TextField
+                            name="city"
+                            id="outlined"
+                            label="Ville"
+                            className={classes.textField}
+                            classes={{ root: classes.textFieldSmall }}
+                            variant="outlined"
+                            value={this.state.city ? this.state.city : ''}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        />       */}
+
+                        {/* <TextField
+                            name="country"
+                            id="outlined"
+                            label="Pays"
+                            className={classes.textField}
+                            classes={{ root: classes.textFieldSmall }}
+                            variant="outlined"
+                            value={this.state.country ? this.state.country : ''}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        /> */}
+                        {/* </div>            */}
+
+                        <TextField
+                            name="linkedin"
+                            id="outlined"
+                            label="Linkedin"
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            placeholder="http://www.linkedin.com/in/"
+                            value={this.state.linkedin =='null' || this.state.linkedin ==''  ? '' :this.state.linkedin}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+
+                        />
+
+                        <TextField
+                            name="twitter"
+                            id="outlined"
+                            label="Twitter"
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            placeholder="http://twitter.com/.."
+                            value={this.state.twitter =='null' || this.state.twitter ==''  ? '' :this.state.twitter}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        />
+
+                        <TextField
+                            name="website"
+                            id="outlined"
+                            label="Site internet"
+                            className={classes.textField}
+                            classes={{ root: classes.rootTextfield }}
+                            variant="outlined"
+                            placeholder="http://monsite.fr"
+                            value={this.state.website =='null' || this.state.website ==''  ? '' :this.state.website}
+                            onChange={this.handleChange}
+                            onBlur={this.onBlur} 
+                        />
+                        <Button
+                                onClick={this.refreshPage}
+                                variant="contained"
+                                color="primary"
+                                
+                                className={classes.button}>
+                                Enregistrer
+                            </Button>
+                            
+                    </form>
+
+
+                </Grid>
+            </Grid>
+            
+
                {/* <div id="F" className={classes.foot}>
                    <Button variant="contained" className={classes.button + ' cypButtonSendApplication'} onClick={this.onSubmit}>Mettre à jour!</Button>
                </div> */}
@@ -20,6 +20,7 @@ import ReactHtmlParser, { processNodes, convertNodeToElement, htmlparser2 } from
 import Grid from '@material-ui/core/Grid';
 import Container from '@material-ui/core/Container';
 import Hidden from '@material-ui/core/Hidden';
+import Movie from '@material-ui/icons/Movie';

 const styles = theme => ({
    container: {
@@ -58,8 +59,8 @@ const styles = theme => ({
        height: "100%"
    },
    conseilButton: {
-        color: "#ffffff",
-        backgroundColor:  "#25D89A",
+        color: "#1e2327",
+        backgroundColor:  "#fff",
        padding: theme.spacing(3, 2),
        margin: theme.spacing(1),
        width: "100%",
@@ -67,11 +68,12 @@ const styles = theme => ({
        boxShadow: '0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1' +
                'px rgba(0, 0, 0, 0.14)',
        '&:hover': {
-            color: "#ffffff",
-            backgroundColor:  "#25D89A",
+            color: "#1e2327",
+            backgroundColor:  "#fff",
        }
    },
    captureButton: {
+        width:"100%",
        color: theme.palette.secondary.main,
        backgroundColor: theme.palette.primary.main,
        padding: theme.spacing(5, 2),
@@ -82,8 +84,8 @@ const styles = theme => ({
        },
      },
    importButton: {
-        color: theme.palette.primary.main,
-        backgroundColor:  theme.palette.secondary.main,
+        color: "#1e2327",
+        backgroundColor:  "#fff",
        padding: theme.spacing(3, 2),
        margin: theme.spacing(1),
        width: "100%",
@@ -91,8 +93,8 @@ const styles = theme => ({
        boxShadow: '0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1' +
                'px rgba(0, 0, 0, 0.14)',
        '&:hover': {
-            color: theme.palette.primary.main,
-            backgroundColor:  theme.palette.secondary.main,
+            color: "#1e2327",
+            backgroundColor:  "#fff",
        }
    },
    InputKeyboardArrowDownIconBlank: {
@@ -102,12 +104,21 @@ const styles = theme => ({
    },
    InputKeyboardArrowDownIcon: {
        fontSize: '2.5em',
-        color: "#1689FB",
+        color: "#1e2327",
        textAlign: "right"
    },
    buttons :{
        display: "inline-table",
-    }
+    },
+    grille :{
+        paddingTop:theme.spacing(4),
+        width: "100%",
+        marginBottom:"30px",
+        
+        borderRadius: "5px",
+        border: "1px solid #1E2327",
+        color:theme.palette.primary.dark
+    },
 });
 const Recorder = dynamic(() => import ('../organisms/Recorder'), {ssr: false})
 class Etape2 extends React.Component {
@@ -117,7 +128,8 @@ class Etape2 extends React.Component {
        data: {},
        openSnack: false,
        errors: {},
-        success : {}
+        success : {},
+        openStudio : false
    };
    

@@ -146,9 +158,9 @@ class Etape2 extends React.Component {
            video: nextProps.video
        })
        //window.location.reload(false);
-        if (nextProps.media.status === 'success') {
+        if (nextProps.media.statusPres === 'success') {
            const success = {};
-            success.message ="Vidéo mise à jour";
+            success.message ="Profil mise à jour.";
            this.setState({ success });
            this.setActiveStep(1);
        }
@@ -158,7 +170,7 @@ class Etape2 extends React.Component {
        this.setState({activeStep: step})
    }

-    inputFilesystemChange = (e) => {
+    inputFilesystemChangePres = (e) => {
        this.uploadMediaPres(e)
    }

@@ -168,7 +180,7 @@ class Etape2 extends React.Component {

    uploadMediaPres = (e) => {
        var file = e.target.files[0]
-
+        console.log ("envoi de video pres")
        const data = new FormData()
        data.append('upload', file)
        //this.setState({ videoPres: videoPres })
@@ -196,6 +208,16 @@ class Etape2 extends React.Component {
    handleClose = (event, reason) => {
        this.setState({openSnack: false});
    }
+
+    realise =() =>{
+        console.log("realise");
+        this.setState({ openStudio: true});
+    }
+
+    retour =() =>{
+        console.log("retour");
+        this.setState({ openStudio: false});
+    }
   
    render() {
        const {classes, company} = this.props;
@@ -206,126 +228,168 @@ class Etape2 extends React.Component {
        } else {
            video = "";
        }
+        if (typeof global.navigator === 'undefined') global.navigator = {};
+        if (typeof global.maps === 'undefined') global.maps = {};
        return (
-            <section className={classes.container}>
-                <Fragment>
-                    {this.AfficherSuccess()}
-                    { loading ? <LoaderVideo textePrincipal="Votre vidéo est en cours d’envoi..." texteSecondaire="Veuillez rester sur la page pendant le chargement qui peut durer plusieurs minutes."/>  : <div></div> }
+
+            
+            <Grid
+            container
+            direction="row"
+            justify="space-between"
+            alignItems="flex-start"
+            className={classes.grille}
+            justify="center"
+            alignItems="center">
+                <Grid item lg={12} md={12} xl={12} xs={12} >
+                    <div id="video">
                    
-                    <div className={classes.root}>
-                    <Hidden xsUp>
-                            &nbsp;                   
-                        </Hidden>
-                    <Container maxWidth="md">
+                    <Typography 
+                    align="center"
+                    gutterBottom
+                    variant="headline"
+                    variant="h6"
+                    component="h2" 
+                    className={classes.h6}>
+                    <Movie className={classes.menuIcon}></Movie> Vidéo de présentation
+                    </Typography>
+                    <Typography 
+                    align="center">Donnez envie au recruteur de vous rencontrer grâce à la vidéo !</Typography>
+
+                    </div>
+                    <Fragment>
+                        {this.AfficherSuccess()}
+                        { loading ? <LoaderVideo textePrincipal="Votre vidéo est en cours d’envoi..." texteSecondaire="Veuillez rester sur la page pendant le chargement qui peut durer plusieurs minutes."/>  : <div></div> }
                        
-                        <Grid container
-                            justify="center"
-                            alignItems="center" 
-                            spacing={2}
-                            className={classes.buttons}>
-                            <Grid item xs={12} sm={12} md={12} lg={6} lg={6}>
-                                
-
-
-                            { /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)  ?
-                                (
-                                    <Fragment >
-                                    <input
-                                        type="file" accept="video/*" capture="camcorder"
-                                        className={classes.input}
-                                        style={{ display: 'none' }}
-                                        id="record-button-file"
-                                        multiple
-                                        onChange={this.inputCamRecorderChange}
-                                    />
-                                    <label htmlFor="record-button-file">
-                                        <Button component="span" className={classes.captureButton} classes={{ root: classes.rootButton }}>
-                                        <img alt="talents-tube" src='/static/images/capture.svg' className={classes.iconButton} />
-                                        <Typography align="left" className={classes.textButton}>
-                                            Je <span className={classes.underlined}>réalise</span> ma vidéo de présentation
-                                        </Typography>
-                                        <KeyboardArrowRightIcon className={ classes.InputKeyboardArrowRightIcon }/>
-                                        </Button>
-                                    </label>
-                                    </Fragment>
-                                ):
-                                (
-
-                                
-                                <div className={classes.recorderContainer}>
-                                    <Recorder uploader={this.props.uploadMediaPres} titreBouton="Remplacer ma vidéo"/>
+                        <div className={classes.root}>
+                        <Hidden xsUp>
+                                &nbsp;                   
+                        </Hidden>
+                        <Container maxWidth="md">
+                            
+                            <Grid container
+                                justify="center"
+                                alignItems="center" 
+                                spacing={2}
+                                className={classes.buttons}>
+                                <Grid item xs={12} sm={12} md={12} lg={12} xl={12}>
                                    
-                                </div>
-                                )
-                            }
-                            </Grid>
-                            <Grid item xs={12} sm={12} md={12} lg={6} xl={6}>
-                                <div> 
-                                    <label htmlFor="import-conseil">
-                                        <Button
-                                            component="span"
-                                            className={classes.conseilButton}
-                                            classes={{
-                                            root: classes.rootButton}}
-                                            onClick={() => Router.push(`/Conseils`)}>
-                                            <img
-                                                alt="talents-tube"
-                                                src='/statique/images/conseils-talentstube.svg'
-                                                className={classes.iconButton}/>
-                                            <Typography align="left" className={classes.textButton}>
-                                                <span className={classes.underlined}>Comment</span> créer ma vidéo 
-                                            </Typography>
-                                            <KeyboardArrowDownIcon className={classes.InputKeyboardArrowDownIconBlank}/>
-                                        </Button>
-                                    </label>
-                                </div>
-                                <div>
+
+
+                                { /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)  ?
+                                    (
+                                        <Fragment >
                                        <input
-                                            type="file"
-                                            accept="video/*"
-                                            className={classes.input + ' cypButtonImportVid'}
-                                            style={{display: 'none'}}
-                                            id="import-button-file"
-                                            onChange={this.inputFilesystemChange}/>
-                                        <label htmlFor="import-button-file">
+                                            type="file" accept="video/*" capture="camcorder"
+                                            className={classes.input}
+                                            style={{ display: 'none' }}
+                                            id="record-button-file"
+                                            multiple
+                                            onChange={this.inputCamRecorderChange}
+                                        />
+                                        <label htmlFor="record-button-file">
+                                            <Button component="span" className={classes.captureButton} classes={{ root: classes.rootButton }}>
+                                            <img alt="talents-tube" src='/static/images/capture.svg' className={classes.iconButton} />
+                                            <Typography align="left" className={classes.textButton}>
+                                                Je <span className={classes.underlined}>réalise</span> ma vidéo de présentation
+                                            </Typography>
+                                            <KeyboardArrowRightIcon className={ classes.InputKeyboardArrowRightIcon }/>
+                                            </Button>
+                                        </label>
+                                        </Fragment>
+                                    ):
+                                    (
+
+                                    <Fragment>
+                                        {this.state.openStudio == false ?
+                                            <Button component="span" className={classes.captureButton} classes={{ root: classes.rootButton }} onClick={this.realise}>
+                                            <img alt="talents-tube" src='/statique/images/capture.svg' className={classes.iconButton} />
+                                            <Typography align="left" className={classes.textButton}>
+                                              Je <span className={classes.underlined}>réalise</span> ma vidéo de présentation
+                                          </Typography>
+                                          <KeyboardArrowRightIcon className={ classes.InputKeyboardArrowRightIcon }/>
+                                          </Button>
+                                        :
+                                            <div className={classes.recorderContainer}>
+                                                <Button onClick={this.retour}>Retour au menu</Button>
+                                                <Recorder uploader={this.props.uploadMediaPres} titreBouton="Remplacer ma vidéo"/>
+                                                
+                                            </div>
+                                        }
+                                    </Fragment>
+                                    )
+                                }
+                                </Grid>
+                                <Grid item xs={12} sm={12} md={12} lg={12} xl={12}>
+                                    
+                                    <div>
+                                            <input
+                                                type="file"
+                                                accept="video/*"
+                                                className={classes.input + ' cypButtonImportVid'}
+                                                style={{display: 'none'}}
+                                                id="import-button-file-pres"
+                                                onChange={this.inputFilesystemChangePres}/>
+                                            <label htmlFor="import-button-file-pres">
+                                                <Button
+                                                    component="span"
+                                                    className={classes.importButton}
+                                                    classes={{
+                                                    root: classes.rootButton}}>
+                                                    <img
+                                                        alt="talents-tube"
+                                                        src='/statique/images/Import.svg'
+                                                        className={classes.iconButton}/>
+                                                    <Typography align="left" className={classes.textButton}>
+                                                        J'<span className={classes.underlined}>importe</span> ma vidéo de présentation
+
+                                                    </Typography>
+                                                    <KeyboardArrowDownIcon className={classes.InputKeyboardArrowDownIcon}/>
+                                                </Button>
+                                            </label>
+                                    </div>
+                                    <div> 
+                                        <label htmlFor="import-conseil">
                                            <Button
                                                component="span"
                                                className={classes.importButton}
                                                classes={{
-                                                root: classes.rootButton}}>
+                                                root: classes.rootButton}}
+                                                onClick={() => Router.push(`/Conseils`)}>
                                                <img
                                                    alt="talents-tube"
-                                                    src='/statique/images/Import.svg'
+                                                    src='/statique/images/comment-faire-une-video-reponse.svg'
                                                    className={classes.iconButton}/>
                                                <Typography align="left" className={classes.textButton}>
-                                                    J'<span className={classes.underlined}>importe</span> ma vidéo de présentation
-
+                                                    <span className={classes.underlined}>Comment</span> créer ma vidéo de présentation
                                                </Typography>
                                                <KeyboardArrowDownIcon className={classes.InputKeyboardArrowDownIcon}/>
                                            </Button>
                                        </label>
                                    </div>
+                                
+                                </Grid> 
+                                <Hidden xsUp>
+                                    &nbsp;                   
+                                </Hidden>
                            
-                            </Grid> 
-                            <Hidden xsUp>
-                                &nbsp;                   
-                            </Hidden>
-                        
-                            <Grid item xs={12} sm={12} md={12} lg={12} xl={12}>
-                                <div className={classes.videoPresentation}>
-                                    {video}   
-                                </div>                
+                                <Grid item xs={12} sm={12} md={12} lg={12} xl={12}>
+                                    <div className={classes.videoPresentation}>
+                                        {video}   
+                                    </div>                
+                                </Grid>
+                                
                            </Grid>
+                        </Container>      
+                        </div>
+                        {/* <div className={classes.textContainer}>
                            
-                        </Grid>
-                    </Container>      
-                    </div>
-                    {/* <div className={classes.textContainer}>
-                        
-                    </div> */}
-                            
-                </Fragment>
-            </section>
+                        </div> */}
+                                
+                    </Fragment>
+                </Grid>
+            </Grid>
+            

        );
    }
@@ -17,8 +17,9 @@ import getConfig from 'next/config'
 import Card from '@material-ui/core/Card';
 import CardActions from '@material-ui/core/CardActions';
 import CardContent from '@material-ui/core/CardContent';
-
-
+import Description from '@material-ui/icons/Description';
+import Grid from '@material-ui/core/Grid';
+import Container from '@material-ui/core/Container';
 const styles = theme => ({
  root: {
    display: 'flex',
@@ -40,21 +41,61 @@ const styles = theme => ({
  },
  InputKeyboardArrowDownIcon: {
    fontSize: '2.5em',
-    color: theme.palette.primary.main,
+    color: theme.palette.primary.dark,
  },
  importButton: {
-    color: theme.palette.primary.main,
-    backgroundColor:  theme.palette.secondary.main,
+    color: "#1e2327",
+    backgroundColor:  "#fff",
    padding: theme.spacing(3, 2),
    margin: theme.spacing(1),
-    width: "370px",
+    width: "100%",
+    textAlign: "right",
    boxShadow: '0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1' +
            'px rgba(0, 0, 0, 0.14)',
    '&:hover': {
-        color: theme.palette.primary.main,
-        backgroundColor:  theme.palette.secondary.main,
+        color: "#1e2327",
+        backgroundColor:  "#fff",
    }
  },
+  grille :{
+        paddingTop:theme.spacing(4),
+        paddingRight:"30px",
+        width: "100%",
+        marginBottom:"30px",
+        
+        borderRadius: "5px",
+        border: "1px solid #1E2327",
+        color:theme.palette.primary.dark
+  },
+  grille2 :{
+    margin:'10px',     
+    width: "100%",
+    marginBottom:"30px",
+
+},
+  button: {
+    width:"200px",
+    textTransform: 'inherit',
+    margin: theme.spacing(0, 8),
+    padding: theme.spacing(1.2, 2),
+    [theme.breakpoints.up('sm')]: {
+      margin: 'auto',
+    },
+  },
+  boutonMobile:{
+    width:"200px",
+    textAlign :"center",
+    color: theme.palette.secondary.main,
+    backgroundColor: theme.palette.primary.important,
+    margin : "0px !important"
+  },
+  lien:{
+    textDecoration:'none',
+    color:'#fff'
+  },
+  centered:{
+    textAlign:"center"
+  }
 });


@@ -90,12 +131,12 @@ class Etape3 extends React.Component {
        openSnack: !!!_.isEmpty(nextProps.errors),
        errors: !!!nextProps.errors ? { errors: { message: "" } } : nextProps.errors,
    })
-    this.state.cvLink = nextProps.cvLink;
-    if (nextProps.loading) {
+
+    if (nextProps.mediaCv.statusCv === 'success') {
      const success = {};
-      success.message ="CV mis à jour";
+      success.message ="Profil mis à jour";
      console.log("CV mis à jour!!!")
-      if(this.state.cvLink) console.log(this.state.cvLink)
+      if(nextProps.mediaCv) console.log(nextProps.mediaCv.message)
      this.setState({ success });
      
    }
@@ -103,7 +144,7 @@ class Etape3 extends React.Component {
    
  }

-  inputFilesystemChange = (e) => {
+  inputFilesystemChangeCv = (e) => {
    this.uploadMediaCv(e)
  }
  
@@ -112,7 +153,7 @@ class Etape3 extends React.Component {

    const data = new FormData()
    data.append('upload', file)
-
+    console.log ("envoi de cv")
    this.props.uploadMediaCv(data)
  }

@@ -122,6 +163,7 @@ class Etape3 extends React.Component {
        return "";
    } else if (this.state.success.length != 0 && this.state.success.message != "") {
        return (
+          
          <Snackbar open={open} autoHideDuration={1000} onClose={() => this.setState({open: false})}>
            <Alert onClose={() => this.setState({open: false})} severity="success">
              {ReactHtmlParser(this.state.success.message)}
@@ -132,7 +174,7 @@ class Etape3 extends React.Component {
    return "";
  }

-  AfficherLienCv() {
+  AfficherLienCv(classes) {
    console.log("afficher lien");
     if (this.state.cvLink !="") {
      
@@ -144,39 +186,26 @@ class Etape3 extends React.Component {
            
            <Hidden>&nbsp;</Hidden>
            <Hidden>&nbsp;</Hidden>
-            <Card  variant="" style={{
-              width:370+"px", 
-              boxShadow: '0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1' +
-                      'px rgba(0, 0, 0, 0.14)',
-              marginLeft : '10px',
-              marginTop:'10px'
-              
-              }}>
+            
            <Hidden>&nbsp;</Hidden>
-              <CardActions>
-                <Button size="small">MON CV</Button>
-              </CardActions>
-              <CardContent>
+                <div className={classes.centered} >
                <Typography >
                  <a href={publicRuntimeConfig.symphonyUrl + publicRuntimeConfig.postedContentCv + this.state.cvLink} 
-                  target="_blank"
-                  style={{ 
-                    color:'#1689FB',
-                    '&:hover': {
-                      color: '#1689FB',
-                    },
-                    fontWeight: '700',
-                    fontSize: '1em',
-                    }}
+                  target="_blank" className={classes.lien}
+
                  >
-                    Visualiser mon CV
+                  <Button
+                            variant="contained"
+                            className={classes.button + ' ' + classes.boutonMobile}
+                          >Visualiser mon CV
+                      </Button>
+                  
                    </a>
                    <br />
-                {/* <a href="https://www.permatheque.fr/PDF/mansobufukuoka-larevolutiondunseulbrindepaille.pdf" target="_blank">lien</a> */}
+                
                </Typography>
-              </CardContent>
-              
-            </Card>
+                </div>
+ 
          </Fragment>
            
        );
@@ -189,36 +218,79 @@ class Etape3 extends React.Component {
    const { classes, company } = this.props;
    const { loading } = this.state;
    return (
-      <Fragment>
-      { loading ? 
-        <LoaderVideo textePrincipal="Votre candidature vidéo est en cours d’envoi..." texteSecondaire="Veuillez rester sur la page pendant le chargement qui peut durer plusieurs minutes."/> :
-        <Fragment>
-          {this.AfficherSuccess()}
+      <Grid
+            container
+            direction="row"
+            alignItems="flex-start"
+            className={classes.grille}
+            justify="center"
+            alignItems="center">
+              
+        
+          <Grid item lg={12} md={12} xl={12} xs={12} className={classes.grilleGauche}>
+            <div id="cv">
+        
+          <Typography 
+          align="center"
+          gutterBottom
+          variant="headline"
+          variant="h6"
+          component="h2" 
+          className={classes.h6}>
+          <Description className={classes.menuIcon}></Description> Curriculum vitae
+          </Typography>
+          <Typography 
+          align="center">Importez votre CV pour permettre aux recruteurs d’en savoir plus sur vous.
+          .</Typography>
+
+          </div>
+            <Fragment>
+          { loading ? 
          
-          <input
-            type="file" 
-            accept=".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document, .pdf, .odt"
-            className={classes.input+' cypButtonImportVid'}
-            style={{ display: 'none' }}
-            id="import-button-file"
-            onChange={this.inputFilesystemChange}
-          />
-          <label htmlFor="import-button-file">
-            <Button component="span" className={classes.importButton} classes={{ root: classes.rootButton }}>
-              <img alt="talents-tube" src='/statique/images/Import-cv-candidat.svg' className={classes.iconButton} />
-              <Typography  className={classes.textButton}>
-                J'<span className={classes.underlined}>importe</span> mon CV 
-              </Typography>
-              <KeyboardArrowDownIcon className={ classes. InputKeyboardArrowDownIcon }/>
-            </Button>
-            
-          </label>
-          <Hidden>&nbsp;</Hidden>
-          {this.AfficherLienCv()}
-          
-        </Fragment>
-    }
-    </Fragment>
+            <LoaderVideo textePrincipal="Votre candidature vidéo est en cours d’envoi..." texteSecondaire="Veuillez rester sur la page pendant le chargement qui peut durer plusieurs minutes."/> :
+            <Grid
+            container
+            spacing={4}
+            direction="row"
+            alignItems="flex-start"
+            className={classes.grille2}
+            justify="center"
+            alignItems="center">
+              <Grid item xs={12} sm={12} md={12} lg={12} xl={12}>
+              <Fragment>
+              {this.AfficherSuccess()}
+                
+                <input
+                  type="file" 
+                  accept=".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document, .pdf, .odt"
+                  className={classes.input+' cypButtonImportVid'}
+                  style={{ display: 'none' }}
+                  id="import-button-file-cv"
+                  onChange={this.inputFilesystemChangeCv}
+                />
+                <label htmlFor="import-button-file-cv">
+                  <Button component="span" className={classes.importButton} classes={{ root: classes.rootButton }}>
+                    <img alt="talents-tube" src='/statique/images/Import-cv-candidat.svg' className={classes.iconButton} />
+                    <Typography  className={classes.textButton}>
+                      J'<span className={classes.underlined}>importe</span> mon CV 
+                    </Typography>
+                    <KeyboardArrowDownIcon className={ classes. InputKeyboardArrowDownIcon }/>
+                  </Button>
+                  
+                </label>
+                <Hidden>&nbsp;</Hidden>
+                {this.AfficherLienCv(classes)}
+                <Hidden>&nbsp;</Hidden>
+                <Hidden>&nbsp;</Hidden>
+                <Hidden>&nbsp;</Hidden>
+              </Fragment>
+              </Grid>
+              </Grid>
+          }
+          </Fragment>
+        </Grid>
+        
+    </Grid>
    ); 
  }

@@ -249,6 +321,7 @@ function mapStateToProps(state) {
    cvLink : state.mediaCv.message,
    loading: !!state.media.loading,
    cv : true,
+    mediaCv: state.mediaCv,
    //errors:  errorMessageSelector(state),
    user: state.user,
    company: state.company
@@ -28,6 +28,8 @@ import RefreshIcon from '@material-ui/icons/Refresh';
 // from '@material-ui/icons/LocationOn';
 import Link from 'next/link'
 import Box from '@material-ui/core/Box';
+import Tabs from '@material-ui/core/Tabs';
+import Tab from '@material-ui/core/Tab';

 import {
    Card,
@@ -63,7 +65,10 @@ const styles = theme => ({
        width: '100%',
        position: 'fixed',
        bottom: 0
-    }
+    },
+    menu: {
+        backgroundColor: "#DAE8F2"
+    },
 });

 const useStyles = makeStyles(theme => ({
@@ -116,6 +121,9 @@ const useStyles = makeStyles(theme => ({
    },
    resetContainer: {
        padding: theme.spacing(3)
+    },
+    conteneur:{
+        backgroundColor: "#f3f3f4",
    }
 }));

@@ -242,11 +250,9 @@ const AccountProfile = props => {
        return skipped.has(step);
    };

-    const handleChange = (event) => {
-        setState({
-            ...state,
-            [event.target.name]: event.target.checked
-        });
+    const handleChange = (event, newValue) => {
+
+       
    };

    function isStepComplete(step) {
@@ -260,210 +266,44 @@ const AccountProfile = props => {
    }

    return (
+        
        <Grid
            container
-            spacing={4}
-            direction="row"
-            justify="space-between"
-            alignItems="flex-start">
-            <Grid item lg={3} md={6} xl={4} xs={12}>
-                <Card {...rest} className={clsx(classes.root, className)}>
-                    <CardContent>
-                        <div id="fb-root"></div>
-                        <script
-                            async
-                            defer
-                            crossorigin="anonymous"
-                            src="https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v8.0&appId=2332071840142634&autoLogAppEvents=1"
-                            nonce="O28M4TTm"></script>
-                        <div className={classes.details}>
-                            <div>
-                                <Typography gutterBottom variant="h5">
-                                    {user.lastname}
-                                    &nbsp; {user.firstname}
-                                    <a href="#" onClick={refresh}><RefreshIcon className={classes.menuButton}/></a>
-                                </Typography>
-                                <Typography
-                                    className={classes.locationText}
-                                    color="textSecondary"
-                                    variant="body1">
-                                    <MailIcon className={classes.menuButton}/>
-                                    : {user.email}<br/>
-                                    <PhoneIcon className={classes.menuButton}/>
-                                    : {user.phone}<br/>
-                                    <LinkedInIcon className={classes.menuButton}/>
-                                    : {(user.linkedin && user.linkedin != '' && user.linkedin != 'null')
-                                        ? <a href={user.linkedin} target="_blank">Lien sur mon linkedIn</a>
-                                        : 'Non renseigné'}<br/>
-                                    <PublicIcon className={classes.menuButton}/>
-                                    : {(user.website && user.website != '' && user.website != 'null')
-                                        ? <a href={user.website} target="_blank">Lien sur mon site</a>
-                                        : 'Non renseigné'}<br/>
-                                    
-                                    
-                                    
-                                </Typography>
+            
+            >
+            <Grid item lg={12} md={12} xl={12} xs={12} >
+                <div >
+                    <Paper  elevation={0} >
+
+                            <Tabs
+                            value={1}
+                            onChange={handleChange}
+                            indicatorColor="primary"
+                            textColor="theme.palette.primary.dark"
+                            centered
+                            >
+                                <Link href="/Candidatures"><Tab label="Mes candidatures" /></Link>
+                                <Tab label="Mon profil" />
                                
-                            </div>
-                            {/* <Avatar
-                                className={classes.avatar}
-                                src={publicRuntimeConfig.symphonyUrl + publicRuntimeConfig.postedContentUrl + logoUrl}/> */}
-                        </div>
-                        <div>
-                        <Box m={3}/>
-                        <Divider/>
-                        <Box m={3}/>
-                        <Typography
-                                    className={classes.locationText}
-                                    color="textSecondary"
-                                    variant="body1">
-                                    
-                                    <DuoIcon className={classes.menuButton}/>
-                                    : {(user.alias && user.alias != '' && user.alias != 'null')
-                                        ? <a
-                                                href={publicRuntimeConfig.cvThequeUrl + "/talent/" + user.alias}
-                                                target="_blank">Voir mon profil TalentsTube
-                                            </a>
-                                        : 'Non renseigné'}<br/>
-                                    <div
-                                        class="fb-share-button"
-                                        data-href={publicRuntimeConfig.cvThequeUrl + "/talent/" + user.alias}
-                                        data-layout="button_count"
-                                        data-size="small">
-
-                                        <Facebook className={classes.menuButton}/>
-                                        :
-                                        <a
-                                            target="_blank"
-                                            href={"https://www.facebook.com/sharer/sharer.php?u=" + publicRuntimeConfig.cvThequeUrl + "/talent/" + user.alias + "%2F&amp;src=sdkpreparse"}
-                                            class="fb-xfbml-parse-ignore"> Partager mon profil
-                                        </a>
-                                    </div>
-                                </Typography>
-                        </div>
-                        {/* <div className={classes.progress}>
-                            <Typography variant="body1">Etat du Profil: 70%</Typography>
-                            <LinearProgress value={70} variant="determinate"/>
-                        </div> */}
-
-                    </CardContent>
-                    <Box m={2}/>
-                    <Divider/>
-                    <Box m={2}/>
-                    <div className={classes.information}>
-                        <Typography className={classes.texteBlanc} align="left"></Typography>
-                    </div>
-                    {/* <CardActions>
-                        <Button className={classes.uploadButton} color="primary" variant="text">
-                            Remplacer une photo de profil
-                        </Button>
-                        <Button variant="text">Supprimer photo de profil</Button>
-                    </CardActions> */}
-                    <Box m={1}/>
-                    <Divider/>
-                     {/* <CardContent>
-                        <Typography variant="body1"></Typography>
-                        <FormControlLabel
-                            value="end"
-                            control={< Switch checked = {
-                            state.checkedA
-                        }
-                        onChange = {
-                            handleChange
-                        }
-                        name = "checkedA" color = "primary" />}
-                            label="Je souhaite afficher mon profil sur la CV Vidéothèque Talents Tube"
-                            labelPlacement="start"/>
-
-                    </CardContent> */}
-
-                    
-
-                    <CardActions>
-
-                        <Stepper nonLinear activeStep={activeStep} orientation="vertical">
-                            {steps.map((label, index) => {
-                                const stepProps = {};
-                                const buttonProps = {};
-                                if (isStepOptional(index)) {
-                                    buttonProps.optional = <Typography variant="caption">Optional</Typography>;
-                                }
-                                if (isStepSkipped(index)) {
-                                    stepProps.completed = false;
-                                }
-                                return (
-                                    <Step key={label} className={classes.actionsContainer} {...stepProps}>
-                                        <StepButton
-                                            onClick={handleStep(index)}
-                                            completed={isStepComplete(index)}
-                                            {...buttonProps}>
-                                            {label}
-                                        </StepButton>
-
-                                    </Step>
-                                );
-                            })}
-                        </Stepper>
-                    </CardActions>
-                    <Divider/>
-
-                    <div>
-
-                        <div>
-
-                            <div>
-
-                                {/* {isStepOptional(activeStep) && !completed.has(activeStep) && (
-                    <Button
-                      variant="contained"
-                      color="primary"
-                      onClick={handleSkip}
-                      className={classes.button}
-                    >
-                      Skip
-                    </Button>
-                  )} */}
-
-                                {/* {activeStep !== steps.length &&
-                    (completed.has(activeStep) ? (
-                      <Typography variant="caption" className={classes.completed}>
-                        Step {activeStep + 1} already completed
-                      </Typography>
-                    ) : (
-                      <Button variant="contained" color="primary" onClick={handleComplete}>
-                        {completedSteps() === totalSteps() - 1 ? 'Finish' : 'Complete Step'}
-                      </Button>
-                    ))} */}
-                            </div>
-                        </div>
-
-                    </div>
-                    <Box m={2}/>
-                <CardContent>
-                    <BottomNavigation className={classes.stickToBottom}>
-                        <Button
-                            disabled={activeStep === 0}
-                            onClick={handleBack}
-                            className={classes.button}>
-                            Etape précédente
-                        </Button>
-                        <Button
-                            variant="contained"
-                            color="primary"
-                            onClick={handleNext}
-                            className={classes.button}>
-                            Etape suivante
-                        </Button>
-                        {/* <BottomNavigationAction label="Recents" icon={< RestoreIcon />}/>
-                      <BottomNavigationAction label="Favorites" icon={< FavoriteIcon />}/>
-                      <BottomNavigationAction label="Nearby" icon={< LocationOnIcon />}/> */}
-                    </BottomNavigation>
-                </CardContent>
-                </Card>
+                            </Tabs>
+                    </Paper>
+                   
+                </div>
+            
+            </Grid>
+            <Grid item lg={3} md={3} xl={4} xs={12}>
+                
                
            </Grid>
-            <Grid item lg={9} md={6} xl={8} xs={12}>
-                {getStepContent(activeStep)}
+            <Grid item lg={6} md={6} xl={4} xs={12} >
+                
+                <AccountEtape1 ></AccountEtape1>
+                <AccountEtape2 ></AccountEtape2>
+                <AccountEtape3 ></AccountEtape3>
+            </Grid>
+            <Grid item lg={3} md={3} xl={4} xs={12}>
+                
+                
            </Grid>

        </Grid>
@@ -8,7 +8,7 @@ import Chip from '@material-ui/core/Chip';
 import CardContent from '@material-ui/core/CardContent';
 import CardMedia from '@material-ui/core/CardMedia';
 import Typography from '@material-ui/core/Typography';
-import IconText from './../atoms/IconText';
+import IconText from './../atoms/IconTextInline';
 import KeyboardArrowleftIcon from '@material-ui/icons/PlayArrowRounded';
 import ArrowForwardIcon from '@material-ui/icons/ArrowForward';
 import Link from 'next/link';
@@ -83,11 +83,11 @@ const styles = theme => ({
  },
  iconTextIcon: {
    color: theme.palette.offerlistitem.icon,
-    fontSize: '0.8em',
+    fontSize: '1em',
  },
  iconTextText: {
    color: theme.palette.offerlistitem.text,
-    fontSize: '0.6em',
+    fontSize: '1em',
    paddingLeft: theme.spacing(1),
  },
  bottomCard: {
@@ -96,8 +96,9 @@ const styles = theme => ({
    width: '90%',
  },
  chip: {
-    color: theme.palette.secondary.main,
-    backgroundColor: theme.palette.primary.important,
+    marginTop :"10px",
+    backgroundColor:"#E7F3FF",
+    color:theme.palette.primary.dark,
  },
  icon: {
    color: theme.palette.secondary.dark,
@@ -112,50 +113,30 @@ const { publicRuntimeConfig } = getConfig()
 //must go in API
 const status = new Map([

-  ["DRAFT"
-    , "Brouillon"]
+  ["A_TRAITER"
+    , "Envoyée"]
  ,
-  ["TO_PUBLISH"
-    , "En cours de validation"]
+  ["CONTACTE"
+    , "En cours de traitement"]
  ,
-  ["VALIDATED"
-    , "Validée"]
+  ["ENTRETIEN"
+    , "En cours de traitement"]
  ,
-  ["PUBLISHED"
-    , "Publiée"]
+  ["REFUSE"
+    , "Refusée"]
  ,
-  ["CLOSED"
-    , "Cloturée"]
+  ["EMBAUCHE"
+    , "Embauchée"]
  ,
  ["EXPIRED"
    , "Expirée"]
  ,
-  ["SENDED"
+  [""
    , "Envoyée"]
  ,
-  ["DECLINED"
-    , "Refusée"]
+  ["Null"
+    , "Envoyée"]
  ,
-  ["NEW"
-    , "Nouveau"]
-  ,
-  ["VIEWED"
-    , "Visionnée"]
-  ,
-  ["NEGATIVE"
-    , "Négatif"]
-  ,
-  ["POSITIVE"
-    , "Positif"]
-  ,
-  ["INFOS"
-    , "Demande d’informations"]
-  ,
-  ["CONTACTED"
-    , "Demande d’informations"]
-  ,
-  ["CONTACTED.RDV"
-    , "Convocation entretien"]

 ])
 class AnswerRowComponent extends React.Component {
@@ -169,12 +150,14 @@ class AnswerRowComponent extends React.Component {
      companyR = rowData.ad.company;
    else
      companyR = company;
-
+    console.log(rowData);
+    const ville = (rowData.ad && rowData.ad.location && rowData.ad.location.gmap_address && rowData.ad.location.gmap_address.address_components[0] )
+      ? rowData.ad.location.gmap_address.address_components[0].long_name
+      : "ND"
    const imgUrl = (rowData.ad && rowData.ad.video && rowData.ad.video.thumbnails[0] && rowData.ad.video.thumbnails[0].sizes[4])
      ? rowData.ad.video.thumbnails[0].sizes[4].link
      : publicRuntimeConfig.adListDefaultUrl
    const logoUrl = publicRuntimeConfig.symphonyUrl + publicRuntimeConfig.cachedMediaUrl + companyR.logo
-
    return (
      <Link href={`/Candidature/${rowData.id}`} >
        <Card className={classes.card} >
@@ -204,8 +187,18 @@ class AnswerRowComponent extends React.Component {
                  className={classes.companyTitle}>
                  {rowData.ad.company.brand_name&&rowData.ad.company.brand_name}
                </Typography>
+                <Typography
+                  variant="headline"
+                  variant="h6"
+                  component="h4"
+                  className={classes.companyTitle}>
+                  <IconText classes={{ root: classes.iconText, icon: classes.iconTextIcon, text: classes.iconTextText }} variant="place" text={ville} />  
+                  <IconText classes={{ root: classes.iconText, icon: classes.iconTextIcon, text: classes.iconTextText }} variant="assignment" text={rowData.ad.extra&&rowData.ad.extra.contract_type?rowData.ad.extra.contract_type:"ND"} />  
+                  <IconText classes={{ root: classes.iconText, icon: classes.iconTextIcon, text: classes.iconTextText }} variant="watch_later" text={(new Date(rowData.c_time)).toLocaleDateString("fr-FR")} />  
+                  
+                </Typography>
                <div className={ classes.bottomCard }>
-                  <Chip size="small" label={status.get(rowData.status)} className={classes.chip} />
+                  <Chip size="small" label={status.get(rowData.status_reponse)? status.get(rowData.status_reponse) : "Envoyée" } className={classes.chip} />
                  <ArrowForwardIcon className={classes.icon} />
                </div>
              </div>
@@ -236,8 +229,15 @@ class AnswerRowComponent extends React.Component {
                  className={classes.companyTitle}>
                  {rowData.company.brand_name&&rowData.company.brand_name}
                </Typography>
+                <Typography
+                  variant="headline"
+                  variant="h6"
+                  component="h4"
+                  className={classes.companyTitle}>
+                  <IconText classes={{ root: classes.iconText, icon: classes.iconTextIcon, text: classes.iconTextText }} variant="watch_later" text={(new Date(rowData.c_time)).toLocaleDateString("fr-FR")} />  
+                </Typography>
                <div className={ classes.bottomCard }>
-                  <Chip size="small" label={status.get(rowData.status)} className={classes.chip} />
+                <Chip size="small" label={status.get(rowData.status_reponse)? status.get(rowData.status_reponse) : "Envoyée" } className={classes.chip} />
                  <ArrowForwardIcon className={classes.icon} />
                </div>
              </div>
@@ -529,7 +529,7 @@ class Header extends React.Component {
                      <a className={classes.lightMenuItem}>
                        <ListItem classes={{ root: classes.rootListItemIcon }}>
                        <AccountCircleIcon className={classes.icon} />
-                        <ListItemText primary='Mon compte'>
+                        <ListItemText primary='Mon profil'>
                        </ListItemText>
                        </ListItem>
                      </a>
@@ -538,7 +538,7 @@ class Header extends React.Component {
                    <Link href="/Parametres"  >
                      <a className={classes.lightMenuItem}><ListItem classes={{ root: classes.rootListItemIcon }}>
                        <SettingsIcon className={classes.icon} />
-                        <ListItemText primary='Paramètres de notification'>
+                        <ListItemText primary='Paramètres'>
                        </ListItemText>
                      </ListItem></a>
                    </Link>
@@ -438,7 +438,7 @@ class HeaderPersonnalise extends React.Component {
                      <a className={classes.lightMenuItem}>
                        <ListItem classes={{ root: classes.rootListItemIcon }}>
                        <AccountCircleIcon className={classes.icon} />
-                        <ListItemText primary='Mon compte'>
+                        <ListItemText primary='Mon profil'>
                        </ListItemText>
                        </ListItem>
                      </a>
@@ -447,7 +447,7 @@ class HeaderPersonnalise extends React.Component {
                    <Link href="/Parametres"  >
                      <a className={classes.lightMenuItem}><ListItem classes={{ root: classes.rootListItemIcon }}>
                        <SettingsIcon className={classes.icon} />
-                        <ListItemText primary='Paramètres de notification'>
+                        <ListItemText primary='Paramètres'>
                        </ListItemText>
                      </ListItem></a>
                    </Link>
@@ -750,7 +750,7 @@ function OffreDetail(props) {

                {/* <a href={entrepriseLink}> */}
                {/* const entrepriseLink = (offre.company && `/Entreprise/${offre.company.id}-${_.kebabCase(offre.company.brand_name)}`); */}
-               
+                <link rel="preload" as="image" href={isWidthUp('xs', props.width) ? imgUrlDesktop : imgUrl}/>
                <Link href={`/Player?id=${offre.company.id}&url=/Offre/${offre.id}-${_.kebabCase(offre.title)}&videoId=${Ar.last(_.split(offre.company.presentation_video.cdn_url, '/'))}&typeEntite=Entreprise&nameCompany=${offre.company.brand_name}&nameOffre=`} >   
                    <div className={classes.discoverContainerImage}>
                        <img src={isWidthUp('sm', props.width) ? imgUrlDesktop : imgUrl} alt={offre.company.brand_name && offre.company.brand_name} />
@@ -831,7 +831,7 @@ function OffreDetail(props) {
                                     
                                        {/* <VideoVimeo  {...isCandidature == 'true' ? 'classes={{ video: classes.videoOffre }}' : ''} videoId={Ar.last(_.split(offre.video.cdn_url, '/'))} autoplay='1' /> */}
                                        <div className={classes.contentContainer}>
-                                            
+                                            <link rel="preload" as="image" href={isWidthUp('xs', props.width) ? imgUrlDesktopOffre : imgUrlOffre}/>
                                            <Link href={`/Player?id=${offre.id}&url=/Offre/${offre.id}-${_.kebabCase(offre.title)}&videoId=${Ar.last(_.split(offre.video.cdn_url, '/'))}&typeEntite=Offre&nameCompany=${offre.company && offre.company.brand_name}&nameOffre=${offre.title}`} >   
                                                    <div className={classes.discoverContainerImage}>
                                                        <img  src={isWidthUp('sm', props.width) ? imgUrlDesktopOffre : imgUrlOffre} alt={offre.company.brand_name && offre.company.brand_name} />
@@ -845,7 +845,7 @@ function OffreDetail(props) {
                                                        </div>
                                                        <KeyboardArrowleftIcon className={classes.iconPlay} />
                                                        <Typography variant="h3" component="h3" className={classes.playerTexte}>
-                                                            Lire la vidéo
+                                                            Lire la vidéo.
                                                        </Typography>
                                                    </div>
                                            </Link>         
@@ -879,7 +879,7 @@ function OffreDetail(props) {

                                                {/* <a href={entrepriseLink}> */}
                                                {/* const entrepriseLink = (offre.company && `/Entreprise/${offre.company.id}-${_.kebabCase(offre.company.brand_name)}`); */}
-                                            
+                                                <link rel="preload" as="image" href={isWidthUp('xs', props.width) ? imgUrlDesktop : imgUrl}/>
                                                <Link href={`/Player?id=${offre.company.id}&url=/Offre/${offre.id}-${_.kebabCase(offre.title)}&videoId=${Ar.last(_.split(offre.company.presentation_video.cdn_url, '/'))}&typeEntite=Entreprise&nameCompany=${offre.company.brand_name}&nameOffre=`} >   
                                                    <div className={classes.discoverContainerImage}>
                                                        <img src={isWidthUp('sm', props.width) ? imgUrlDesktop : imgUrl} alt={offre.company.brand_name && offre.company.brand_name} />
@@ -900,6 +900,7 @@ function OffreDetail(props) {
                                    {offre.territories && territoryVideoId && (
                                        <div className={classes.container + ' ' + classes.discoverContainerTerritory}>
                                            <section>
+                                            <link rel="preload" as="image" href={isWidthUp('xs', props.width) ? imgUrlDesktopTerritoire : imgUrlTerritoire}/>
                                                <Link href={`/Player?id=${offre.territories[0].territory.id}&url=/Offre/${offre.id}-${_.kebabCase(offre.title)}&videoId=${territoryVideoId}&typeEntite=Territoire&nameCompany=${offre.territories[0].territory.brand_name}&nameOffre=`} >   
                                                    <div className={classes.discoverContainerImage}>
                                                        <img src={isWidthUp('sm', props.width) ? imgUrlDesktopTerritoire : imgUrlTerritoire} alt={(!!!offre.territories) ? offre.territories[0].territory.brand_name : ''} />
@@ -984,8 +985,8 @@ function OffreDetail(props) {
            </Hidden>                        
            {/* PARTIE MOBILE */}   
            <Hidden mdUp>
-                <section className={classes.contentContainerMobile}>
-                                            
+                <section className={classes.contentContainerMobile}>                      
+                    <link rel="preload" as="image" href={isWidthUp('xs', props.width) ? imgUrlDesktopOffre : imgUrlOffre}/>
                    <Link href={`/Player?id=${offre.id}&url=/Offre/${offre.id}-${_.kebabCase(offre.title)}&videoId=${Ar.last(_.split(offre.video && offre.video.cdn_url, '/'))}&typeEntite=Offre&nameCompany=${offre.company && offre.company.brand_name}&nameOffre=${offre.title}`} >   
                            <div className={classes.discoverContainerImage}>
                                <img  src={isWidthUp('xs', props.width) ? imgUrlDesktopOffre : imgUrlOffre} alt={offre.company && offre.company.brand_name && offre.company.brand_name} />
@@ -1046,10 +1047,10 @@ function OffreDetail(props) {
                        <div className={classes.container + ' ' + classes.discoverContainerCompany}>
                            <section>
                                
-
+                           
                                {/* <a href={entrepriseLink}> */}
                                {/* const entrepriseLink = (offre.company && `/Entreprise/${offre.company.id}-${_.kebabCase(offre.company.brand_name)}`); */}
-                            
+                                <link rel="preload" as="image" href={isWidthUp('xs', props.width) ? imgUrlDesktop : imgUrl}/>
                                <Link href={`/Player?id=${offre.company.id}&url=/Offre/${offre.id}-${_.kebabCase(offre.title)}&videoId=${Ar.last(_.split(offre.company.presentation_video.cdn_url, '/'))}&typeEntite=Entreprise&nameCompany=${offre.company.brand_name}&nameOffre=`} >   
                                    <div className={classes.discoverContainerImage}>
                                        <img src={isWidthUp('xs', props.width) ? imgUrlDesktop : imgUrl} alt={offre.company.brand_name && offre.company.brand_name} />
@@ -1070,6 +1071,7 @@ function OffreDetail(props) {
                    {offre.territories && territoryVideoId && (
                        <div className={classes.container + ' ' + classes.discoverContainerTerritory}>
                            <section>
+                            <link rel="preload" as="image" href={isWidthUp('xs', props.width) ? imgUrlDesktopTerritoire : imgUrlTerritoire}/>
                                <Link href={`/Player?id=${offre.territories[0].territory.id}&url=/Offre/${offre.id}-${_.kebabCase(offre.title)}&videoId=${territoryVideoId}&typeEntite=Territoire&nameCompany=${offre.territories[0].territory.brand_name}&nameOffre=${offre.title}`} >   
                                    <div className={classes.discoverContainerImage}>
                                        <img src={isWidthUp('sm', props.width) ? imgUrlDesktopTerritoire : imgUrlTerritoire} alt={(!!!offre.territories) ? offre.territories[0].territory.brand_name : ''} />
@@ -46,16 +46,16 @@ module.exports = withPlugins(
        // frontServerUrl: 'http://localhost:3000',
        // cvThequeUrl: 'https://recruteur.talentstube.com',
        // PROD
-        symphonyUrl: 'https://recruteur.talentstube.com/',
-        blogUrl: 'https://blog.talentstube.com',
-        frontServerUrl: 'https://www.talentstube.com/',
-        cvThequeUrl: 'https://recruteur.talentstube.com',
-        // PRE PROD
-        // symphonyUrl: 'https://pp.talentstube.com/',
+        // symphonyUrl: 'https://recruteur.talentstube.com/',
        // blogUrl: 'https://blog.talentstube.com',
-        // frontServerUrl: 'https://pp.app.talentstube.com/',
+        // frontServerUrl: 'https://www.talentstube.com/',
        // cvThequeUrl: 'https://recruteur.talentstube.com',
-        version : 'V2.9.2',
+        // PRE PROD
+        symphonyUrl: 'https://pp.talentstube.com/',
+        blogUrl: 'https://blog.talentstube.com',
+        frontServerUrl: 'https://pp.app.talentstube.com/',
+        cvThequeUrl: 'https://recruteur.talentstube.com',
+        version : 'V2.10.2',
        adListDefaultUrl: '/statique/images/default/default_picture_company.jpg',
        cachedMediaUrl: '/media/cache/profile_thumb/uploads/img/',
        postedContentUrl: '/uploads/img/',
@@ -1,5 +1,5 @@

-import React from 'react';
+import React, { useState } from 'react'
 import { connect } from "react-redux";
 import PropTypes from 'prop-types';
 import _ from "lodash"
@@ -12,8 +12,34 @@ import { fetchJobsAnsweredRequest } from '../actions/answer'
 import { AnswersSelector } from '../reducers/answers'
 import Head from 'next/head'
 import Link from 'next/link';
+import AppBar from '@material-ui/core/AppBar';
+import Paper from '@material-ui/core/Paper';
+import Tabs from '@material-ui/core/Tabs';
+import Tab from '@material-ui/core/Tab';
+import Box from '@material-ui/core/Box';
+import GridBouton from '@material-ui/core/Grid';
+import IconButton from '@material-ui/core/IconButton';
+import AccountIcon from '@material-ui/icons/AccountCircle';
+import MovieIcon from '@material-ui/icons/Movie';
+import DescriptionIcon from '@material-ui/icons/Description';

 const styles = theme => ({
+    menu: {
+        flexGrow: 1,
+    },
+    menu2: {
+        flexGrow: 1,
+        textAlign: 'center',
+        justifyContent: 'center',
+        padding: theme.spacing(2),
+        
+    },
+    indicatorColor:{
+        backgroundColor: theme.palette.primary.main,
+    },
+    textColor:{
+        color: theme.palette.primary.dark,
+    },
    root: {
        position: 'relative',
        textAlign: 'center',
@@ -41,13 +67,83 @@ const styles = theme => ({
      marginBottom: theme.spacing(3),
      padding: theme.spacing(0, 8),
    },
+    boutonAction:{
+        border: "none",
+        height: "6em",
+        padding: "1em",
+        backgroundColor: theme.palette.primary.main,
+        textAlign: "left",
+        borderRadius: "20px",
+        cursor: "pointer",
+        boxShadow: "0px 2px 5px rgb(30 35 39 / 5%)",
+        transition: "background-color 0.3s",
+        transition: "box-shadow 0.5s",
+        color: "#fff !important"
+    },
+    conteneurbouton:{
+        width:"100%",
+        display: "flex",
+        flexWrap: "wrap",
+        justifyContent: "space-around"
+    },
+    conteneurbouton1:{
+        width:"30%",
+        display:"inline-block",
+        paddingRight:"2em",
+    },
+    conteneurbouton2:{
+        width:"30%",
+        display:"inline-block",
+        paddingRight:"2em",
+    },
+    conteneurbouton3:{
+        width:"30%",
+        display:"inline-block",
+        paddingRight:"2em",
+    },
+    paper: {
+        width: "100%",
+        fontFamily: '"Roboto", "Helvetica", "Arial", "sans-serif"',
+        
+      },

 });
-
 class Candidatures extends React.Component {
+    constructor(props, context) {
+        super(props, context);
+
+    }
+
+    state = {
+        value: "",
+        setValue:"",
+    }
+
+    componentDidMount() {
+        this.setState({
+            value: 0,
+        })
+        
+    }

    render() {
        const { classes } = this.props;
+        const tabData = 0;
+        const handleChange = (event, newValue) => {
+            this.setState({
+                    value: newValue,
+            })
+            if(newValue==0){
+                document.location.href="/Candidatures";
+            }else if(newValue==1){
+                document.location.href="/profileStep";
+            }else if(newValue==2){
+                document.location.href="/Parametres";
+            }
+            
+            //
+            console.log(newValue);
+        };

        return (
            <LayoutGrid backLink="/">
@@ -55,14 +151,158 @@ class Candidatures extends React.Component {
                <title key="title">Candidatures</title>
                <meta name="robots" content="noindex, nofollow"></meta>
            </Head>
+            {/* <div className={classes.root}>
+                <AppBar position="static" color="default">
+                    <Tabs
+                    value={this.state.value}
+                    onChange={handleChange}
+                    indicatorColor="primary"
+                    textColor="primary"
+                    variant="scrollable"
+                    scrollButtons="auto"
+                    aria-label="scrollable auto tabs example"
+                    >
+                    <Tab label="Item One" {...a11yProps(0)} />
+                    <Tab label="Item Two" {...a11yProps(1)} />
+                    <Tab label="Item Three" {...a11yProps(2)} />
+                    <Tab label="Item Four" {...a11yProps(3)} />
+                    <Tab label="Item Five" {...a11yProps(4)} />
+                    <Tab label="Item Six" {...a11yProps(5)} />
+                    <Tab label="Item Seven" {...a11yProps(6)} />
+                    </Tabs>
+                </AppBar>
+                <TabPanel value={this.state.value} index={0}>
+                    Item One
+                </TabPanel>
+                <TabPanel value={this.state.value} index={1}>
+                    Item Two
+                </TabPanel>
+                <TabPanel value={this.state.value} index={2}>
+                    Item Three
+                </TabPanel>
+                <TabPanel value={this.state.value} index={3}>
+                    Item Four
+                </TabPanel>
+                <TabPanel value={this.state.value} index={4}>
+                    Item Five
+                </TabPanel>
+                <TabPanel value={this.state.value} index={5}>
+                    Item Six
+                </TabPanel>
+                <TabPanel value={this.state.value} index={6}>
+                    Item Seven
+                </TabPanel>
+                </div> */}
+                <div>
+                    <Paper className={classes.menu}>

-                {/* TODO */}
+                            <Tabs
+                            value={this.state.value}
+                            onChange={handleChange}
+                            indicatorColor="primary"
+                            textColor="primary"
+                            centered
+                            >
+                                <Tab label="Mes candidatures" />
+                                <Tab label="Mon profil" />
+                                
+                            </Tabs>
+                    </Paper>
+                   
+                </div>
+                
+                {/* Boutons d'actions */}
+
+                {/* <div className={classes.conteneurbouton}>
+                    <div className={classes.conteneurbouton1}>
+                        <div className={classes.boutonAction}>test</div>
+                    </div>
+                    <div className={classes.conteneurbouton2}>
+                        <div className={classes.boutonAction}>test2</div>
+                    </div>
+                    <div className={classes.conteneurbouton3}>
+                        <div className={classes.boutonAction}>test3</div>
+                    </div>
+                </div> */}
+                <GridBouton container className={classes.menu2} spacing={4}>
+                    <GridBouton item xs={12} sm={1} lg={1} >
+                    </GridBouton >
+                    <GridBouton item xs={12} sm={10} lg={10} >
+                        <GridBouton container justify="center" spacing={4}>
+                            <GridBouton key={0} item  xs={12} sm={4} >
+                                <Link href={"/profileStep#information"} >
+                                    <Paper className={classes.paper}  elevation={0}>
+                                        <div className={classes.boutonAction}>
+                                            <div>
+                                                <IconButton
+                                                    key="info"
+                                                    color="inherit"
+                                                    className={classes.close}
+                                                    
+                                                >
+                                                <AccountIcon />
+                                            </IconButton>
+                                            </div>
+                                            Compléter mes informations
+                                        </div>
+                                    </Paper>
+                                </Link>
+                            </GridBouton>
+                            <GridBouton key={1} item  xs={12} sm={4}>
+                                <Link href={"/profileStep#video"} >
+                                    <Paper className={classes.paper}  elevation={0}>
+                                        <div className={classes.boutonAction}>
+                                            <div>
+                                                <IconButton
+                                                    key="video"
+                                                    color="inherit"
+                                                    className={classes.close}
+                                                >
+                                                    <MovieIcon />
+                                                </IconButton>
+                                            </div>
+                                            Ajouter ma vidéo de présentation
+                                        </div>
+                                    </Paper>
+                                </Link>
+                            </GridBouton>
+                            <GridBouton key={2} item  xs={12} sm={4}>
+                                    <Link href={"/profileStep#cv"} >
+                                    <Paper className={classes.paper}  elevation={0}>
+                                        
+                                        <div className={classes.boutonAction}>
+                                            <div>
+                                                <IconButton
+                                                    key="cv"
+                                                    color="inherit"
+                                                    className={classes.close}
+                                                >
+                                                    <DescriptionIcon />
+                                                </IconButton>
+                                            </div>
+                                            Ajouter mon CV
+                                        </div>
+                                    </Paper>
+                                </Link>
+                            </GridBouton>
+                        </GridBouton>
+                    </GridBouton>
+                    <GridBouton item xs={12} sm={1} lg={1} >
+                    </GridBouton >
+                </GridBouton>
+                
+                
                <Typography component="h1" align="center" className={classes.title} gutterBottom>
                    Mes candidatures
                </Typography>

                <div className={classes.container}>
+                

+
+
+
+                    
                    <Grid CustomRowComponent={AnswerRow}
                        dataFetcher={this.props.fetchJobsAnsweredRequest}
                        data={this.props.answers}
@@ -72,8 +72,9 @@ class Player extends Component {
        const { classes, id, url, typeEntite, videoId, nameCompany, nameOffre } = this.props
        const urlEnv = process.env.NODE_ENV;
        //pour la MEP
+        {/* A ENLEVER EN PROD */}
        let nofollow = false;
-        urlEnv == "development" ? nofollow = false : nofollow = false;
+        urlEnv == "development" ? nofollow = true : nofollow = true;
        
        console.log(id);
        console.log(typeEntite);
Author	SHA1	Message	Date
llaniau	f205b571bc	pb parametrage livraison	2021-05-12 17:20:11 +02:00
llaniau	57ba629402	Bug244, 245, 247, 249	2021-05-10 10:04:08 +02:00
llaniau	6a5657f4ad	ancres	2021-05-03 23:03:49 +02:00
llaniau	dc0c27d07b	faute d'orthographe sur a traiter	2021-05-03 22:06:08 +02:00
llaniau	8deda05a55	US 549/550	2021-05-03 16:45:07 +02:00
llaniau	3702f07f44	US550 : page profil	2021-05-03 13:25:59 +02:00
llaniau	9844a43312	Init V2.10.1	2021-04-26 11:29:46 +02:00