@model ParcelWeb.Core.Dto.ShipmentDto
@{
    ViewBag.Title = "AirWayBill";
    Layout = "~/Views/Shared/_LayoutInvoice.cshtml";
}
@{var imgPath = Html.Action("GetLogoImage", "DashBoard");}

<style>
    body {
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 14px;
    }

    h2 {
        margin-top: 5px;
        margin-bottom: 5px;
    }

    h3 {
        margin-top: 5px;
    }

    .upperline {
        border-top: 2px solid Black;
    }

    .border {
        border: 1px solid Black;
    }

    .border-top {
        border-left: 1px solid Black;
        border-right: 1px solid Black;
    }

    .table-bordered {
        border: 1px solid Black;
    }

    .height-100 {
        max-height: 100px;
        min-height: 100px;
    }

    .height-120 {
        max-height: 120px;
        min-height: 120px;
    }

    .height-140 {
        max-height: 150px;
        min-height: 150px;
    }

    .height-170 {
        max-height: 160px;
        min-height: 160px;
    }

    .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
        border: 1px solid #dddddd;
        padding: 5px;
    }

    .mb-0 {
        margin-bottom: 0px !important;
    }

    p {
        margin: 0px;
    }

    .no-border-top {
        border-top: none !important;
    }
</style>
<div class="row border">
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-left">
        @* <span style=" font-size:30px">@ViewBag.CompanyName</span>*@
        <img src="@imgPath" alt="@ViewBag.SiteIcon" style="max-width:135px;margin-left:0px;margin-top:10px" />
    </div>
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-center">
        <svg id="barcode" jsbarcode-value="@Model.TrackingId" jsbarcode-height="35"></svg>
    </div>
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-right">
        <h2>@Model.ParcelType.TypeName</h2>
        <h3>@Model.DeliveryService.Name</h3>
    </div>
</div>
<div class="row border no-border-top">
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 border">
        <p class="text-center"><b>FROM / CONSIGNOR</b></p>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 border">
        <p class="text-center"><b>TO / CONSIGNEE</b></p>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-left border-top height-120">
        <p><b>Name: </b> @Model.SenderName</p>
        <p><b class="font-weight-bold">Address: </b> @Model.SenderAddress.StreetAddress, @Model.SenderAddress.ZipCode - @Model.SenderAddress.City.Name</p>
        <p><b class="font-weight-bold">Country: </b> @Model.SenderAddress.Country.Name</p>
        <p><b class="font-weight-bold">Tel: </b>@Model.SenderAddress.Mobile</p>
        <p><b class="font-weight-bold">Email: </b>@Model.SenderAddress.Email</p>
    </div>

    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-left border-top height-120">
        <p><b>Name: </b> @Model.ReceiverName</p>
        <p><b>Address: </b> @Model.ReceiverAddress.StreetAddress, @Model.ReceiverAddress.ZipCode - @Model.ReceiverAddress.City.Name</p>
        <p><b>Country: </b>@Model.ReceiverAddress.Country.Name</p>
        <p><b>Tel: </b>@Model.ReceiverAddress.Mobile</p>
        <p><b>Email: </b>@Model.ReceiverAddress.Email</p>
    </div>

</div>
<div class="row border-top">
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 height-100 border text-center">
        <p style="margin-bottom:10px"><b>Conditions of Carriege</b> by tending goods for transport by Smart Courier, the consignor agrees to be bound by Smart Courier Terms and Conditions.</p>

        <table class="table table-borderless table-sm mb-0">
            <tbody>
                <tr>
                    <td class="text-center"><span class="upperline">Shippers Signature</span></td>
                    <td class="text-center"><span class="upperline">Shippers Name</span></td>
                </tr>
            </tbody>
        </table>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-md-left border height-100">
        <b>Special Service/Delivery Instructions</b>

    </div>
</div>
<div class="row border-top">

    <div class="col-md-12 border" style="padding-right:0px;padding-left:0px">
        <table class="table table-bordered" style="margin-bottom:0px">
            <tbody>
                <tr>
                    <td><p><b>Date: </b>@Model.BookingDate.ToString("dddd, dd MMMM yyyy")</p> </td>
                    <td><p><b>Pieces: </b>@Model.TotalPieces</p> </td>
                    <td><p><b>Weight: </b>@Model.TotalWeight Kgs</p> </td>
                </tr>
                <tr>
                    <td><p><b>Ref: </b>@Model.RefNo</p> </td>
                    <td><p><b>Value: </b>@Model.Currency.Code @Model.TotalCost</p> </td>
                    <td><p><b>Dest Code: </b>@Model.ReceiverAddress.City.CityCode</p> </td>

                </tr>
                <tr>
                    <td colspan="2"><p><b>Full Description of Goods: </b>@Model.ItemDescription</p> </td>
                    <td><p><b>Shipping Cost: </b> @Model.TotalCost</p> </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
