export const buildHoursRanges = (start, end, range) => {
if (range === null) {
return [[format(start, 'HH:mm'), format(end, 'HH:mm')]];
}
const datas = [];
for (let cpt = 0; cpt < differenceInMinutes(end, start); cpt += range) {
// eslint-disable-line
const debut = addMinutes(start, cpt);
const fin = addMinutes(start, cpt + range);
datas[cpt] = [format(debut, 'HH:mm'), format(fin, 'HH:mm')];
}
return datas;
};
.map(id =>
(<ListItem
value={id}
innerDivStyle={{ padding: '4px 0' }}
nestedListStyle={{ padding: '5px' }}
>
{format(commandeUtilisateurs[id].createdAt, 'MMMM D YYYY')}
</ListItem>)
{versions.map(v => {
return (
<TableRow key={v.id} hover onClick={event => this.handleVersionClick(v.name)}>
<TableCell>{v.name}</TableCell>
<TableCell>{v.label}</TableCell>
<TableCell>{Dates.format(v.date)}</TableCell>
</TableRow>
)
})}
{commande.distributions.map((dist, idx1) =>
(<List key={idx1}>
<Subheader className={styles.subHeader}>
{format(dist.debut, 'dddd Do MMMM')}
</Subheader>
{buildHoursRanges(dist.debut, dist.fin, range).map((data, idx) =>
(<ListItem
onClick={() => selectionnePlageHoraire(idx, dist.id)}
key={idx}
style={
idx === plageHoraire && livraisonId === dist.id
? comptutedStyles.selected
: {}
}
>
<span style={greyColor}>De </span><strong>{data[0]}</strong>
<span style={greyColor}> à </span><strong>{data[1]}</strong>
</ListItem>)
)}
</List>)
{effects.slice().sort((e1, e2) => e1 < e2).map((effect, idx) => {
const { type, amount, memo } = effect;
return (
<TableRow
key={idx}
selectable={false}
displayBorder
style={{
borderBottom: 'solid 1px silver',
backgroundColor: idx % 2 === 0 ? 'white' : palette.oddColor,
}}
>
<TableRowColumn>
{format(effect.created_at, 'DD/MM/YYYY HH:mm')}
</TableRowColumn>
<TableRowColumn width="45" style={{ textAlign: 'center' }}>
{`${type === 'account_credited' ? '+' : '-'} ${round(parseFloat(amount), 2).toFixed(2)}`}
</TableRowColumn>
<TableRowColumn width="240" style={{ textAlign: 'center' }}>
{memo}
</TableRowColumn>
</TableRow>
);
})}
render() {
const {
pending,
commandeUtilisateurs,
commandeContenus,
contenus,
commande,
utilisateurs,
fournisseurs,
produits,
offres,
params: { fournisseurId, commandeId },
} = this.props;
if (pending) {
return <p>{'Chargements...'}</p>;
}
if (
!fournisseurs ||
!commande ||
!commandeUtilisateurs ||
!commandeContenus ||
!commandeContenus.length > 0 ||
!contenus ||
!produits ||
!utilisateurs
) {
return null;
}
const commandeContenusFournisseur = commandeContenus.filter(
id =>
produits[offres[contenus[id].offreId].produitId].fournisseurId ===
fournisseurId
);
const commandeContenusColl = commandeContenusFournisseur.map(
id => contenus[id]
);
const contenusFournGrp = groupBy(
commandeContenusColl.filter(
cC =>
produits[offres[cC.offreId].produitId].fournisseurId === fournisseurId
),
cc => cc.offreId
);
const totaux = commandeContenusColl
? calculeTotauxCommande({
commandeContenus: contenus,
offres,
commandeId,
filter: cc =>
produits[offres[cc.offreId].produitId].fournisseurId ===
fournisseurId,
})
: null;
return (
<div className={classnames(styles.page, styles.invoiceBox)}>
<table cellPadding="0" cellSpacing="0">
<tbody>
<tr className={styles.top}>
<td colSpan="4">
<table>
<tr>
<td className={styles.title}>
<h3>Commande Proxiweb <small>{commandeId}</small></h3>
</td>
<td className={styles.title}>
<h3>{format(commande.dateCommande, 'DD MM')}</h3>
</td>
</tr>
</table>
</td>
</tr>
<tr className={styles.heading}>
<td>
Produit
</td>
<td className={styles.center}>
Quantité
</td>
<td className={styles.center}>
Prix unitaire HT
</td>
<td className={styles.totaux}>
Total TTC
</td>
</tr>
{Object.keys(contenusFournGrp).map((offreId, idx) =>
this.buildProduct(contenusFournGrp[offreId], idx)
)}
</tbody>
</table>
<div
style={{ textAlign: 'right', fontSize: '1.2em', marginTop: '1em' }}
>
{commandeUtilisateurs.length}
{' '}
acheteur(s) - Total:
{' '}
<strong>{round(totaux.prix, 2)} €</strong>
</div>
</div>
);
}