mirror of
https://github.com/LaCasemate/fab-manager.git
synced 2025-02-26 20:54:21 +01:00
(ui) Add editorial text block
This commit is contained in:
parent
98e10dc774
commit
6e38e72851
@ -0,0 +1,29 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { IApplication } from '../../models/application';
|
||||||
|
import { Loader } from '../base/loader';
|
||||||
|
import { react2angular } from 'react2angular';
|
||||||
|
import { FabButton } from './fab-button';
|
||||||
|
|
||||||
|
declare const Application: IApplication;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Display a editorial text block with an optional cta button
|
||||||
|
*/
|
||||||
|
export const EditorialBlock: React.FC = () => {
|
||||||
|
return (
|
||||||
|
<div className='editorial-block'>
|
||||||
|
<div dangerouslySetInnerHTML={{ __html: '<h3>Lorem ipsum</h3><p>sit amet consectetur adipisicing elit. Voluptates, possimus excepturi deleniti sed pariatur sint.</p>' }}></div>
|
||||||
|
<FabButton className='is-main'>CTA label</FabButton>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
const EditorialBlockWrapper: React.FC = (props) => {
|
||||||
|
return (
|
||||||
|
<Loader>
|
||||||
|
<EditorialBlock {...props} />
|
||||||
|
</Loader>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
Application.Components.component('editorialBlock', react2angular(EditorialBlockWrapper, []));
|
@ -283,7 +283,7 @@ export const EventForm: React.FC<EventFormProps> = ({ action, event, onError, on
|
|||||||
label={t('app.admin.event_form.standard_rate')}
|
label={t('app.admin.event_form.standard_rate')}
|
||||||
tooltip={t('app.admin.event_form.0_equal_free')}
|
tooltip={t('app.admin.event_form.0_equal_free')}
|
||||||
addOn={FormatLib.currencySymbol()} />
|
addOn={FormatLib.currencySymbol()} />
|
||||||
{/* TODO: need ui */}
|
|
||||||
{priceCategoriesOptions && <div className="additional-prices">
|
{priceCategoriesOptions && <div className="additional-prices">
|
||||||
{fields.map((price, index) => (
|
{fields.map((price, index) => (
|
||||||
<div key={index} className={`price-item ${output.event_price_categories_attributes && output.event_price_categories_attributes[index]?._destroy ? 'destroyed-item' : ''}`}>
|
<div key={index} className={`price-item ${output.event_price_categories_attributes && output.event_price_categories_attributes[index]?._destroy ? 'destroyed-item' : ''}`}>
|
||||||
|
@ -39,9 +39,10 @@ export const TrainingForm: React.FC<TrainingFormProps> = ({ action, training, on
|
|||||||
|
|
||||||
const [machineModule, setMachineModule] = useState<Setting>(null);
|
const [machineModule, setMachineModule] = useState<Setting>(null);
|
||||||
const [isActiveCancellation, setIsActiveCancellation] = useState<boolean>(false);
|
const [isActiveCancellation, setIsActiveCancellation] = useState<boolean>(false);
|
||||||
const [isActiveTextBlock, setIsActiveTextBlock] = useState<boolean>(false);
|
|
||||||
const [isActiveCta, setIsActiveCta] = useState<boolean>(false);
|
|
||||||
const [isActiveAccounting, setIsActiveAccounting] = useState<boolean>(false);
|
const [isActiveAccounting, setIsActiveAccounting] = useState<boolean>(false);
|
||||||
|
const [isActiveAuthorizationValidity, setIsActiveAuthorizationValidity] = useState<boolean>(false);
|
||||||
|
const [isActiveValidationRule, setIsActiveValidationRule] = useState<boolean>(false);
|
||||||
|
|
||||||
const { handleSubmit, register, control, setValue, formState } = useForm<Training>({ defaultValues: { ...training } });
|
const { handleSubmit, register, control, setValue, formState } = useForm<Training>({ defaultValues: { ...training } });
|
||||||
const output = useWatch<Training>({ control });
|
const output = useWatch<Training>({ control });
|
||||||
|
|
||||||
@ -86,35 +87,19 @@ export const TrainingForm: React.FC<TrainingFormProps> = ({ action, training, on
|
|||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Callback triggered when the text block switch has changed.
|
* Callback triggered when the authorisation validity switch has changed.
|
||||||
*/
|
*/
|
||||||
const toggleTextBlockSwitch = (value: boolean) => {
|
const toggleAuthorizationValidity = (value: boolean) => {
|
||||||
setIsActiveTextBlock(value);
|
setIsActiveAuthorizationValidity(value);
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Callback triggered when the CTA switch has changed.
|
* Callback triggered when the authorisation validity switch has changed.
|
||||||
*/
|
|
||||||
const toggleTextBlockCta = (value: boolean) => {
|
|
||||||
setIsActiveCta(value);
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Callback triggered when the CTA label has changed.
|
|
||||||
*/
|
|
||||||
const handleCtaLabelChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
|
|
||||||
console.log('cta label:', event.target.value);
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Callback triggered when the cta url has changed.
|
|
||||||
*/
|
*/
|
||||||
const handleCtaUrlChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
|
const toggleValidationRule = (value: boolean) => {
|
||||||
console.log('cta url:', event.target.value);
|
setIsActiveValidationRule(value);
|
||||||
};
|
};
|
||||||
|
|
||||||
// regular expression to validate the input fields
|
|
||||||
const urlRegex = /^(https?:\/\/)([^.]+)\.(.{2,30})(\/.*)*\/?$/;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="training-form">
|
<div className="training-form">
|
||||||
<header>
|
<header>
|
||||||
@ -221,40 +206,44 @@ export const TrainingForm: React.FC<TrainingFormProps> = ({ action, training, on
|
|||||||
|
|
||||||
<section>
|
<section>
|
||||||
<header>
|
<header>
|
||||||
<p className="title">{t('app.admin.training_form.generic_text_block')}</p>
|
<p className="title">{t('app.admin.training_form.authorization_validity')}</p>
|
||||||
<p className="description">{t('app.admin.training_form.generic_text_block_info')}</p>
|
<p className="description">{t('app.admin.training_form.authorization_validity_info')}</p>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div className="content">
|
<div className="content">
|
||||||
<FormSwitch id="active_text_block" control={control}
|
<FormSwitch id="authorization_validity" control={control}
|
||||||
onChange={toggleTextBlockSwitch} formState={formState}
|
onChange={toggleAuthorizationValidity} formState={formState}
|
||||||
defaultValue={isActiveTextBlock}
|
defaultValue={isActiveAuthorizationValidity}
|
||||||
label={t('app.admin.training_form.generic_text_block_switch')} />
|
label={t('app.admin.training_form.authorization_validity_switch')} />
|
||||||
|
{isActiveAuthorizationValidity && <>
|
||||||
|
<FormInput id="authorization_validity_duration"
|
||||||
|
type="number"
|
||||||
|
register={register}
|
||||||
|
rules={{ required: isActiveAuthorizationValidity, min: 1 }}
|
||||||
|
step={1}
|
||||||
|
formState={formState}
|
||||||
|
label={t('app.admin.training_form.authorization_validity_period')} />
|
||||||
|
</>}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<FormRichText id="text_block"
|
<section>
|
||||||
control={control}
|
<header>
|
||||||
heading
|
<p className="title">{t('app.admin.training_form.validation_rule')}</p>
|
||||||
limit={280}
|
<p className="description">{t('app.admin.training_form.validation_rule_info')}</p>
|
||||||
disabled={!isActiveTextBlock} />
|
</header>
|
||||||
|
<div className="content">
|
||||||
{isActiveTextBlock && <>
|
<FormSwitch id="validation_rule" control={control}
|
||||||
<FormSwitch id="active_cta" control={control}
|
onChange={toggleValidationRule} formState={formState}
|
||||||
onChange={toggleTextBlockCta} formState={formState}
|
defaultValue={isActiveValidationRule}
|
||||||
label={t('app.admin.training_form.cta_switch')} />
|
label={t('app.admin.training_form.validation_rule_switch')} />
|
||||||
|
{isActiveValidationRule && <>
|
||||||
{isActiveCta && <>
|
<FormInput id="validation_rule_period"
|
||||||
<FormInput id="cta_label"
|
type="number"
|
||||||
register={register}
|
register={register}
|
||||||
rules={{ required: true }}
|
rules={{ required: isActiveValidationRule, min: 1 }}
|
||||||
onChange={handleCtaLabelChange}
|
step={1}
|
||||||
maxLength={40}
|
formState={formState}
|
||||||
label={t('app.admin.training_form.cta_label')} />
|
label={t('app.admin.training_form.validation_rule_period')} />
|
||||||
<FormInput id="cta_url"
|
|
||||||
register={register}
|
|
||||||
rules={{ required: true, pattern: urlRegex }}
|
|
||||||
onChange={handleCtaUrlChange}
|
|
||||||
label={t('app.admin.training_form.cta_url')} />
|
|
||||||
</>}
|
|
||||||
</>}
|
</>}
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
@ -5,7 +5,6 @@ import { Loader } from '../base/loader';
|
|||||||
import { react2angular } from 'react2angular';
|
import { react2angular } from 'react2angular';
|
||||||
import { ErrorBoundary } from '../base/error-boundary';
|
import { ErrorBoundary } from '../base/error-boundary';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { FabAlert } from '../base/fab-alert';
|
|
||||||
import { useForm, SubmitHandler } from 'react-hook-form';
|
import { useForm, SubmitHandler } from 'react-hook-form';
|
||||||
import { FormRichText } from '../form/form-rich-text';
|
import { FormRichText } from '../form/form-rich-text';
|
||||||
import { FormSwitch } from '../form/form-switch';
|
import { FormSwitch } from '../form/form-switch';
|
||||||
@ -30,7 +29,9 @@ export const TrainingsSettings: React.FC<TrainingsSettingsProps> = () => {
|
|||||||
const urlRegex = /^(https?:\/\/)([^.]+)\.(.{2,30})(\/.*)*\/?$/;
|
const urlRegex = /^(https?:\/\/)([^.]+)\.(.{2,30})(\/.*)*\/?$/;
|
||||||
|
|
||||||
const [isActiveAutoCancellation, setIsActiveAutoCancellation] = useState<boolean>(false);
|
const [isActiveAutoCancellation, setIsActiveAutoCancellation] = useState<boolean>(false);
|
||||||
|
const [isActiveAuthorizationValidity, setIsActiveAuthorizationValidity] = useState<boolean>(false);
|
||||||
const [isActiveTextBlock, setIsActiveTextBlock] = useState<boolean>(false);
|
const [isActiveTextBlock, setIsActiveTextBlock] = useState<boolean>(false);
|
||||||
|
const [isActiveValidationRule, setIsActiveValidationRule] = useState<boolean>(false);
|
||||||
const [isActiveCta, setIsActiveCta] = useState<boolean>(false);
|
const [isActiveCta, setIsActiveCta] = useState<boolean>(false);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -39,6 +40,21 @@ export const TrainingsSettings: React.FC<TrainingsSettingsProps> = () => {
|
|||||||
const toggleAutoCancellation = (value: boolean) => {
|
const toggleAutoCancellation = (value: boolean) => {
|
||||||
setIsActiveAutoCancellation(value);
|
setIsActiveAutoCancellation(value);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Callback triggered when the authorisation validity switch has changed.
|
||||||
|
*/
|
||||||
|
const toggleAuthorizationValidity = (value: boolean) => {
|
||||||
|
setIsActiveAuthorizationValidity(value);
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Callback triggered when the authorisation validity switch has changed.
|
||||||
|
*/
|
||||||
|
const toggleValidationRule = (value: boolean) => {
|
||||||
|
setIsActiveValidationRule(value);
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Callback triggered when the text block switch has changed.
|
* Callback triggered when the text block switch has changed.
|
||||||
*/
|
*/
|
||||||
@ -80,37 +96,6 @@ export const TrainingsSettings: React.FC<TrainingsSettingsProps> = () => {
|
|||||||
<FabButton onClick={handleSubmit(onSubmit)} className='save-btn is-main'>{t('app.admin.trainings_settings.save')}</FabButton>
|
<FabButton onClick={handleSubmit(onSubmit)} className='save-btn is-main'>{t('app.admin.trainings_settings.save')}</FabButton>
|
||||||
</header>
|
</header>
|
||||||
<form className="trainings-settings-content">
|
<form className="trainings-settings-content">
|
||||||
<div className="settings-section">
|
|
||||||
<header>
|
|
||||||
<p className="title">{t('app.admin.trainings_settings.automatic_cancellation')}</p>
|
|
||||||
<p className="description">{t('app.admin.trainings_settings.automatic_cancellation_info')}</p>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<div className="content">
|
|
||||||
<FormSwitch id="active_auto_cancellation" control={control}
|
|
||||||
onChange={toggleAutoCancellation} formState={formState}
|
|
||||||
defaultValue={isActiveAutoCancellation}
|
|
||||||
label={t('app.admin.trainings_settings.automatic_cancellation_switch')} />
|
|
||||||
|
|
||||||
{isActiveAutoCancellation && <>
|
|
||||||
<FormInput id="auto_cancellation_threshold"
|
|
||||||
type="number"
|
|
||||||
register={register}
|
|
||||||
rules={{ required: isActiveAutoCancellation, min: 0 }}
|
|
||||||
step={1}
|
|
||||||
formState={formState}
|
|
||||||
label={t('app.admin.trainings_settings.automatic_cancellation_threshold')} />
|
|
||||||
<FormInput id="auto_cancellation_deadline"
|
|
||||||
type="number"
|
|
||||||
register={register}
|
|
||||||
rules={{ required: isActiveAutoCancellation, min: 1 }}
|
|
||||||
step={1}
|
|
||||||
formState={formState}
|
|
||||||
label={t('app.admin.trainings_settings.automatic_cancellation_deadline')} />
|
|
||||||
</>}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="settings-section">
|
<div className="settings-section">
|
||||||
<header>
|
<header>
|
||||||
<p className="title">{t('app.admin.trainings_settings.generic_text_block')}</p>
|
<p className="title">{t('app.admin.trainings_settings.generic_text_block')}</p>
|
||||||
@ -150,6 +135,81 @@ export const TrainingsSettings: React.FC<TrainingsSettingsProps> = () => {
|
|||||||
</>}
|
</>}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className="settings-section">
|
||||||
|
<header>
|
||||||
|
<p className="title">{t('app.admin.trainings_settings.automatic_cancellation')}</p>
|
||||||
|
<p className="description">{t('app.admin.trainings_settings.automatic_cancellation_info')}</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div className="content">
|
||||||
|
<FormSwitch id="active_auto_cancellation" control={control}
|
||||||
|
onChange={toggleAutoCancellation} formState={formState}
|
||||||
|
defaultValue={isActiveAutoCancellation}
|
||||||
|
label={t('app.admin.trainings_settings.automatic_cancellation_switch')} />
|
||||||
|
|
||||||
|
{isActiveAutoCancellation && <>
|
||||||
|
<FormInput id="auto_cancellation_threshold"
|
||||||
|
type="number"
|
||||||
|
register={register}
|
||||||
|
rules={{ required: isActiveAutoCancellation, min: 0 }}
|
||||||
|
step={1}
|
||||||
|
formState={formState}
|
||||||
|
label={t('app.admin.trainings_settings.automatic_cancellation_threshold')} />
|
||||||
|
<FormInput id="auto_cancellation_deadline"
|
||||||
|
type="number"
|
||||||
|
register={register}
|
||||||
|
rules={{ required: isActiveAutoCancellation, min: 1 }}
|
||||||
|
step={1}
|
||||||
|
formState={formState}
|
||||||
|
label={t('app.admin.trainings_settings.automatic_cancellation_deadline')} />
|
||||||
|
</>}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="settings-section">
|
||||||
|
<header>
|
||||||
|
<p className="title">{t('app.admin.trainings_settings.authorization_validity')}</p>
|
||||||
|
<p className="description">{t('app.admin.trainings_settings.authorization_validity_info')}</p>
|
||||||
|
</header>
|
||||||
|
<div className="content">
|
||||||
|
<FormSwitch id="authorization_validity" control={control}
|
||||||
|
onChange={toggleAuthorizationValidity} formState={formState}
|
||||||
|
defaultValue={isActiveAuthorizationValidity}
|
||||||
|
label={t('app.admin.trainings_settings.authorization_validity_switch')} />
|
||||||
|
{isActiveAuthorizationValidity && <>
|
||||||
|
<FormInput id="authorization_validity_duration"
|
||||||
|
type="number"
|
||||||
|
register={register}
|
||||||
|
rules={{ required: isActiveAuthorizationValidity, min: 1 }}
|
||||||
|
step={1}
|
||||||
|
formState={formState}
|
||||||
|
label={t('app.admin.trainings_settings.authorization_validity_duration')} />
|
||||||
|
</>}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="settings-section">
|
||||||
|
<header>
|
||||||
|
<p className="title">{t('app.admin.trainings_settings.validation_rule')}</p>
|
||||||
|
<p className="description">{t('app.admin.trainings_settings.validation_rule_info')}</p>
|
||||||
|
</header>
|
||||||
|
<div className="content">
|
||||||
|
<FormSwitch id="validation_rule" control={control}
|
||||||
|
onChange={toggleValidationRule} formState={formState}
|
||||||
|
defaultValue={isActiveValidationRule}
|
||||||
|
label={t('app.admin.trainings_settings.validation_rule_switch')} />
|
||||||
|
{isActiveValidationRule && <>
|
||||||
|
<FormInput id="validation_rule_period"
|
||||||
|
type="number"
|
||||||
|
register={register}
|
||||||
|
rules={{ required: isActiveValidationRule, min: 1 }}
|
||||||
|
step={1}
|
||||||
|
formState={formState}
|
||||||
|
label={t('app.admin.trainings_settings.validation_rule_period')} />
|
||||||
|
</>}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -7,7 +7,7 @@ import { useTranslation } from 'react-i18next';
|
|||||||
import { FabButton } from '../base/fab-button';
|
import { FabButton } from '../base/fab-button';
|
||||||
import Select from 'react-select';
|
import Select from 'react-select';
|
||||||
import { SelectOption } from '../../models/select';
|
import { SelectOption } from '../../models/select';
|
||||||
import { PencilSimple, Trash } from 'phosphor-react';
|
import { CalendarBlank, PencilSimple, Trash } from 'phosphor-react';
|
||||||
|
|
||||||
declare const Application: IApplication;
|
declare const Application: IApplication;
|
||||||
|
|
||||||
@ -59,6 +59,8 @@ export const Trainings: React.FC<TrainingsProps> = () => {
|
|||||||
<header>
|
<header>
|
||||||
<h2>{t('app.admin.trainings.all_trainings')}</h2>
|
<h2>{t('app.admin.trainings.all_trainings')}</h2>
|
||||||
<div className='grpBtn'>
|
<div className='grpBtn'>
|
||||||
|
{/* lien vers l'agenda */}
|
||||||
|
<FabButton><CalendarBlank size={20} /></FabButton>
|
||||||
<FabButton className="main-action-btn" onClick={newTraining}>{t('app.admin.trainings.add_a_new_training')}</FabButton>
|
<FabButton className="main-action-btn" onClick={newTraining}>{t('app.admin.trainings.add_a_new_training')}</FabButton>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
@ -76,29 +78,52 @@ export const Trainings: React.FC<TrainingsProps> = () => {
|
|||||||
|
|
||||||
<div className='trainings-list'>
|
<div className='trainings-list'>
|
||||||
{/* map
|
{/* map
|
||||||
.is-override si l'item a des paramètres d'annulation auto spécifiques
|
ajouter la classe .is-override si l'item a au moins un réglage spécifique (différent des paramètres généraux)
|
||||||
*/}
|
*/}
|
||||||
<div className='trainings-list-item'>
|
<div className='trainings-list-item'>
|
||||||
<div className='name'>
|
<div className='name'>
|
||||||
<span>{t('app.admin.trainings.name')}</span>
|
<span>{t('app.admin.trainings.name')}</span>
|
||||||
<p>All you can learn : super training</p>
|
<p>All you can learn : super training</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='machines'>
|
<div className='machines'>
|
||||||
<span>{t('app.admin.trainings.associated_machines')}</span>
|
<span>{t('app.admin.trainings.associated_machines')}</span>
|
||||||
<p>Découpeuse laser, Découpeuse vinyle, Shopbot / Grande fraiseuse, Petite Fraiseuse, Imprimante 3D</p>
|
<p>Découpeuse laser, Découpeuse vinyle, Shopbot / Grande fraiseuse, Petite Fraiseuse, Imprimante 3D</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='cancel'>
|
<div className='cancel'>
|
||||||
<span>{t('app.admin.trainings.cancellation')}</span>
|
<span>{t('app.admin.trainings.cancellation')}</span>
|
||||||
<p>5 {t('app.admin.trainings.cancellation_minimum')} <span>|</span> 48 {t('app.admin.trainings.cancellation_deadline')}
|
<p>5 {t('app.admin.trainings.cancellation_minimum')}<span>|</span>48 {t('app.admin.trainings.cancellation_deadline')}
|
||||||
{/* si l'item a des paramètres d'annulation auto spécifiques */}
|
{/* si l'item a un réglage spécifique (différent des paramètres généraux) */}
|
||||||
{false && <span className='override'> ({t('app.admin.trainings.cancellation_override')})</span> }
|
{true && <span className='override'>{t('app.admin.trainings.override')}</span> }
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='capacity'>
|
<div className='capacity'>
|
||||||
<span>{t('app.admin.trainings.capacity')}</span>
|
<span>{t('app.admin.trainings.capacity')}</span>
|
||||||
<p>10</p>
|
<p>10</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className='authorisation'>
|
||||||
|
<span>{t('app.admin.trainings.authorisation')}</span>
|
||||||
|
<p>
|
||||||
|
{t('app.admin.trainings.active_true')}
|
||||||
|
<span>|</span>{t('app.admin.trainings.period_MONTH', { MONTH: 48 })}
|
||||||
|
{/* si l'item a un réglage spécifique (différent des paramètres généraux) */}
|
||||||
|
{true && <span className='override'>{t('app.admin.trainings.override')}</span> }
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className='rule'>
|
||||||
|
<span>{t('app.admin.trainings.validation_rule')}</span>
|
||||||
|
<p>
|
||||||
|
{t('app.admin.trainings.active_false')}
|
||||||
|
<span>|</span>
|
||||||
|
{/* si l'item a un réglage spécifique (différent des paramètres généraux) */}
|
||||||
|
{true && <span className='override'>{t('app.admin.trainings.override')}</span> }
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className='actions'>
|
<div className='actions'>
|
||||||
<div className='grpBtn'>
|
<div className='grpBtn'>
|
||||||
<FabButton className='edit-btn'>
|
<FabButton className='edit-btn'>
|
||||||
|
@ -23,6 +23,7 @@
|
|||||||
@import "modules/authentication-provider/openid-connect-data-mapping-form";
|
@import "modules/authentication-provider/openid-connect-data-mapping-form";
|
||||||
@import "modules/authentication-provider/provider-form";
|
@import "modules/authentication-provider/provider-form";
|
||||||
@import "modules/authentication-provider/type-mapping-modal";
|
@import "modules/authentication-provider/type-mapping-modal";
|
||||||
|
@import "modules/base/editorial-block";
|
||||||
@import "modules/base/fab-alert";
|
@import "modules/base/fab-alert";
|
||||||
@import "modules/base/fab-button";
|
@import "modules/base/fab-button";
|
||||||
@import "modules/base/fab-input";
|
@import "modules/base/fab-input";
|
||||||
|
@ -0,0 +1,20 @@
|
|||||||
|
.editorial-block {
|
||||||
|
margin-bottom: 3.2rem;
|
||||||
|
padding: 2.4rem;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 2.4rem;
|
||||||
|
border: 1px solid var(--gray-soft-dark);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
@include editor;
|
||||||
|
|
||||||
|
@media (min-width: 540px) {
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: flex-end;
|
||||||
|
}
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
}
|
@ -32,12 +32,24 @@
|
|||||||
}
|
}
|
||||||
.price-item {
|
.price-item {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-end;
|
||||||
|
gap: 0 2.4rem;
|
||||||
|
|
||||||
.remove-price {
|
.remove-price {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
display: flex;
|
display: flex;
|
||||||
margin: 2.6rem 2rem 0;
|
margin: 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
@media (min-width: 640px) {
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: flex-start;
|
||||||
|
.remove-price {
|
||||||
|
margin: 2.6rem 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&.destroyed-item {
|
&.destroyed-item {
|
||||||
display: none;
|
display: none;
|
||||||
@ -53,8 +65,4 @@
|
|||||||
margin-right: 2.4rem;
|
margin-right: 2.4rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.submit-btn {
|
|
||||||
margin-top: 2rem;
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
@ -39,7 +39,7 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
display: grid;
|
display: grid;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
grid-template-columns: 1fr 1fr;
|
grid-template-columns: 1fr;
|
||||||
gap: 1.6rem;
|
gap: 1.6rem;
|
||||||
padding: 1.6rem;
|
padding: 1.6rem;
|
||||||
border: 1px solid var(--gray-soft-dark);
|
border: 1px solid var(--gray-soft-dark);
|
||||||
@ -55,7 +55,10 @@
|
|||||||
p {
|
p {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@include text-base(600);
|
@include text-base(600);
|
||||||
span { @include text-base(400); }
|
span {
|
||||||
|
margin: 0 1ch;
|
||||||
|
@include text-base(400);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.name,
|
.name,
|
||||||
@ -64,11 +67,11 @@
|
|||||||
overflow: hidden ;
|
overflow: hidden ;
|
||||||
p { @extend .text-ellipsis; }
|
p { @extend .text-ellipsis; }
|
||||||
}
|
}
|
||||||
.cancel {
|
.override {
|
||||||
.override {
|
margin-left: 1ch;
|
||||||
@include text-sm;
|
@include text-sm;
|
||||||
color: var(--alert-light);
|
font-style: italic;
|
||||||
}
|
color: var(--alert-light);
|
||||||
}
|
}
|
||||||
.actions {
|
.actions {
|
||||||
grid-column-end: -1;
|
grid-column-end: -1;
|
||||||
@ -91,20 +94,16 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 1024px) {
|
@media (min-width: 1024px) {
|
||||||
grid-template-columns: 2fr 1fr max-content;
|
grid-template-columns: 1fr 1fr;
|
||||||
|
}
|
||||||
|
@media (min-width: 1440px) {
|
||||||
|
grid-template-columns: 2fr 1fr 1fr max-content;
|
||||||
|
grid-auto-flow: column;
|
||||||
|
gap: 1.6rem 3.2rem;
|
||||||
.name { grid-area: 1/1/2/2; }
|
.name { grid-area: 1/1/2/2; }
|
||||||
.machines { grid-area: 2/1/3/2; }
|
.machines { grid-area: 2/1/3/2; }
|
||||||
.actions { grid-row: 1/3; }
|
.actions { grid-row: 1/3; }
|
||||||
}
|
}
|
||||||
@media (min-width: 1440px) {
|
|
||||||
grid-template-columns: 1fr 40ch repeat(2, 1fr) max-content;
|
|
||||||
align-items: center;
|
|
||||||
.name,
|
|
||||||
.machines,
|
|
||||||
.cancel,
|
|
||||||
.capacity,
|
|
||||||
.actions { grid-area: auto; }
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -33,16 +33,16 @@
|
|||||||
<div>
|
<div>
|
||||||
<uib-tabset justified="true" active="tabs.active">
|
<uib-tabset justified="true" active="tabs.active">
|
||||||
|
|
||||||
<uib-tab heading="{{ 'app.admin.machines.all_machines' | translate }}" index="0" select="selectTab()">
|
<uib-tab heading="{{ 'app.admin.machines.machines_settings' | translate }}" index="1" select="selectTab()">
|
||||||
<div ng-if="tabs.active === 0">
|
<machines-settings on-error="onError" on-success="on-success"></machines-settings>
|
||||||
<ng-include src="'/admin/machines/machines.html'"></ng-include>
|
|
||||||
</div>
|
|
||||||
</uib-tab>
|
</uib-tab>
|
||||||
|
|
||||||
<uib-tab heading="{{ 'app.admin.machines.manage_machines_categories' | translate }}" index="1" select="selectTab()">
|
<uib-tab heading="{{ 'app.admin.machines.all_machines' | translate }}" index="0" select="selectTab()">
|
||||||
<div ng-if="tabs.active === 1">
|
<ng-include src="'/admin/machines/machines.html'"></ng-include>
|
||||||
<ng-include src="'/admin/machines/categories.html'"></ng-include>
|
</uib-tab>
|
||||||
</div>
|
|
||||||
|
<uib-tab heading="{{ 'app.admin.machines.manage_machines_categories' | translate }}" index="2" select="selectTab()">
|
||||||
|
<ng-include src="'/admin/machines/categories.html'"></ng-include>
|
||||||
</uib-tab>
|
</uib-tab>
|
||||||
|
|
||||||
</uib-tabset>
|
</uib-tabset>
|
||||||
|
@ -5,19 +5,11 @@
|
|||||||
<a ng-click="backPrevLocation($event)"><i class="fas fa-long-arrow-alt-left "></i></a>
|
<a ng-click="backPrevLocation($event)"><i class="fas fa-long-arrow-alt-left "></i></a>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-10 col-sm-10 col-md-8 b-l b-r-md">
|
<div class="col-xs-10 col-sm-10 col-md-11 b-l b-r-md">
|
||||||
<section class="heading-title">
|
<section class="heading-title">
|
||||||
<h1 translate>{{ 'app.admin.trainings.trainings_monitoring' }}</h1>
|
<h1 translate>{{ 'app.admin.trainings.trainings_monitoring' }}</h1>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-xs-12 col-sm-12 col-md-3 b-t hide-b-md">
|
|
||||||
<section class="heading-actions wrapper">
|
|
||||||
<a role="button" ui-sref="app.admin.calendar" class="btn btn-lg btn-default rounded m-t-sm text-sm">
|
|
||||||
<i class="fa fa-calendar-check-o m-r" aria-hidden="true"></i><span translate>{{ 'app.admin.trainings.plan_session' }}</span>
|
|
||||||
</a>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
@ -39,7 +31,7 @@
|
|||||||
<uib-tab heading="{{ 'app.admin.trainings.all_trainings' | translate }}" index="0" class="manage-trainings">
|
<uib-tab heading="{{ 'app.admin.trainings.all_trainings' | translate }}" index="0" class="manage-trainings">
|
||||||
<trainings on-error="onError" on-success="on-success"></trainings>
|
<trainings on-error="onError" on-success="on-success"></trainings>
|
||||||
|
|
||||||
<div class="m-t m-b">
|
<!--<div class="m-t m-b">
|
||||||
<button type="button" class="btn btn-warning" ui-sref="app.admin.trainings_new" ng-show="isAuthorized('admin')">
|
<button type="button" class="btn btn-warning" ui-sref="app.admin.trainings_new" ng-show="isAuthorized('admin')">
|
||||||
<i class="fa fa-plus m-r"></i>
|
<i class="fa fa-plus m-r"></i>
|
||||||
<span translate>{{ 'app.admin.trainings.add_a_new_training' }}</span>
|
<span translate>{{ 'app.admin.trainings.add_a_new_training' }}</span>
|
||||||
@ -80,7 +72,7 @@
|
|||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>-->
|
||||||
</uib-tab>
|
</uib-tab>
|
||||||
|
|
||||||
<uib-tab heading="{{ 'app.admin.trainings.trainings_monitoring' | translate }}" class="post-tracking" index="2">
|
<uib-tab heading="{{ 'app.admin.trainings.trainings_monitoring' | translate }}" class="post-tracking" index="2">
|
||||||
|
@ -5,7 +5,7 @@
|
|||||||
<a ng-click="backPrevLocation($event)"><i class="fas fa-long-arrow-alt-left "></i></a>
|
<a ng-click="backPrevLocation($event)"><i class="fas fa-long-arrow-alt-left "></i></a>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-10 col-sm-10 col-md-8 b-l b-r-md">
|
<div class="col-xs-10 col-sm-10 col-md-11 b-l">
|
||||||
<section class="heading-title">
|
<section class="heading-title">
|
||||||
<h1 translate>{{ 'app.public.trainings_list.the_trainings' }}</h1>
|
<h1 translate>{{ 'app.public.trainings_list.the_trainings' }}</h1>
|
||||||
</section>
|
</section>
|
||||||
@ -16,6 +16,7 @@
|
|||||||
|
|
||||||
|
|
||||||
<section class="m-lg">
|
<section class="m-lg">
|
||||||
|
<editorial-block></editorial-block>
|
||||||
|
|
||||||
<div class="row" ng-repeat="training in (trainings.length/3 | array)">
|
<div class="row" ng-repeat="training in (trainings.length/3 | array)">
|
||||||
|
|
||||||
|
@ -5,6 +5,7 @@ en:
|
|||||||
the_fablab_s_machines: "The FabLab's machines"
|
the_fablab_s_machines: "The FabLab's machines"
|
||||||
all_machines: "All machines"
|
all_machines: "All machines"
|
||||||
manage_machines_categories: "Manage machines categories"
|
manage_machines_categories: "Manage machines categories"
|
||||||
|
machines_settings: "Settings"
|
||||||
machine_categories_list:
|
machine_categories_list:
|
||||||
machine_categories: "Machines categories"
|
machine_categories: "Machines categories"
|
||||||
add_a_machine_category: "Add a machine category"
|
add_a_machine_category: "Add a machine category"
|
||||||
@ -66,16 +67,18 @@ en:
|
|||||||
disable_training: "Disable the training"
|
disable_training: "Disable the training"
|
||||||
disabled_help: "When disabled, the training won't be reservable and won't appear by default in the trainings list."
|
disabled_help: "When disabled, the training won't be reservable and won't appear by default in the trainings list."
|
||||||
automatic_cancellation: "Automatic cancellation"
|
automatic_cancellation: "Automatic cancellation"
|
||||||
automatic_cancellation_info: "Activating this option will override the general cancellation settings for this training."
|
automatic_cancellation_info: "If you edit specific conditions here, the general cancellation conditions will no longer be taken into account. You will be notified if a session is cancelled. Credit notes and refunds will be automatic if the wallet is enabled. Otherwise you will have to do it manually."
|
||||||
automatic_cancellation_switch: "Activate automatic cancellation for this training"
|
automatic_cancellation_switch: "Activate automatic cancellation for this training"
|
||||||
automatic_cancellation_threshold: "Minimum number of registrations to maintain a session"
|
automatic_cancellation_threshold: "Minimum number of registrations to maintain a session"
|
||||||
automatic_cancellation_deadline: "Deadline, in hours, before automatic cancellation"
|
automatic_cancellation_deadline: "Deadline, in hours, before automatic cancellation"
|
||||||
generic_text_block: "Generic text block"
|
authorization_validity: "Authorisations validity period"
|
||||||
generic_text_block_info: "Displays an editorial block above the training description visible to members."
|
authorization_validity_info: "You can define a specific validity period in months for this training. The general conditions will no longer be taken into account."
|
||||||
generic_text_block_switch: "Display editorial block"
|
authorization_validity_switch: "Activate an authorization validity period"
|
||||||
cta_switch: "Display a button"
|
authorization_validity_period: "Validity period in months"
|
||||||
cta_label: "Button label"
|
validation_rule: "Authorisations cancellation rule"
|
||||||
cta_url: "url"
|
validation_rule_info: "Define a rule that cancel an authorisation if the machines associated with the training are not reserved for a specific period of time. This rule prevails over the authorisations validity period."
|
||||||
|
validation_rule_switch: "Activate the validation rule"
|
||||||
|
validation_rule_period: "Time limit in months"
|
||||||
save: "Save"
|
save: "Save"
|
||||||
create_success: "The training was created successfully"
|
create_success: "The training was created successfully"
|
||||||
update_success: "The training was updated successfully"
|
update_success: "The training was updated successfully"
|
||||||
@ -413,7 +416,6 @@ en:
|
|||||||
#track and monitor the trainings
|
#track and monitor the trainings
|
||||||
trainings:
|
trainings:
|
||||||
trainings_monitoring: "Trainings monitoring"
|
trainings_monitoring: "Trainings monitoring"
|
||||||
plan_session: "Schedule a new session"
|
|
||||||
all_trainings: "All trainings"
|
all_trainings: "All trainings"
|
||||||
add_a_new_training: "Add a new training"
|
add_a_new_training: "Add a new training"
|
||||||
name: "Training name"
|
name: "Training name"
|
||||||
@ -421,8 +423,13 @@ en:
|
|||||||
cancellation: "Cancellation (attendees | deadline)"
|
cancellation: "Cancellation (attendees | deadline)"
|
||||||
cancellation_minimum: "minimum"
|
cancellation_minimum: "minimum"
|
||||||
cancellation_deadline: "h"
|
cancellation_deadline: "h"
|
||||||
cancellation_override: "Override"
|
|
||||||
capacity: "Capacity (max. attendees)"
|
capacity: "Capacity (max. attendees)"
|
||||||
|
authorisation: "Time-limited authorisation"
|
||||||
|
period_MONTH: "{MONTH} {MONTH, plural, one{month} other{months}}"
|
||||||
|
active_true: "Yes"
|
||||||
|
active_false: "No"
|
||||||
|
validation_rule: "Lapsed without reservation"
|
||||||
|
override: "(Modified)"
|
||||||
select_a_training: "Select a training"
|
select_a_training: "Select a training"
|
||||||
training: "Training"
|
training: "Training"
|
||||||
date: "Date"
|
date: "Date"
|
||||||
@ -455,11 +462,19 @@ en:
|
|||||||
trainings_settings:
|
trainings_settings:
|
||||||
title: "Settings"
|
title: "Settings"
|
||||||
automatic_cancellation: "Trainings automatic cancellation"
|
automatic_cancellation: "Trainings automatic cancellation"
|
||||||
automatic_cancellation_info: "If this setting is activated, a minimum number of participants will be required to maintain a session. You will be notified by email if a session is cancelled. If the wallet is enabled, credit notes and refunds will be automatic, otherwise you will have to generate credit notes and make refunds manually."
|
automatic_cancellation_info: "Minimum number of participants required to maintain a session. You will be notified if a session is cancelled. Credit notes and refunds will be automatic if the wallet is enabled. Otherwise you will have to do it manually."
|
||||||
automatic_cancellation_switch: "Activate automatic cancellation for all the trainings"
|
automatic_cancellation_switch: "Activate automatic cancellation for all the trainings"
|
||||||
automatic_cancellation_threshold: "Minimum number of registrations to maintain a session"
|
automatic_cancellation_threshold: "Minimum number of registrations to maintain a session"
|
||||||
automatic_cancellation_deadline: "Deadline, in hours, before automatic cancellation"
|
automatic_cancellation_deadline: "Deadline, in hours, before automatic cancellation"
|
||||||
generic_text_block: "Generic text block"
|
authorization_validity: "Authorisations validity period"
|
||||||
|
authorization_validity_info: "Define a validity period for all training authorisations. After this period, the authorisation will lapse"
|
||||||
|
authorization_validity_switch: "Activate an authorization validity period"
|
||||||
|
authorization_validity_period: "Validity period in months"
|
||||||
|
validation_rule: "Authorisations cancellation rule"
|
||||||
|
validation_rule_info: "Define a rule that cancel an authorisation if the machines associated with the training are not reserved for a specific period of time. This rule prevails over the authorisations validity period."
|
||||||
|
validation_rule_switch: "Activate the validation rule"
|
||||||
|
validation_rule_period: "Time limit in months"
|
||||||
|
generic_text_block: "Editorial text block"
|
||||||
generic_text_block_info: "Displays an editorial block above the list of trainings visible to members."
|
generic_text_block_info: "Displays an editorial block above the list of trainings visible to members."
|
||||||
generic_text_block_switch: "Display editorial block"
|
generic_text_block_switch: "Display editorial block"
|
||||||
cta_switch: "Display a button"
|
cta_switch: "Display a button"
|
||||||
|
Loading…
x
Reference in New Issue
Block a user