@*<div class="row border-top">
        <div class="col-md-6 text-md-left border height-170">
            <p style="margin-bottom:70px">Received in Good Order By</p>

            <table class="table table-borderless table-sm">
                <tbody>
                    <tr>
                        <td class="text-center"><span>Name and Signature</span></td>
                        <td class="text-center"><span>Date and Time</span></td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div class="col-md-6 text-center text-md-center border height-170">

        </div>
    </div>*@

<p class="text-right" style="margin-top:5px">customer copy</p>
<hr style="border:1px dotted Black; margin-top:0px" />

<div class="row border">
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-left">
        @* <span style=" font-size:30px">@ViewBag.CompanyName</span>*@
        <img src="@imgPath" style="max-width:135px;margin-left:0px;margin-top:10px" />
    </div>
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-center">
        <svg id="barcode" jsbarcode-value="@Model.TrackingId" jsbarcode-height="35"></svg>
    </div>
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-right">
        <h2>@Model.ParcelType.TypeName</h2>
        <h3>@Model.DeliveryService.Name</h3>
    </div>
</div>
<div class="row border no-border-top">
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 border">
        <p class="text-center"><b>FROM / CONSIGNOR</b></p>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 border">
        <p class="text-center"><b>TO / CONSIGNEE</b></p>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-left border-top height-120">
        <p><b>Name: </b> @Model.SenderName</p>
        <p><b class="font-weight-bold">Address: </b> @Model.SenderAddress.StreetAddress, @Model.SenderAddress.ZipCode - @Model.SenderAddress.City.Name</p>
        <p><b class="font-weight-bold">Country: </b> @Model.SenderAddress.Country.Name</p>
        <p><b class="font-weight-bold">Tel: </b>@Model.SenderAddress.Mobile</p>
        <p><b class="font-weight-bold">Email: </b>@Model.SenderAddress.Email</p>
    </div>

    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-left border-top height-120">
        <p><b>Name: </b> @Model.ReceiverName</p>
        <p><b>Address: </b> @Model.ReceiverAddress.StreetAddress, @Model.ReceiverAddress.ZipCode - @Model.ReceiverAddress.City.Name</p>
        <p><b>Country: </b>@Model.ReceiverAddress.Country.Name</p>
        <p><b>Tel: </b>@Model.ReceiverAddress.Mobile</p>
        <p><b>Email: </b>@Model.ReceiverAddress.Email</p>
    </div>

</div>
<div class="row border-top">
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 height-100 border text-center">
        <p style="margin-bottom:10px"><b>Conditions of Carriege</b> by tending goods for transport by Smart Courier, the consignor agrees to be bound by Smart Courier Terms and Conditions.</p>

        <table class="table table-borderless table-sm mb-0">
            <tbody>
                <tr>
                    <td class="text-center"><span class="upperline">Shippers Signature</span></td>
                    <td class="text-center"><span class="upperline">Shippers Name</span></td>
                </tr>
            </tbody>
        </table>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-md-left border height-100">
        <b>Special Service/Delivery Instructions</b>

    </div>
</div>
<div class="row border-top">

    <div class="col-md-12 border" style="padding-right:0px;padding-left:0px">
        <table class="table table-bordered" style="margin-bottom:0px">
            <tbody>
                <tr>
                    <td><p><b>Date: </b>@Model.BookingDate.ToString("dddd, dd MMMM yyyy")</p> </td>
                    <td><p><b>Pieces: </b>@Model.TotalPieces</p> </td>
                    <td><p><b>Weight: </b>@Model.TotalWeight Kgs</p> </td>
                </tr>
                <tr>
                    <td><p><b>Ref: </b>@Model.RefNo</p> </td>
                    <td><p><b>Value: </b>@Model.Currency.Code @Model.TotalCost</p> </td>
                    <td><p><b>Dest Code: </b>@Model.ReceiverAddress.City.CityCode</p> </td>

                </tr>
                <tr>
                    <td colspan="2"><p><b>Full Description of Goods: </b>@Model.ItemDescription</p> </td>
                    <td><p><b>Shipping Cost: </b> @Model.TotalCost</p> </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
