{{-- Part of phoenix project. --}}

@extends('_global.user.frame')

@section('user-content')
    <style>
        .invoice-paper {
            border : 1px solid #ddd;
            padding : 20px 20px;;
        }
        .bs-callout {
            padding: 20px;
            margin: 20px 0;
            border: 1px solid #eee;
            border-left-width: 5px;
            background-color: #ffffff;
            border-radius: 3px;
        }
        em.price {
            float: right;
        }
        .money {
            box-sizing: border-box;
        }
        .money tr td:first-child {
            padding-right : 1em;
            text-align: right;
        }
        legend{
            color: #73879C;
        }
        fieldset{
            margin-bottom: 15px;
        }
    </style>
    {{--<script>--}}
        {{--$(document).ready(function(){--}}
            {{--$('#print').click(function(){--}}
                {{--console.log("gan!");--}}
                {{--w=window.open();--}}
                {{--w.document.write($('.invoice-paper').html());--}}
                {{--w.print();--}}
                {{--w.close();--}}
            {{--});--}}
        {{--});--}}


    {{--</script>--}}
    {{--Title & toolbar row--}}

    <div class="row">
        <div class="col-md-4 not-print">
            <h1>@translate('catalog.invoice.title')</h1>
        </div>
        <div class="col-md-8 not-print">
            <button id="print" class="btn pull-right" onclick="window.print();">
                @translate('catalog.invoice.print.button')
            </button>
            <a class="btn btn-default pull-right" style="margin-right: 20px;" href="{{ $router->html('orders') }}">
                @translate('catalog.invoice.back.to.order.button')
            </a>
        </div>
    </div>

    {{--Invoice row--}}
    <div class="invoice-paper">
        <div class="row">
            <div class="col-md-7">
                <fieldset class="form-horizontal" >
                    <legend>
                        Datavideo Visual Technology(s) Pte. Ltd.
                    </legend>
                    <dl class="pretty-dl" style="font-size: 14px;">
                        <dt>
                            @translate('catalog.invoice.field.name')
                        </dt>
                        <dd>
                            {{ $app->get('datavideo.name') ? : 'Datavideo Virtual Set' }}
                        </dd>

                        <dt>
                            @translate('catalog.invoice.field.email')
                        </dt>
                        <dd>
                            {{ $app->get('datavideo.mail.contact') ? : 'info.datavideo.com' }}
                        </dd>
                    </dl>
                </fieldset>

                <fieldset class="form-horizontal">
                    <legend>@sprintf('catalog.invoice.to.title', $item->name)</legend>

                    <dl class="pretty-dl" style="font-size: 14px;">
                        <dt>
                            @translate('catalog.invoice.field.name')
                        </dt>
                        <dd>
                            {{ $item->name }}
                        </dd>
                        <dt>
                            @translate('catalog.invoice.field.email')
                        </dt>
                        <dd>
                            {{ $item->email }}
                        </dd>
                        @if($item->address1)
                            <dt>
                                @translate('catalog.invoice.field.address')
                            </dt>
                            <dd>
                                {{ $item->address1 }}
                            </dd>
                        @endif

                    </dl>
                </fieldset>
            </div>
            <div class="col-md-5 text-right">
                <dl class="pretty-dl" style="font-size: 14px;">
                    <dt>
                        @translate('catalog.invoice.field.date')
                    </dt>
                    <dd>
                        {{ $item->paid_time }}
                    </dd>
                    <dt>
                        @translate('catalog.order.field.id')
                    </dt>
                    <dd>
                        {{ $item->id }}
                    </dd>
                </dl>
            </div>
        </div>

        <div class="row">
            <div class="col-md-11">
                <div class="orderitems-wrapper">
                    <legend>Details</legend>
                    @foreach($item->orderItems as $detail)
                        <div class="bs-callout">
                            {{ $detail->title }} - {{ $detail->format_title }} - {{ $detail->width }} x {{ $detail->height }}
                            <em class="price">$ {{ $detail->price }}
                                &nbsp;
                                &nbsp;
                            </em>

                        </div>
                    @endforeach
                    <legend></legend>
                    <div class="row">
                        <div class="col-md-6 col-md-push-8">
                            <table class="money">
                                <tbody>
                                <tr>
                                    <td><h4>@translate('catalog.price.total')</h4></td>
                                    <td><h4>$ {{ $item->total }}</h4></td>
                                </tr>

                                @if ($item->total - $item->amount > 0)
                                    <tr>
                                        <td><h4>@translate('catalog.price.discount')</h4></td>
                                        <td><h4>$ {{ $item->total - $item->amount }}</h4></td>
                                    </tr>
                                @endif

                                <tr>
                                    <td><h4>@translate('catalog.price.amount')</h4></td>
                                    <td class="text-danger"><h4>$ {{ $item->amount }}</h4></td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@stop