import * as React from "react";
import moment from "moment";
import { IOrderDetailVM } from "../../../../../apiModels/ViewModels";

type OrderDetailHeaderProps = {
	order: IOrderDetailVM
};

export const OrderDetailHeader = ({ order }: OrderDetailHeaderProps) => {
	const date = moment(order.orderedDate).format("DD.MM.YYYY HH:MM");

	return (
		<div className="row" style={{ paddingBottom: "24px" }}>
			<div className="col" style={{ minWidth: '250px' }}>
				<ul className="order__detail__header">
					<li><b>Způsob dopravy: </b>{order.deliveryType}</li>
					<li><b>Stav objednávky: </b>{order.orderState}</li>
					<li><b>Způsob platby: </b>{order.paymentType}</li>
					<li><b>Stav platby: </b>{order.paymentState}</li>
				</ul>
			</div>
			<div className="d-flex align-items-end flex-column" style={{ paddingRight: '15px' }}>
				<div className="mt-auto">
					<b>Objednáno dne: </b>{date}
				</div>
			</div>
		</div>
	);
};