@extends('layouts.layout')

@section('body_class', 'nav-md')

@section('css')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" />
@endsection

@section('body_content')
<div class="container body">
    <div class="main_container">
        @include('includes.sidebar')
        <div class="right_col" role="main">
            <div class="page-title">
                <div class="title_left">
                    <h3>Sales Order Invoice - {{ $so[0]->so_invoice->so->so_code }}</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <ol class="breadcrumb">
                        <li><a href="{{ url('/dashboard') }}">Home</a></li>
                        <li><a href="{{ url('/sales_order') }}">Sales Order</a></li>
                        <li class="active">New</li>
                    </ol>
                </div>
            </div>

			@if(empty($so[0]['so_invoice']['so']['id_campaign']))
			<div class="col-xs-12">
				<div class="x_panel">
					<div class="x_title">
						<h2>Campaign Baru</h2>
						<ul class="nav navbar-right panel_toolbox">
							<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a></li>
						</ul>
						<div class="clearfix"></div>
					</div>
					<div class="x_content">
						<form id="form_so_finance_invoice" class="form-horizontal" method="post">
							<input type="hidden" name="so_id" value="{{ encrypt($so[0]->so_invoice->so->id) }}"/>
							<input type="hidden" name="mso_id" value="{{ encrypt($so[0]->so_invoice->so->id_merchant_so) }}"/>
							<div class="form-group">
								<label class="col-sm-2 control-label">Nama Campaign</label>
								<div class="col-sm-10">
									<input name="campaign_name" class="form-control" required>
								</div>
							</div>

							<!--<div class="form-group">
								<label class="col-sm-2 control-label">Sponsor</label>
								<div class="col-sm-10">
									<input type="hidden" id="sponsor_id" name="sponsor_id"/>
									<input class="form-control" id="sponsor" list="sponsor_list" name="sponsor" autocomplete="off" required>
									<datalist id="sponsor_list">
										@foreach($sponsor as $item)
											<option data-value="{{ encrypt($item->id) }}" value="{{ $item->name }}">
										@endforeach
									</datalist>
								</div>
							</div>-->

							<div class="form-group">
								<label class="col-sm-2 control-label">Berlaku Sampai</label>
								<div class="col-sm-10">
									<input name="valid_to" type="date" class="form-control" required>
								</div>
							</div>

							<div class="form-group">
								<div class="col-xs-2"></div>
								<div class="col-xs-10">
									<div class="alert_placeholder"></div>
								</div>
							</div>

							<div class="form-group">
								<div class="col-sm-offset-2 col-sm-10">
									<div class="text-center loading" style="display:none"><span><i class="fa fa fa-spinner fa-pulse"></i></span></div> <button type="submit" class="btn btn-primary">Simpan</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
			@endif

			<div class="col-xs-12">
				<div class="x_panel">
					<div class="x_title">
						<h2>Invoice List</h2>
						<div class="clearfix"></div>
					</div>
					<div class="x_content">
						<table id="table_so_finance" class="table table-striped table-hover">
							<thead>
								<tr>
									<th>Product Name</th>
									<th class="text-center" width="50">Qty</th>
									<th class="text-center" width="150">SubTotal</th>
								</tr>
							</thead>
							<tbody>
							@php
								$total = 0;
							@endphp
							@foreach($so as $item)
							<tr>
								<td>{!! $item->sku_merchant_so->product_name.' : '.(empty($voucher_list[$item->id_sku_merchant_so]) ? '-' : '<br/>'.$voucher_list[$item->id_sku_merchant_so]) !!}</td>
								<td class="text-center">{{ $item->qty_total }}</td>
								<td class="text-right">@if($item->sku_merchant_so->type==1) {{ number_format($item->sku_merchant_so->price) }} @else {{ '0' }} @endif</td>
							</tr>
							@php
								if($item->sku_merchant_so->type==1) $total += $item->qty_total * $item->sku_merchant_so->price;
							@endphp
							@endforeach
							</tbody>
							<tfoot>
							<tr>
								<td></td>
								<td class="text-center">{{ number_format($so->sum('qty_total')) }}</td>
								<td class="text-right">{{ number_format($total) }}</td>
							</tr>
							<tr>
								<td class="text-right" style="border-top:none">Diskon</td>
								<td style="border-top:none"></td>
								<td class="text-right" style="border-top:none">{{ number_format($so[0]->so_invoice->so->discount) }}</td>
							</tr>
							<tr>
								<td class="text-right" style="border-top:none">Grand Total <sub>(voucher nominal)</sub></td>
								<td style="border-top:none"></td>
								<td class="text-right" style="border-top:none">{{ number_format($total - $so[0]->so_invoice->so->discount) }}</td>
							</tr>
							</tfoot>
						</table>
					</div>
				</div>
			</div>
        </div>
        @include('includes.footer')
    </div>
</div>
@endsection

@section('scripts')
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/cleave.js/1.0.7/cleave.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
<script src="{{ url('/js/sales_order_finance_invoice.js') }}"></script>
@endsection