mirror of
https://github.com/LaCasemate/fab-manager.git
synced 2025-01-29 18:52:22 +01:00
Fix classes names
This commit is contained in:
parent
934ac309a1
commit
c394b3a275
@ -12,5 +12,4 @@ export default class SpaceAPI {
|
||||
const res: AxiosResponse<Space> = await apiClient.get(`/api/spaces/${id}`);
|
||||
return res?.data;
|
||||
}
|
||||
|
||||
}
|
||||
|
@ -64,8 +64,8 @@ export const ConfigurePacksButton: React.FC<ConfigurePacksButtonProps> = ({ pack
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="configure-packs-button">
|
||||
<button className="packs-button" onClick={toggleShowList}>
|
||||
<div className="configure-group">
|
||||
<button className="configure-group-button" onClick={toggleShowList}>
|
||||
<i className="fas fa-box" />
|
||||
</button>
|
||||
{showList && <FabPopover title={t('app.admin.configure_packs_button.packs')} headerButton={renderAddButton()} className="fab-popover__right">
|
||||
@ -73,7 +73,7 @@ export const ConfigurePacksButton: React.FC<ConfigurePacksButtonProps> = ({ pack
|
||||
{packs?.map(p =>
|
||||
<li key={p.id} className={p.disabled ? 'disabled' : ''}>
|
||||
{formatDuration(p.minutes)} - {FormatLib.price(p.amount)}
|
||||
<span className="pack-actions">
|
||||
<span className="group-actions">
|
||||
<EditPack onSuccess={handleSuccess} onError={onError} pack={p} />
|
||||
<DeletePack onSuccess={handleSuccess} onError={onError} pack={p} />
|
||||
</span>
|
||||
|
@ -42,8 +42,8 @@ const DeletePackComponent: React.FC<DeletePackProps> = ({ onSuccess, onError, pa
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="delete-pack">
|
||||
<FabButton type='button' className="remove-pack-button" icon={<i className="fa fa-trash" />} onClick={toggleDeletionModal} />
|
||||
<div className="delete-group">
|
||||
<FabButton type='button' className="delete-group-button" icon={<i className="fa fa-trash" />} onClick={toggleDeletionModal} />
|
||||
<FabModal title={t('app.admin.delete_pack.delete_pack')}
|
||||
isOpen={deletionModal}
|
||||
toggleModal={toggleDeletionModal}
|
||||
|
@ -54,16 +54,15 @@ export const EditPack: React.FC<EditPackProps> = ({ pack, onSuccess, onError })
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="edit-pack">
|
||||
<FabButton type='button' className="edit-pack-button" icon={<i className="fas fa-edit" />} onClick={handleRequestEdit} />
|
||||
<div className="edit-group">
|
||||
<FabButton type='button' icon={<i className="fas fa-edit" />} onClick={handleRequestEdit} />
|
||||
<FabModal isOpen={isOpen}
|
||||
toggleModal={toggleModal}
|
||||
title={t('app.admin.edit_pack.edit_pack')}
|
||||
className="edit-pack-modal"
|
||||
closeButton
|
||||
confirmButton={t('app.admin.edit_pack.confirm_changes')}
|
||||
onConfirmSendFormId="edit-pack">
|
||||
{packData && <PackForm formId="edit-pack" onSubmit={handleUpdate} pack={packData} />}
|
||||
onConfirmSendFormId="edit-group">
|
||||
{packData && <PackForm formId="edit-group" onSubmit={handleUpdate} pack={packData} />}
|
||||
</FabModal>
|
||||
</div>
|
||||
);
|
||||
|
@ -107,7 +107,7 @@ const MachinesPricing: React.FC<MachinesPricingProps> = ({ onError, onSuccess })
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="machines-pricing">
|
||||
<div className="pricing-list">
|
||||
<FabAlert level="warning">
|
||||
<p><HtmlTranslate trKey="app.admin.machines_pricing.prices_match_machine_hours_rates_html"/></p>
|
||||
<p><HtmlTranslate trKey="app.admin.machines_pricing.prices_calculated_on_hourly_rate_html" options={{ DURATION: `${EXEMPLE_DURATION}`, RATE: examplePrice('hourly_rate'), PRICE: examplePrice('final_price') }} /></p>
|
||||
|
@ -103,7 +103,7 @@ export const PackForm: React.FC<PackFormProps> = ({ formId, onSubmit, pack }) =>
|
||||
};
|
||||
|
||||
return (
|
||||
<form id={formId} onSubmit={handleSubmit} className="pack-form">
|
||||
<form id={formId} onSubmit={handleSubmit} className="group-form">
|
||||
<label htmlFor="hours">{t('app.admin.pack_form.hours')} *</label>
|
||||
<FabInput id="hours"
|
||||
type="number"
|
||||
|
@ -28,7 +28,7 @@ export const ConfigureExtendedPriceButton: React.FC<ConfigureExtendedPriceButton
|
||||
const [showList, setShowList] = useState<boolean>(false);
|
||||
|
||||
/**
|
||||
* Open/closes the popover listing the existing packs
|
||||
* Open/closes the popover listing the existing extended prices
|
||||
*/
|
||||
const toggleShowList = (): void => {
|
||||
setShowList(!showList);
|
||||
@ -57,8 +57,8 @@ export const ConfigureExtendedPriceButton: React.FC<ConfigureExtendedPriceButton
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="configure-extended-prices-button">
|
||||
<button className="packs-button" onClick={toggleShowList}>
|
||||
<div className="configure-group">
|
||||
<button className="configure-group-button" onClick={toggleShowList}>
|
||||
<i className="fas fa-stopwatch" />
|
||||
</button>
|
||||
{showList && <FabPopover title={t('app.admin.configure_extendedPrices_button.extendedPrices')} headerButton={renderAddButton()} className="fab-popover__right">
|
||||
@ -66,7 +66,7 @@ export const ConfigureExtendedPriceButton: React.FC<ConfigureExtendedPriceButton
|
||||
{extendedPrices?.map(extendedPrice =>
|
||||
<li key={extendedPrice.id}>
|
||||
{extendedPrice.duration} {t('app.admin.calendar.minutes')} - {FormatLib.price(extendedPrice.amount)}
|
||||
<span className="pack-actions">
|
||||
<span className="group-actions">
|
||||
<EditExtendedPrice onSuccess={handleSuccess} onError={onError} price={extendedPrice} />
|
||||
<DeleteExtendedPrice onSuccess={handleSuccess} onError={onError} price={extendedPrice} />
|
||||
</span>
|
||||
|
@ -41,8 +41,8 @@ export const DeleteExtendedPrice: React.FC<DeleteExtendedPriceProps> = ({ onSucc
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="delete-pack">
|
||||
<FabButton type='button' className="remove-pack-button" icon={<i className="fa fa-trash" />} onClick={toggleDeletionModal} />
|
||||
<div className="delete-group">
|
||||
<FabButton type='button' className="delete-group-button" icon={<i className="fa fa-trash" />} onClick={toggleDeletionModal} />
|
||||
<FabModal title={t('app.admin.delete_extendedPrice.delete_extendedPrice')}
|
||||
isOpen={deletionModal}
|
||||
toggleModal={toggleDeletionModal}
|
||||
|
@ -50,16 +50,15 @@ export const EditExtendedPrice: React.FC<EditExtendedPriceProps> = ({ price, onS
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="edit-pack">
|
||||
<FabButton type='button' className="edit-pack-button" icon={<i className="fas fa-edit" />} onClick={handleRequestEdit} />
|
||||
<div className="edit-group">
|
||||
<FabButton type='button' icon={<i className="fas fa-edit" />} onClick={handleRequestEdit} />
|
||||
<FabModal isOpen={isOpen}
|
||||
toggleModal={toggleModal}
|
||||
title={t('app.admin.edit_extendedPrice.edit_extendedPrice')}
|
||||
className="edit-pack-modal"
|
||||
closeButton
|
||||
confirmButton={t('app.admin.edit_extendedPrice.confirm_changes')}
|
||||
onConfirmSendFormId="edit-pack">
|
||||
{extendedPriceData && <ExtendedPriceForm formId="edit-pack" onSubmit={handleUpdate} price={extendedPriceData} />}
|
||||
onConfirmSendFormId="edit-group">
|
||||
{extendedPriceData && <ExtendedPriceForm formId="edit-group" onSubmit={handleUpdate} price={extendedPriceData} />}
|
||||
</FabModal>
|
||||
</div>
|
||||
);
|
||||
|
@ -7,7 +7,7 @@ import { IFablab } from '../../../models/fablab';
|
||||
|
||||
declare let Fablab: IFablab;
|
||||
|
||||
interface PackFormProps {
|
||||
interface ExtendedPriceFormProps {
|
||||
formId: string,
|
||||
onSubmit: (pack: Price) => void,
|
||||
price?: Price,
|
||||
@ -17,7 +17,7 @@ interface PackFormProps {
|
||||
* A form component to create/edit a extended price.
|
||||
* The form validation must be created elsewhere, using the attribute form={formId}.
|
||||
*/
|
||||
export const ExtendedPriceForm: React.FC<PackFormProps> = ({ formId, onSubmit, price }) => {
|
||||
export const ExtendedPriceForm: React.FC<ExtendedPriceFormProps> = ({ formId, onSubmit, price }) => {
|
||||
const [extendedPriceData, updateExtendedPriceData] = useImmer<Price>(price || {} as Price);
|
||||
|
||||
const { t } = useTranslation('admin');
|
||||
@ -49,7 +49,7 @@ export const ExtendedPriceForm: React.FC<PackFormProps> = ({ formId, onSubmit, p
|
||||
};
|
||||
|
||||
return (
|
||||
<form id={formId} onSubmit={handleSubmit} className="pack-form">
|
||||
<form id={formId} onSubmit={handleSubmit} className="group-form">
|
||||
<label htmlFor="duration">{t('app.admin.calendar.minutes')} *</label>
|
||||
<FabInput id="duration"
|
||||
type="number"
|
||||
|
@ -35,7 +35,7 @@ const SpacesPricing: React.FC<SpacesPricingProps> = ({ onError, onSuccess }) =>
|
||||
|
||||
// retrieve the initial data
|
||||
useEffect(() => {
|
||||
SpaceAPI.index(false)
|
||||
SpaceAPI.index()
|
||||
.then(data => setSpaces(data))
|
||||
.catch(error => onError(error));
|
||||
GroupAPI.index({ disabled: false, admins: false })
|
||||
@ -67,7 +67,7 @@ const SpacesPricing: React.FC<SpacesPricingProps> = ({ onError, onSuccess }) =>
|
||||
* Find the default price (hourly rate) matching the given criterion
|
||||
*/
|
||||
const findPriceBy = (spaceId, groupId): Price => {
|
||||
return prices.find(price => price.priceable_id === spaceId && price.group_id === groupId && price.duration == 60);
|
||||
return prices.find(price => price.priceable_id === spaceId && price.group_id === groupId && price.duration === 60);
|
||||
};
|
||||
|
||||
/**
|
||||
@ -101,7 +101,7 @@ const SpacesPricing: React.FC<SpacesPricingProps> = ({ onError, onSuccess }) =>
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="machines-pricing">
|
||||
<div className="pricing-list">
|
||||
<FabAlert level="warning">
|
||||
<p><HtmlTranslate trKey="app.admin.pricing.these_prices_match_space_hours_rates_html"/></p>
|
||||
<p><HtmlTranslate trKey="app.admin.pricing.prices_calculated_on_hourly_rate_html" options={{ DURATION: `${EXEMPLE_DURATION}`, RATE: examplePrice('hourly_rate'), PRICE: examplePrice('final_price') }} /></p>
|
||||
@ -118,7 +118,7 @@ const SpacesPricing: React.FC<SpacesPricingProps> = ({ onError, onSuccess }) =>
|
||||
{spaces?.map(space => <tr key={space.id}>
|
||||
<td>{space.name}</td>
|
||||
{groups?.map(group => <td key={group.id}>
|
||||
{prices && <EditablePrice price={findPriceBy(space.id, group.id)} onSave={handleUpdatePrice} />}
|
||||
{prices.length && <EditablePrice price={findPriceBy(space.id, group.id)} onSave={handleUpdatePrice} />}
|
||||
<ConfigureExtendedPriceButton
|
||||
prices={findExtendedPricesBy(space.id, group.id)}
|
||||
onError={onError}
|
||||
|
@ -57,12 +57,12 @@
|
||||
@import "modules/machines/machines-filters";
|
||||
@import "modules/machines/required-training-modal";
|
||||
@import "modules/user/avatar";
|
||||
@import "modules/pricing/machines-pricing";
|
||||
@import "modules/pricing/pricing-list";
|
||||
@import "modules/pricing/editable-price";
|
||||
@import "modules/pricing/configure-packs-button";
|
||||
@import "modules/pricing/pack-form";
|
||||
@import "modules/pricing/delete-pack";
|
||||
@import "modules/pricing/edit-pack";
|
||||
@import "modules/pricing/configure-group-button";
|
||||
@import "modules/pricing/group-form";
|
||||
@import "modules/pricing/delete-group";
|
||||
@import "modules/pricing/edit-group";
|
||||
@import "modules/settings/check-list-setting";
|
||||
@import "modules/prepaid-packs/propose-packs-modal";
|
||||
@import "modules/prepaid-packs/packs-summary";
|
||||
|
@ -1,9 +1,9 @@
|
||||
.configure-packs-button {
|
||||
.configure-group {
|
||||
display: inline-block;
|
||||
margin-left: 6px;
|
||||
position: relative;
|
||||
|
||||
.packs-button {
|
||||
&-button {
|
||||
border: 1px solid #d0cccc;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
@ -44,7 +44,7 @@
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.pack-actions button {
|
||||
.group-actions button {
|
||||
font-size: 10px;
|
||||
vertical-align: middle;
|
||||
line-height: 10px;
|
@ -1,7 +1,7 @@
|
||||
.delete-pack {
|
||||
.delete-group {
|
||||
display: inline;
|
||||
|
||||
.remove-pack-button {
|
||||
&-button {
|
||||
background-color: #cb1117;
|
||||
color: white;
|
||||
}
|
@ -1,3 +1,3 @@
|
||||
.edit-pack {
|
||||
.edit-group {
|
||||
display: inline-block;
|
||||
}
|
@ -1,4 +1,4 @@
|
||||
.pack-form {
|
||||
.group-form {
|
||||
.interval-inputs {
|
||||
display: flex;
|
||||
|
@ -1,4 +1,4 @@
|
||||
.machines-pricing {
|
||||
.pricing-list {
|
||||
.fab-alert {
|
||||
margin: 15px 0;
|
||||
}
|
||||
@ -28,4 +28,4 @@
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user