Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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