Bugfixes
This commit is contained in:
@@ -1,14 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
function AlreadyExistsContainer({ labels, participant_data }) {
|
|
||||||
return (
|
|
||||||
<p>
|
|
||||||
<h3>{participant_data.nicename}</h3>
|
|
||||||
{participant_data.text_1}<br />
|
|
||||||
{participant_data.text_2}<br />
|
|
||||||
<a href={participant_data.email_link}>{participant_data.email_text}</a> ( {participant_data.email_text} )
|
|
||||||
</p>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AlreadyExistsContainer;
|
|
||||||
@@ -1,87 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import {__} from '../../../../assets/javascripts/library.js';
|
|
||||||
|
|
||||||
function EfzStatusMessage({ efzStatus }) {
|
|
||||||
if (efzStatus === 'NOT_CHECKED') {
|
|
||||||
return <p style={{fontWeight: 'bold'}}>
|
|
||||||
Dein erweitertes Führungszeugnis konnte nicht automatisch überprüft werden. Bitte kontaktiere die Aktionsleitung, da deine Teilnahme nur mit gültigem eFZ möglich ist.
|
|
||||||
</p>;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (efzStatus === 'CHECKED_INVALID') {
|
|
||||||
return <p style={{fontWeight: 'bold'}}>
|
|
||||||
Du hast noch kein erweitertes Führungszeugnis bereitgestellt, sodass deine Teilnahme nicht möglich ist. Bitte reiche dein erweitertes Führungszeugnis umgehend ein,
|
|
||||||
da deine Teilnahme andernfalls storniert werden kann. Bitte setze dich mit der Aktionsleitung in Verbindung.
|
|
||||||
</p>;
|
|
||||||
}
|
|
||||||
|
|
||||||
return null; // default: nix anzeigen
|
|
||||||
}
|
|
||||||
|
|
||||||
function SuccessContainer({ participant_data }) {
|
|
||||||
return (
|
|
||||||
<p>
|
|
||||||
<h3>{__('Hello', 'solea')} {participant_data.nicename}</h3>
|
|
||||||
<p>
|
|
||||||
{participant_data.introduction}<br />
|
|
||||||
{__('We have received the following information:', 'solea')}
|
|
||||||
</p>
|
|
||||||
<table className="solea-payment-table">
|
|
||||||
<tr><td>{__('Arrival', 'solea')}:</td><td>{participant_data.arrival}</td></tr>
|
|
||||||
<tr><td>{__('Departure', 'solea')}:</td><td>{participant_data.departure}</td></tr>
|
|
||||||
<tr><td>{__('Participation group', 'solea')}:</td><td>{participant_data.participation_group}</td></tr>
|
|
||||||
</table>
|
|
||||||
{participant_data.needs_payment ? (
|
|
||||||
<p>
|
|
||||||
<table className="solea-payment-table">
|
|
||||||
<tr>
|
|
||||||
<td>{__('Account owner', 'solea')}:</td>
|
|
||||||
<td>{participant_data.account_owner}</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{__('IBAN', 'solea')}:</td>
|
|
||||||
<td>{participant_data.account_iban}</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{__('Purpose', 'solea')}:</td>
|
|
||||||
<td>{participant_data.payment_purpose}</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{ __('Total amount', 'solea')}: </td>
|
|
||||||
<td>{participant_data.amount}</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
{__('If your bank supports QR-Code based paying, use this code', 'solea')}<br />
|
|
||||||
<img className="girocode" src={participant_data.girocode_url} />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
<p>
|
|
||||||
{__( 'If payment is not possible or only partially possible within this period, please contact the event management.', 'solea' )}
|
|
||||||
</p>
|
|
||||||
</p>
|
|
||||||
) : (
|
|
||||||
<p>
|
|
||||||
{__('You do not have to pay the registration fee. This is the case if participation is supported, billing is done through your local group, or there are other decisions.', 'solea')}<br/>
|
|
||||||
{__('Your registration is confirmed now.', 'solea' ) }
|
|
||||||
</p>
|
|
||||||
|
|
||||||
|
|
||||||
)}
|
|
||||||
|
|
||||||
<EfzStatusMessage efzStatus={participant_data.efz_status} />
|
|
||||||
|
|
||||||
<p>
|
|
||||||
{__('You will receive an email with further information within 2 hours. If you do not receive this mail or have any questions about your registration, please contact the event management.', 'solea')}<br />
|
|
||||||
{__('You can contact us at', 'solea')}: {participant_data.event_email}
|
|
||||||
</p>
|
|
||||||
</p>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default SuccessContainer;
|
|
||||||
@@ -1,45 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { ArrivalDepratureValidator } from '../../../../assets/javascripts/registration-validator.js'
|
|
||||||
|
|
||||||
|
|
||||||
function AmountSelectorContainer({ labels, event_data }) {
|
|
||||||
return (
|
|
||||||
<table>
|
|
||||||
{event_data.amount_reduced !== '' && (
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<input type="radio"
|
|
||||||
name="beitrag" value="reduced" id="amount_reduced" />
|
|
||||||
<label htmlFor="amount_reduced">
|
|
||||||
{labels.addons.amount.reduced_amount} (
|
|
||||||
{event_data.amount_reduced})
|
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
)}
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<input defaultChecked={"checked"} type="radio" name="beitrag" value="regular" id="amount_regular"/>
|
|
||||||
<label htmlFor="amount_regular">
|
|
||||||
{labels.addons.amount.regular_amount} (
|
|
||||||
{event_data.amount_participant})
|
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
{event_data.amount_social !== '' && (
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<input name="beitrag" value="social" id="amount_social" type="radio"/>
|
|
||||||
<label htmlFor="amount_social">
|
|
||||||
{labels.addons.amount.social_amount} (
|
|
||||||
{event_data.amount_social})
|
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
)}
|
|
||||||
</table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AmountSelectorContainer;
|
|
||||||
@@ -1,48 +0,0 @@
|
|||||||
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;
|
|
||||||
@@ -1,36 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
function AgeContainer({ onStepClick, labels, configuration }) {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<div onClick={() => onStepClick(2)} className="solea_age_selector">
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<h3>{labels.age.headline_children}</h3>
|
|
||||||
{labels.age.text_children}
|
|
||||||
</div>
|
|
||||||
<p className="solea_emblems_selection">
|
|
||||||
<img src={configuration.icon_children} class="solea_participant_icon" />
|
|
||||||
|
|
||||||
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div onClick={() => onStepClick(3)} className="solea_age_selector">
|
|
||||||
<div>
|
|
||||||
<h3>{labels.age.headline_adults}</h3>
|
|
||||||
{labels.age.text_adults}
|
|
||||||
</div>
|
|
||||||
<p className="solea_emblems_selection">
|
|
||||||
<img src={configuration.icon_adults} className="solea_participant_icon"/>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
export default AgeContainer;
|
|
||||||
@@ -1,60 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
|
|
||||||
|
|
||||||
|
|
||||||
function AllergiesContainer({ onStepClick, labels, event_data, participant_data }) {
|
|
||||||
const handle_next_step = () => {
|
|
||||||
onStepClick(9);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<h3>{labels.headlines.allergies}</h3>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>{labels.allergies.allergies}:</td>
|
|
||||||
<td><input defaultValue={participant_data.allergies} type="text" name="allergien" /></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>{labels.allergies.intolerances}:</td>
|
|
||||||
<td><input defaultValue={participant_data.intolerances} type="text" name="intolerances" /></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>{labels.allergies.medications}:</td>
|
|
||||||
<td>
|
|
||||||
<input defaultValue={participant_data.medications} type="text" name="medikamente" />*<br />
|
|
||||||
{labels.allergies.medications_hint}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.allergies.eating_habits.headline}:</td>
|
|
||||||
<td>
|
|
||||||
<select name="essgewohnheit">
|
|
||||||
<option value="vegetarian">{labels.allergies.eating_habits.vegetarian}</option>
|
|
||||||
<option value="vegan">{labels.allergies.eating_habits.vegan}</option>
|
|
||||||
{event_data.enable_all_eating && (
|
|
||||||
<option value="all">{labels.allergies.eating_habits.meat}</option>
|
|
||||||
)}
|
|
||||||
</select>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.allergies.notices}:</td>
|
|
||||||
<td><textarea rows="15" name="anmerkungen"></textarea></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(7)} />
|
|
||||||
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AllergiesContainer;
|
|
||||||
@@ -1,65 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { ArrivalDepratureValidator } from '../../../../assets/javascripts/registration-validator.js'
|
|
||||||
|
|
||||||
|
|
||||||
function ArrivalContainer({ onStepClick, labels, event_data }) {
|
|
||||||
const handle_next_step = () => {
|
|
||||||
if (ArrivalDepratureValidator(
|
|
||||||
|
|
||||||
new Date(event_data.date_begin),
|
|
||||||
new Date (event_data.date_end)
|
|
||||||
) ) {
|
|
||||||
if (event_data.addons.length > 0 || event_data.registration_mode === 'solidarity') {
|
|
||||||
onStepClick(6);
|
|
||||||
} else {
|
|
||||||
onStepClick(7);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<h3>{labels.headlines.arrival}</h3>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.arrival_data.arrival.headline}:</td>
|
|
||||||
<td>
|
|
||||||
<input type="date" name="anreise" id="anreise" defaultValue={event_data.date_begin} /><br />
|
|
||||||
<select name="anreise_essen">
|
|
||||||
<option Value="1" selected>{labels.arrival_data.arrival.before_dinner}</option>
|
|
||||||
<option value="2">{labels.arrival_data.arrival.before_lunch}</option>
|
|
||||||
<option value="3">{labels.arrival_data.arrival.before_breakfast}</option>
|
|
||||||
<option value="4">{labels.arrival_data.arrival.no_meal}</option>
|
|
||||||
</select>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.arrival_data.departure.headline}:</td>
|
|
||||||
<td>
|
|
||||||
<input type="date" name="abreise" id="abreise" defaultValue={event_data.date_end} /><br />
|
|
||||||
<select name="abreise_essen">
|
|
||||||
<option value="1">{labels.arrival_data.departure.after_breakfast}</option>
|
|
||||||
<option selected value="2">{labels.arrival_data.departure.after_lunch}</option>
|
|
||||||
<option value="3">{labels.arrival_data.departure.after_dinner}</option>
|
|
||||||
<option value="4">{labels.arrival_data.departure.no_meal}</option>
|
|
||||||
</select>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(4)} />
|
|
||||||
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default ArrivalContainer;
|
|
||||||
@@ -1,68 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { ContactPersonValidator } from '../../../../assets/javascripts/registration-validator.js'
|
|
||||||
|
|
||||||
|
|
||||||
function ContactPersonContainer({ onStepClick, labels, participant_data }) {
|
|
||||||
const handle_next_step = () => {
|
|
||||||
|
|
||||||
if (ContactPersonValidator() ) {
|
|
||||||
onStepClick(3);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<h3>{labels.headlines.contactperson}</h3>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.lastname}, {labels.common.firstname}:</td>
|
|
||||||
<td><input type="text" name="ansprechpartner" id="ansprechpartner" /></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.telephone}:</td>
|
|
||||||
<td><input type="text" name="telefon_2" id="telefon_2" /></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.email}:</td>
|
|
||||||
<td><input type="text" name="email_2" id="email_2"/></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.swimming_permission.label}:</td>
|
|
||||||
<td>
|
|
||||||
<select name="badeerlaubnis" id={"swimming_permission"}>
|
|
||||||
<option value="-1">{labels.common.please_select}</option>
|
|
||||||
<option value="none">{labels.swimming_permission.none}</option>
|
|
||||||
<option value="partial">{labels.swimming_permission.partial}</option>
|
|
||||||
<option value="complete">{labels.swimming_permission.complete}</option>
|
|
||||||
</select>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.swimming_permission.first_aid_headline}:
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<select id="first_aid" name="first_aid" required>
|
|
||||||
<option value="-1">{labels.common.please_select}</option>
|
|
||||||
<option value="1">{labels.swimming_permission.first_aid_yes}</option>
|
|
||||||
<option value="0">{labels.swimming_permission.first_aid_no}</option>
|
|
||||||
</select><br />
|
|
||||||
<label className="description">{labels.swimming_permission.first_aid_description}</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default ContactPersonContainer;
|
|
||||||
@@ -1,91 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
|
|
||||||
|
|
||||||
|
|
||||||
function PersonalDataContainer({ onStepClick, labels, participant_data, local_groups }) {
|
|
||||||
const handle_next_step = () => {
|
|
||||||
if (ContactDataValidator()) {
|
|
||||||
onStepClick(4);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<h3>{labels.headlines.personaldata}</h3>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.firstname};</td>
|
|
||||||
<td><input defaultValue={participant_data.firstname} type="text" name="vorname" id="vorname" /></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.lastname}:</td>
|
|
||||||
<td><input defaultValue={participant_data.lastname} type="text" name="nachname" id="nachname" /></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.nickname}</td>
|
|
||||||
<td><input defaultValue={participant_data.nickname} type="text" name="pfadiname" id="pfadiname" /></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.localgroup}</td>
|
|
||||||
<td>
|
|
||||||
<select id="localgroup" name="localgroup" required placeholder="<?php echo esc_html__( 'Please select', 'solea' ); ?>">
|
|
||||||
<option value="-1">{labels.common.please_select}</option>
|
|
||||||
{local_groups.map((local_group, index) => (
|
|
||||||
<option
|
|
||||||
value={local_group.id}
|
|
||||||
selected={participant_data.localgroup == local_group.id}
|
|
||||||
>{local_group.name}
|
|
||||||
</option>
|
|
||||||
))
|
|
||||||
}
|
|
||||||
</select>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.birthday}:</td>
|
|
||||||
<td><input defaultValue={participant_data.birthday} type="date" name="geburtsdatum" id="geburtsdatum" /></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.street}, {labels.common.housenumber}:</td>
|
|
||||||
<td>
|
|
||||||
<input type="text" defaultValue={participant_data.street} name="strasse" id="strasse" />
|
|
||||||
<input type="text" defaultValue={participant_data.number} name="hausnummer" id="hausnummer" />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
{labels.common.postal_code}, {labels.common.city}:</td>
|
|
||||||
<td>
|
|
||||||
<input type="text" defaultValue={participant_data.zip} name="plz" id="plz" />
|
|
||||||
<input type="text" defaultValue={participant_data.city} name="ort" id="ort" />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.telephone}:</td>
|
|
||||||
<td><input defaultValue={participant_data.phone} type="text" name="telefon_1" id="telefon_1" /></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.common.email}:</td>
|
|
||||||
<td><input defaultValue={participant_data.email} type="text" name="email_1" id="email_1" /></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default PersonalDataContainer;
|
|
||||||
@@ -1,77 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
function PhotopermissionsContainer({ onStepClick, labels, event_data }) {
|
|
||||||
const accept_all_permissions = () => {
|
|
||||||
document.getElementById( 'foto_socialmedia' ).checked = true;
|
|
||||||
document.getElementById( 'foto_print' ).checked = true;
|
|
||||||
document.getElementById( 'foto_webseite' ).checked = true;
|
|
||||||
document.getElementById( 'foto_partner' ).checked = true;
|
|
||||||
document.getElementById( 'foto_intern' ).checked = true;
|
|
||||||
handle_next_step();
|
|
||||||
}
|
|
||||||
|
|
||||||
const handle_next_step = () => {
|
|
||||||
onStepClick(8);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
const handle_previous_step = () => {
|
|
||||||
if (event_data.addons.length > 0 || event_data.registration_mode === 'solidarity') {
|
|
||||||
onStepClick(6);
|
|
||||||
} else {
|
|
||||||
onStepClick(5);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<p class="phptopermission_container">
|
|
||||||
<h3>{labels.photopermissions.headline}</h3>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<input type="checkbox" name="foto[socialmedia]" value="active" id="foto_socialmedia"/>
|
|
||||||
<label
|
|
||||||
htmlFor="foto_socialmedia">{labels.photopermissions.socialmedia}
|
|
||||||
</label><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<input type="checkbox" name="foto[print]" value="active" id="foto_print"/>
|
|
||||||
<label
|
|
||||||
htmlFor="foto_print">{labels.photopermissions.printmedia}
|
|
||||||
</label><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<input type="checkbox" name="foto[webseite]" value="active" id="foto_webseite"/>
|
|
||||||
<label
|
|
||||||
htmlFor="foto_webseite">{labels.photopermissions.websites}
|
|
||||||
</label><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<input type="checkbox" name="foto[partner]" value="active" id="foto_partner"/>
|
|
||||||
<label
|
|
||||||
htmlFor="foto_partner">{labels.photopermissions.partners}
|
|
||||||
</label><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<input type="checkbox" name="foto[intern]" value="active" id="foto_intern"/>
|
|
||||||
<label
|
|
||||||
htmlFor="foto_intern">{labels.photopermissions.internalpurpose}
|
|
||||||
</label><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<input class="acceptallbutton" type="button"
|
|
||||||
value={labels.photopermissions.acceptall}
|
|
||||||
onClick={() => accept_all_permissions()}
|
|
||||||
/>
|
|
||||||
<input type="button" value={labels.common.go_back} onClick={() => handle_previous_step()} />
|
|
||||||
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default PhotopermissionsContainer;
|
|
||||||
@@ -1,51 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
|
|
||||||
|
|
||||||
|
|
||||||
function GroupBasedRegistrationContainer({ onStepClick, labels, participant_data, local_groups, event_data }) {
|
|
||||||
const handle_next_step = () => {
|
|
||||||
onStepClick(5);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
|
|
||||||
|
|
||||||
<table>
|
|
||||||
<input defaultChecked={"checked"} type="radio" name="beitrag" value="regular" id="amount_regular" hidden />
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2"><h3>{labels.registration_mode.group_based.headline}:</h3></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
|
|
||||||
{event_data.possible_participation_groups.map((participation_group, index) => (
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2" >
|
|
||||||
<input type="radio"
|
|
||||||
defaultChecked={'participant' === participation_group.name}
|
|
||||||
name="participant_group"
|
|
||||||
value={participation_group.name}
|
|
||||||
id={participation_group.name} />
|
|
||||||
|
|
||||||
<label for={participation_group.name}>
|
|
||||||
{participation_group.name_readable}
|
|
||||||
{participation_group.description !== '' && (
|
|
||||||
<span><br /><span class="solea-group-info-text">{participation_group.description}</span><br /><br /></span>
|
|
||||||
)}
|
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
))
|
|
||||||
}
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(3)} />
|
|
||||||
<input type="button" value={labels.common.next} onClick= {() => handle_next_step()} />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default GroupBasedRegistrationContainer;
|
|
||||||
@@ -1,47 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
|
|
||||||
|
|
||||||
|
|
||||||
function SolidarityRegistrationContainer({ onStepClick, labels, participant_data, local_groups, event_data }) {
|
|
||||||
const handle_next_step = () => {
|
|
||||||
onStepClick(5);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<h3>{labels.headlines.solidarity_headline}</h3>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>{labels.registration_mode.solidarity.headline}...</td>
|
|
||||||
<td>
|
|
||||||
{event_data.possible_participation_groups.map((participation_group, index) => (
|
|
||||||
<span>
|
|
||||||
<input
|
|
||||||
class="registratration_mode_solidatory_checkbox"
|
|
||||||
type="radio"
|
|
||||||
name="participant_group"
|
|
||||||
value="team"
|
|
||||||
defaultChecked={'participant' === participation_group.name}
|
|
||||||
id={participation_group.name}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<label for={participation_group.name}>...{participation_group.description}</label><br/>
|
|
||||||
</span>
|
|
||||||
))
|
|
||||||
}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="button" value={labels.common.go_back} onClick={() => onStepClick(3)} />
|
|
||||||
<input type="button" value={labels.common.next} onClick={() => handle_next_step()}/>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default SolidarityRegistrationContainer;
|
|
||||||
@@ -1,75 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { ContactDataValidator } from '../../../../assets/javascripts/registration-validator.js'
|
|
||||||
|
|
||||||
|
|
||||||
function SummaryContainer({ onStepClick, labels, participant_data, local_groups }) {
|
|
||||||
const handle_next_step = () => {
|
|
||||||
onStepClick(4);
|
|
||||||
|
|
||||||
if (ContactDataValidator()) {
|
|
||||||
onStepClick(4);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<h3>{labels.headlines.summary}</h3>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>{labels.summary.event_name}:</td>
|
|
||||||
<td><span id="summary_eventname" /></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.summary.arrival}</td>
|
|
||||||
<td><span id="summary_arrival" /></td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{labels.summary.departure}:</td>
|
|
||||||
<td><span id="summary_departure" /></td>
|
|
||||||
</tr>
|
|
||||||
<tr><td colSpan="2"><br /><br /></td></tr>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="checkbox" id="summary_information_correct"/>
|
|
||||||
<label htmlFor="summary_information_correct" id="summary_information_correct_label">
|
|
||||||
{labels.summary.information_correct}
|
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="checkbox" id="summary_accept_terms"/>
|
|
||||||
<label htmlFor="summary_accept_terms" id="summary_accept_terms_label">
|
|
||||||
{labels.summary.accept_terms}
|
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="checkbox" id="legal_accepted"/>
|
|
||||||
<label htmlFor="legal_accepted" id="legal_accepted_label">
|
|
||||||
{labels.summary.legal_acceptance}
|
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
<input type="checkbox" id="payment"/>
|
|
||||||
<label htmlFor="payment" id="payment_label">
|
|
||||||
{labels.summary.amount_text_1} <span class="bold" id="payment_information_label"></span> {labels.summary.amount_text_2}
|
|
||||||
</label>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default SummaryContainer;
|
|
||||||
@@ -1,267 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import AgeContainer from './partials/age.jsx';
|
|
||||||
import ContactPersonContainer from './partials/contactperson.jsx';
|
|
||||||
import PersonalDataContainer from './partials/personaldata.jsx';
|
|
||||||
import SolidarityRegistrationContainer from './partials/registration-solidarity.jsx';
|
|
||||||
import GroupSelectionContainer from './partials/registration-groupbased.jsx';
|
|
||||||
import ArrivalContainer from './partials/arrival.jsx';
|
|
||||||
import AddonsContainer from "./partials/addons.jsx";
|
|
||||||
import PhotopermissionsContainer from "./partials/photopermissions.jsx";
|
|
||||||
import AllergiesContainer from "./partials/allergies.jsx";
|
|
||||||
import SummaryContainer from "./partials/summary.jsx";
|
|
||||||
import { FinalValidator } from '../../../assets/javascripts/registration-validator.js'
|
|
||||||
import { SelectedAddons } from '../../../assets/javascripts/registration-validator.js'
|
|
||||||
import SuccessContainer from "./after-submit/success.jsx";
|
|
||||||
import ReactDOM from "react-dom/client";
|
|
||||||
import AlreadyExistsContainer from "./after-submit/alreadyexist.jsx";
|
|
||||||
import { __ } from '../../../assets/javascripts/library.js';
|
|
||||||
|
|
||||||
const { configuration, labels, participant_data, event_data, local_groups } = window.solea_data;
|
|
||||||
|
|
||||||
function showStep(step) {
|
|
||||||
var steps = [
|
|
||||||
'step_1', // Age-Selector
|
|
||||||
'step_2', // Children only: Contact data
|
|
||||||
'step_3', // Personal data
|
|
||||||
'step_4', // Participation group
|
|
||||||
'step_5', // Arival & Departure
|
|
||||||
'step_6', // Addon information
|
|
||||||
'step_7', // Photo-Permissions
|
|
||||||
'step_8', // Allergies & Intolerances
|
|
||||||
'step_9' // Summary
|
|
||||||
];
|
|
||||||
|
|
||||||
for (var idx = 0; idx < steps.length; idx++) {
|
|
||||||
var currentElement = steps[idx];
|
|
||||||
document.getElementById(currentElement).classList.add('container_hidden');
|
|
||||||
document.getElementById(currentElement).classList.remove('container_visible');
|
|
||||||
}
|
|
||||||
|
|
||||||
document.getElementById('step_' + step).classList.remove('container_hidden');
|
|
||||||
document.getElementById('step_' + step).classList.add('container_visible');
|
|
||||||
|
|
||||||
document.getElementById('summary_loading').classList.remove('container_hidden');
|
|
||||||
document.getElementById('summary_loading').classList.add('container_visible');
|
|
||||||
document.getElementById('summary_content').classList.add('container_hidden');
|
|
||||||
document.getElementById('summary_content').classList.remove('container_visible');
|
|
||||||
|
|
||||||
if (step === 9) {
|
|
||||||
var [ayear, amonth, aday] = document.getElementById('anreise').value.split('-');
|
|
||||||
var [dyear, dmonth, dday] = document.getElementById('abreise').value.split('-');
|
|
||||||
|
|
||||||
document.getElementById('summary_eventname').innerHTML= event_data.event_name;
|
|
||||||
document.getElementById('summary_arrival').innerHTML=`${aday}.${amonth}.${ayear}`;
|
|
||||||
document.getElementById('summary_departure').innerHTML=`${dday}.${dmonth}.${dyear}`;
|
|
||||||
|
|
||||||
const response = fetch("/wp-json/solea/signup/preview_amount", {
|
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
anreise: document.getElementById('anreise').value,
|
|
||||||
abreise: document.getElementById('abreise').value,
|
|
||||||
event_id: event_data.id,
|
|
||||||
participation_group: document.querySelector('input[name="participant_group"]:checked').value,
|
|
||||||
selected_amount: document.querySelector('input[name="beitrag"]:checked').value,
|
|
||||||
addons: SelectedAddons(),
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
.then((res) => res.json())
|
|
||||||
.then((data) => {
|
|
||||||
document.getElementById('payment_information_label').innerHTML = data.amount
|
|
||||||
document.getElementById('summary_loading').classList.add('container_hidden');
|
|
||||||
document.getElementById('summary_loading').classList.remove('container_visible');
|
|
||||||
|
|
||||||
document.getElementById('summary_content').classList.add('container_visible');
|
|
||||||
document.getElementById('summary_content').classList.remove('container_hidden');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function ParticipantSignup() {
|
|
||||||
let RegistrationMode;
|
|
||||||
|
|
||||||
switch (event_data.registration_mode) {
|
|
||||||
case 'solidarity':
|
|
||||||
RegistrationMode = SolidarityRegistrationContainer;
|
|
||||||
break;
|
|
||||||
|
|
||||||
case 'groupbased':
|
|
||||||
RegistrationMode = GroupSelectionContainer;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleSubmit = (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const form = e.target;
|
|
||||||
const data = new FormData(form);
|
|
||||||
|
|
||||||
if (!FinalValidator()) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const formData = Object.fromEntries(data.entries());
|
|
||||||
const response = fetch("/wp-json/solea/signup/do-register", {
|
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
addons: SelectedAddons(),
|
|
||||||
registration_data: formData
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.then((res) => res.json())
|
|
||||||
.then((data) => {
|
|
||||||
const container = document.getElementById('solea_registration_form_frame');
|
|
||||||
const root = ReactDOM.createRoot(container);
|
|
||||||
|
|
||||||
if (data.already_exists === true) {
|
|
||||||
root.render(<AlreadyExistsContainer participant_data={data.result} labels={labels} />);
|
|
||||||
} else {
|
|
||||||
root.render(<SuccessContainer participant_data={data.result} />);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="solea-event-registration-container">
|
|
||||||
<table class="solea-event-meta-data-table">
|
|
||||||
<tr>
|
|
||||||
<td>{__('Event location', 'solea')}:</td>
|
|
||||||
<td>{event_data.postalcode} {event_data.location}</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{__('Event duration', 'solea')}:</td>
|
|
||||||
<td>{event_data.date_begin_formatted} - {event_data.date_end_formatted}</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>{__('Regular registration until', 'solea')}:</td>
|
|
||||||
<td>{event_data.last_minute_begin_formatted}</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
{__('Extended registration until', 'solea')}:
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
{event_data.registration_end_formatted}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
{__('Cancellation', 'solea')}:
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
100% {__('until', 'solea')} {event_data.last_minute_begin_formatted} {__('available', 'solea')}<br />
|
|
||||||
{event_data.reduced_return}% {__('until', 'solea')} {event_data.registration_end_formatted} {__('available', 'solea')}<br />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
<tr>
|
|
||||||
<td colSpan="2">
|
|
||||||
{ __('Do you have questions for registration? Please contact us by email:', 'solea') }
|
|
||||||
<a href={"mailto:" + event_data.event_email}>{event_data.event_email}</a>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<div id="solea_registration_form_frame">
|
|
||||||
<form id="registration_form" onSubmit={handleSubmit}>
|
|
||||||
<input type="hidden" name="solea-user-id" value={participant_data.id} />
|
|
||||||
<input type="hidden" name="event-id" value={event_data.id} />
|
|
||||||
<div id="step_1" className="container_visible">
|
|
||||||
<AgeContainer
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
configuration={configuration}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="step_2" className="container_hidden">
|
|
||||||
<ContactPersonContainer
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
participant_data={participant_data}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="step_3" className="container_hidden">
|
|
||||||
<PersonalDataContainer
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
participant_data={participant_data}
|
|
||||||
local_groups={local_groups}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="step_4" className="container_hidden">
|
|
||||||
<RegistrationMode
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
participant_data={participant_data}
|
|
||||||
local_groups={local_groups}
|
|
||||||
event_data={event_data}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="step_5" className="container_hidden">
|
|
||||||
<ArrivalContainer
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
event_data={event_data}
|
|
||||||
local_groups={local_groups}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="step_6" className="container_hidden">
|
|
||||||
<AddonsContainer
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
event_data={event_data}
|
|
||||||
local_groups={local_groups}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="step_7" className="container_hidden">
|
|
||||||
<PhotopermissionsContainer
|
|
||||||
event_data={event_data}
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="step_8" className="container_hidden">
|
|
||||||
<AllergiesContainer
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
participant_data={participant_data}
|
|
||||||
event_data={event_data}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="step_9" className="container_hidden">
|
|
||||||
<p id="summary_loading">Wird geladen</p>
|
|
||||||
<p id="summary_content" className="container_hidden">
|
|
||||||
<SummaryContainer
|
|
||||||
onStepClick={showStep}
|
|
||||||
labels={labels}
|
|
||||||
participant_data={participant_data}
|
|
||||||
event_data={event_data}
|
|
||||||
/>
|
|
||||||
<input type="button" value={labels.common.go_back} onClick={() => showStep(8)} />
|
|
||||||
<input className="acceptallbutton" type="submit" value={labels.common.confirm}/>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default ParticipantSignup;
|
|
||||||
Reference in New Issue
Block a user