index.js
3.84 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
import React, { Component } from 'react';
import StickyHeader from '../Solution/components/StickyHeader'
import RightBox from './components/RightBox'
import {NavLink} from 'react-router-dom';
import * as SelectActionCreators from '../actions/profilationSelect'
import {connect} from 'react-redux';
import Sticky from 'react-sticky-el';
class Activation extends Component{
render() {
return(<div className='Activation-App attivazione-landing'>
<Sticky className='stickyMobile' mode='top' boundaryElement='.attivazione-landing' topOffset={80}>
<StickyHeader />
</Sticky>
<div className="attivazione-left-col">
<div className="attivazione-heading">
<h1>Attiva l'offerta in pochi minuti</h1>
<p>Sappiamo che sei indaffarato: tieni a portata di mano i seguenti documenti, ti basta scattare delle foto e al resto ci pensiamo noi.</p>
</div>
<div className="attivazione-body">
<ul className="attivazione-doc-listing">
<li>
<figure>
<img src="https://d33wubrfki0l68.cloudfront.net/b6b7f2510961f8dcb211eb35c5e0a25d24c8657e/3d9fc/img/id.svg" alt="carta identita" />
</figure>
<div className="doc-listing-caption">
<h2>Carta d'identità</h2>
<p>dell'intestatario del contratto di fornitura</p>
</div>
</li>
<li>
<figure>
<img src="https://d33wubrfki0l68.cloudfront.net/52a4ab6963e3b35dd0ba0e6b32dc8ffdda08da71/1900f/img/codice_fiscale_icon.svg" alt="codice fiscale" />
</figure>
<div className="doc-listing-caption">
<h2>Codice Fiscale</h2>
<p>dell’ intestatario del contratto di fornitura</p>
</div>
</li>
<li>
<figure>
<img src="https://d33wubrfki0l68.cloudfront.net/8b53289cf73260c7bc1d40c5cfde45c16797b49b/12341/img/bolletta_icon.svg" alt="bolletta" />
</figure>
<div className="doc-listing-caption">
<h2>Una bolletta recente</h2>
<p>dell'attuale fornitura di elettricità e gas</p>
</div>
</li>
<li>
<figure>
<img src="https://d33wubrfki0l68.cloudfront.net/bffc3b1786adc8d19c36fcefe8a0c1c8fc91354e/4bd7e/img/iban_icon.svg" alt="iban" />
</figure>
<div className="doc-listing-caption">
<h2>Codice Iban</h2>
<p>del conto corrente sul quale addebitare i pagamenti</p>
</div>
</li>
</ul>
<NavLink to={`/activation-steps`} activeClassName="active">
<button className="btn btn__red">Ok, inizia subito</button>
</NavLink>
</div>
</div>
<RightBox openModal={true}/>
</div>)
}
}
const mapStateToProps = state => {
return {
steps: state.ProfilationSelectReducer.steps,
activeStep: state.ProfilationSelectReducer.activeStep || 0,
activationSteps: state.ProfilationSelectReducer.activationSteps
}
};
const mapDispatchToProps = dispatch => ({
updatePropValue: (steps, activeStep) => dispatch(SelectActionCreators.changeValue(steps, activeStep))
});
/*Profilation.propTypes = {
steps: PropTypes.array.isRequired,
activeStep: PropTypes.number.isRequired,
updatePropValue: PropTypes.func.isRequired
}*/
export default connect(mapStateToProps, mapDispatchToProps)(Activation);