<p class="text-right" style="margin-top:5px">shipper copy</p>
<hr style="border:1px dotted Black; margin-top:0px" />

<div class="row border">
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-left">
        @* <span style=" font-size:30px">@ViewBag.CompanyName</span>*@
        <img src="@imgPath" style="max-width:135px;margin-left:0px;margin-top:10px" />
    </div>
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-center">
        <svg id="barcode" jsbarcode-value="@Model.TrackingId" jsbarcode-height="35"></svg>
    </div>
    <div class="col-md-4 col-sm-4 col-xs-4 col-lg-4 text-right">
        <h2>@Model.ParcelType.TypeName</h2>
        <h3>@Model.DeliveryService.Name</h3>
    </div>
</div>
<div class="row border no-border-top">
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 border">
        <p class="text-center"><b>FROM / CONSIGNOR</b></p>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 border">
        <p class="text-center"><b>TO / CONSIGNEE</b></p>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-left border-top height-120">
        <p><b>Name: </b> @Model.SenderName</p>
        <p><b class="font-weight-bold">Address: </b> @Model.SenderAddress.StreetAddress, @Model.SenderAddress.ZipCode - @Model.SenderAddress.City.Name</p>
        <p><b>State: </b> @Model.SenderAddress.State</p>
        <p><b class="font-weight-bold">Country: </b> @Model.SenderAddress.Country.Name</p>
        <p><b class="font-weight-bold">Tel: </b>@Model.SenderAddress.Mobile</p>
        <p><b class="font-weight-bold">Email: </b>@Model.SenderAddress.Email</p>
    </div>

    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-left border-top height-120">
        <p><b>Name: </b> @Model.ReceiverName</p>
        <p><b>Address: </b> @Model.ReceiverAddress.StreetAddress, @Model.ReceiverAddress.ZipCode - @Model.ReceiverAddress.City.Name</p>
        <p><b>State: </b> @Model.ReceiverAddress.State</p>
        <p><b>Country: </b>@Model.ReceiverAddress.Country.Name</p>
        <p><b>Tel: </b>@Model.ReceiverAddress.Mobile</p>
        <p><b>Email: </b>@Model.ReceiverAddress.Email</p>
    </div>

</div>
<div class="row border-top">
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 height-100 border text-center">
        <p style="margin-bottom:10px"><b>Conditions of Carriege</b> by tending goods for transport by Smart Courier, the consignor agrees to be bound by Smart Courier Terms and Conditions.</p>

        <table class="table table-borderless table-sm mb-0">
            <tbody>
                <tr>
                    <td class="text-center"><span class="upperline">Shippers Signature</span></td>
                    <td class="text-center"><span class="upperline">Shippers Name</span></td>
                </tr>
            </tbody>
        </table>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-6 col-lg-6 text-md-left border height-100">
        <b>Special Service/Delivery Instructions</b>

    </div>
</div>
<div class="row border-top">

    <div class="col-md-12 border" style="padding-right:0px;padding-left:0px">
        <table class="table table-bordered" style="margin-bottom:0px">
            <tbody>
                <tr>
                    <td><p><b>Date: </b>@Model.BookingDate.ToString("dddd, dd MMMM yyyy")</p> </td>
                    <td><p><b>Pieces: </b>@Model.TotalPieces</p> </td>
                    <td><p><b>Weight: </b>@Model.TotalWeight Kgs</p> </td>
                </tr>
                <tr>
                    <td><p><b>Ref: </b>@Model.RefNo</p> </td>
                    <td><p><b>Value: </b>@Model.Currency.Code @Model.TotalCost</p> </td>
                    <td><p><b>Dest Code: </b>@Model.ReceiverAddress.City.CityCode</p> </td>

                </tr>
                <tr>
                    <td colspan="2"><p><b>Full Description of Goods: </b>@Model.ItemDescription</p> </td>
                    <td><p><b>Shipping Cost: </b> @Model.TotalCost</p> </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
<p class="text-right" style="margin-top:5px">office control Copy</p>
@section Scripts {
    <script>
        JsBarcode("#barcode").init();
    </script>
}