@props(['additional_costs', 'case_id'])
<div class="mt-4 border-3 border-slate-600 rounded-xl px-5 pb-6">
    <div class="font-bold text-xl mt-2">Dodatkowe koszty, rabaty</div>

    <div class="bg-slate-300 rounded-lg p-4 my-4">

        <form action="{{ route('office.cases.update.summary_additional_cost') }}" method="post" class="flex items-center space-x-4">@csrf

            <input type="hidden" name="case_id" value="{{ $case_id }}">
            <div class="flex flex-col w-1/12">
                <label for="type" class="text-sm font-medium mb-1">Typ</label>
                <select id="type" name="type" class="border border-slate-300 rounded px-2 py-1 bg-white">
                    <option value="cost" @if(old('type')=='cost') selected @endif>Koszt</option>
                    <option value="discount" @if(old('type')=='discount') selected @endif>Rabat</option>
                </select>
            </div>

            <div class="flex flex-col w-1/12">
                <label for="value" class="text-sm font-medium mb-1">Kwota</label>
                <input type="text" id="value" name="value" value="{{ old('value') }}" class="border border-slate-300 rounded px-2 py-1 bg-white" />
            </div>

            <div class="flex flex-col w-8/12">
                <label for="description" class="text-sm font-medium mb-1">Opis</label>
                <input type="text" id="description" name="description" value="{{ old('description') }}" class=" border border-slate-300 rounded px-2 py-1 bg-white" />
            </div>

            <button type="submit" class="mt-6 btn_gray btn_lg">Dodaj</button>
        </form>

    </div>

    @if(!empty($additional_costs['costs']))
    <table class="border w-full">
        <thead class="bg-slate-500 text-center text-white">
        <tr>
            <th class="p-1 font-normal border-l border-slate-400">#</th>
            <th class="p-1 font-normal border-l border-slate-400">Kosz/Rabat</th>
            <th class="p-1 font-normal border-l border-slate-400">Kwota</th>
            <th class="p-1 font-normal border-l border-slate-400 w-2/3">Opis</th>
            <th></th>
        </tr>
        </thead>
        @foreach($additional_costs['costs'] as $index=>$ac)
            <tbody>
            <tr class="border-b border-slate-200">
                <td class="px-2 border-l border-slate-200">{{ $index+1 }}</td>
                <td class="px-2 border-l border-slate-200">{{ __('office.summary.'.$ac['type']) }}</td>
                <td class="px-2 border-l border-slate-200 text-right">{{ price_format($ac['value']) }}</td>
                <td class="px-2 border-l border-slate-200">{{ $ac['description'] }}</td>
                <td class="px-2 border-l border-slate-200">
                    <a class="btn_md btn_red delete_confirm_button" data-id_key="{{ $ac['id'] }}"
                       data-display_text="{{ __('office.summary.'.$ac['type']) }}: {{ $ac['description'] }}">
                        Usuń
                    </a>
                </td>
            </tr>
            </tbody>
        @endforeach
        <tfoot>
        <tr class="bg-slate-500 text-white">
            <td colspan="2"></td>
            <td class="text-right">Suma: {{ price_format($additional_costs['costs_sum']) }}</td>
            <td colspan="2"></td>
        </tr>
        </tfoot>
    </table>
    @endif
</div>

@push('modal')

    <x-modal.modal-delete-confirm-component modalRoute="{{ route('office.cases.delete.remove_additional_cost') }}"/>

@endpush