48 lines
1.9 KiB
JavaScript
48 lines
1.9 KiB
JavaScript
import React from 'react';
|
|
import AmountSelectorContainer from "../components/amount-selector.jsx";
|
|
|
|
function AddonsContainer({ onStepClick, labels, event_data }) {
|
|
const handle_next_step = () => {
|
|
onStepClick(7);
|
|
}
|
|
|
|
|
|
return (
|
|
<p>
|
|
{event_data.registration_mode === 'solidarity' && (
|
|
<AmountSelectorContainer event_data={event_data} labels={labels} />
|
|
)}
|
|
|
|
{event_data.addons.length > 0 && (
|
|
<p>
|
|
<h3>{labels.addons.addons.available_addons}</h3>
|
|
<table>
|
|
{event_data.addons.map((addon, index) => (
|
|
<tr>
|
|
<td class="addon_checkbox">
|
|
<input type="checkbox"
|
|
name={"addons["+addon.id+"]"}
|
|
id={"addons_"+addon.id} />
|
|
</td>
|
|
<td class="addon_description">
|
|
<label for={"addons_"+addon.id}>
|
|
<span class="bold">{addon.name}</span><br />
|
|
<span class="small">{labels.common.amount}: {addon.amount}</span><br /><br />
|
|
{addon.description}<br /><br />
|
|
</label>
|
|
</td>
|
|
</tr>
|
|
))
|
|
}
|
|
</table>
|
|
</p>
|
|
)}
|
|
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(5)} />
|
|
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
|
|
</p>
|
|
);
|
|
}
|
|
|
|
|
|
|
|
export default AddonsContainer; |