Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 1968 | Rev 1970 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1966 steven 1 
import React from 'react'
2 
import { useState } from 'react'
1968 steven 3 
import Spinner from '../../../shared/loading-spinner/Spinner';
1969 steven 4 
import styled from 'styled-components';
1966 steven 5 
 
1968 steven 6 
const StyledSpinnerContainer = styled.div`
7 
  position: absolute;
8 
  left: 0;
9 
  top: 0;
10 
  width: 100%;
11 
  height: 100%;
12 
  background: rgba(255, 255, 255, 0.4);
13 
  display: flex;
14 
  justify-content: center;
15 
  align-items: center;
16 
  z-index: 300;
17 
`;
1966 steven 18 
function CloseAccount() {
19 
    const [showInputCode, setShowInputCode] = useState(false);
1968 steven 20 
    const [loading, setLoading] = useState(false);
1966 steven 21 
    const handleGetCode  = () => {
22 
        try {
23 
            setShowInputCode(true)
24 
            console.log('>>: get code')
25 
        } catch (error) {
26 
            console.log('>>: error > ', error)
27 
        }
28 
    }
1968 steven 29 
    const handleSubmit = (e) => {
30 
        try {
31 
            setLoading(true)
32 
            e.preventDefault();
33 
 
34 
        } catch (error) {
35 
            console.log('>>: error > ', error)
36 
        }finally{
37 
            setLoading(false)
38 
        }
39 
    }
1966 steven 40 
    return (
1967 steven 41 
        <div className="acc-setting h-100" style={{ position: "relative" }}>
1966 steven 42 
            <div className="container">
43 
                <h1>¿Esta seguro de eliminar su cuenta?</h1>
44 
                <div className="row">
45 
                    <div className='col-md col-sm-12'>
46 
                        <button className="btn btn-primary" onClick={handleGetCode}>Si, estoy seguro</button>
47 
                    </div>
48 
                    <div className='col-md col-sm-12'>
49 
                        <button className="btn btn-primary">No</button>
50 
                    </div>
51 
                </div>
52 
            </div>
53 
            {
54 
                showInputCode && (
1968 steven 55 
                    <form onSubmit={handleSubmit}>
56 
                        <div class="form-group">
57 
                            <label for="exampleInputEmail1">Ingrese el codigo</label>
58 
                            <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Ingrese el codigo" />
59 
                            <small id="emailHelp" class="form-text text-muted">Este codigo fue enviado a tu correo electrónico.</small>
60 
                        </div>
61 
                        <button type="submit" class="btn btn-primary">Submit</button>
62 
                    </form>
1966 steven 63 
                )
64 
            }
1968 steven 65 
            {loading && (
66 
                <StyledSpinnerContainer>
67 
                    <Spinner />
68 
                </StyledSpinnerContainer>
69 
            )}
1966 steven 70 
        </div>
71 
    )
72 
}
73 
 
74 
export default CloseAccount