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

type OrderDetailAddressesProps = {
	order: IOrderDetailVM
};

export const OrderDetailAddresses = ({ order }: OrderDetailAddressesProps) => {
	return (
		<div className="row">
			<div className="col-lg-6">
				<h5>Fakturační adresa:</h5>
				<div className="row">
					<div className="col-lg-6">
						<div className="checkout__input">
							<p>Jméno<span>*</span></p>
							<input type="text" value={order.invoicingAddress.firstName} disabled />
						</div>
					</div>
					<div className="col-lg-6">
						<div className="checkout__input">
							<p>Příjmení<span>*</span></p>
							<input type="text" value={order.invoicingAddress.lastName} disabled />
						</div>
					</div>
				</div>
				<div className="checkout__input">
					<p>Město a ulice<span>*</span></p>
					<input type="text" value={order.invoicingAddress.city} disabled style={{ marginBottom: '24px' }} />
					<input type="text" value={order.invoicingAddress.street} disabled />
				</div>
				<div className="checkout__input">
					<p>PSČ<span>*</span></p>
					<input type="text" value={order.invoicingAddress.zipCode} disabled />
				</div>
				<div className="row">
					<div className="col-lg-6">
						<div className="checkout__input">
							<p>Telefonní číslo<span>*</span></p>
							<input type="text" value={order.invoicingAddress.phoneNumber} disabled />
						</div>
					</div>
				</div>
			</div>

			{order.deliveryAddress != undefined
				? <div className="col-lg-6">
					<h5>Doručovací adresa:</h5>
					<div className="row">
						<div className="col-lg-6">
							<div className="checkout__input">
								<p>Jméno<span>*</span></p>
								<input type="text" value={order.deliveryAddress.firstName} disabled />
							</div>
						</div>
						<div className="col-lg-6">
							<div className="checkout__input">
								<p>Příjmení<span>*</span></p>
								<input type="text" value={order.deliveryAddress.lastName} disabled />
							</div>
						</div>
					</div>
					<div className="checkout__input">
						<p>Město a ulice<span>*</span></p>
						<input type="text" value={order.deliveryAddress.city} disabled style={{ marginBottom: '24px' }} />
						<input type="text" value={order.deliveryAddress.street} disabled />
					</div>
					<div className="checkout__input">
						<p>PSČ<span>*</span></p>
						<input type="text" value={order.deliveryAddress.zipCode} disabled />
					</div>
					<div className="row">
						<div className="col-lg-6">
							<div className="checkout__input">
								<p>Telefonní číslo<span>*</span></p>
								<input type="text" value={order.deliveryAddress.phoneNumber} disabled />
							</div>
						</div>
					</div>
				</div>
				: null
			}
		</div>
	);
}