@extends("layouts.app")
@section("css")
<link rel="stylesheet" href="{{ asset('css/pages/create_vouchers.css') }}">
@endsection

@section("content")
<div class="content-wrapper">
    <div class="page-header" style="margin-bottom: 30px;">
        <h3 class="page-title">
            <span class="page-title-icon bg-gradient-primary text-white me-2">
                <i class="mdi mdi-cards-variant menu-icon"></i>
            </span>
            {{ __('Add Voucher') }}
        </h3>
    </div>
    
    <input type="hidden" value="{{ route('dashboard.accounting.voucher.store') }}" data-redirect="index-vocher">
    
    <div class="container">
        <div class="modal-content" style="background: #fbfbfb; box-shadow: 0 15px 30px rgba(0, 0, 0, 0.241);">
            <div class="card-body">
                <ul class="nav nav-pills nav-pills-custom justify-content-center" id="pills-tab" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link active" id="pills-home-tab" data-bs-toggle="pill" href="#pills-health" role="tab" aria-controls="pills-home" aria-selected="true">{{__('Payment voucher data')}}</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="pills-profile-tab" data-bs-toggle="pill" href="#pills-career" role="tab" aria-controls="pills-profile" aria-selected="false">{{__('Receipt voucher data')}}</a>
                    </li>
                </ul>
                <div class="tab-content tab-content-custom-pill" id="pills-tabContent">
                    <div class="tab-pane fade show active" id="pills-health" role="tabpanel" aria-labelledby="pills-home-tab">
                        <form id="receiptVoucherForm" method="post" action="{{ route('dashboard.accounting.voucher.store') }}">
                            @csrf
                            <input type="hidden" name="voucher_type" value="receipt">
                            <div class="row">
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('from user') }}</label>
                                    <input class="form-control" type="text" name="from_user">
                                </div>
                                
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('the value') }}</label>
                                    <input class="form-control" type="number" name="amount" step="0.001">
                                </div>
                                
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('transaction details') }}</label>
                                    <input class="form-control" type="text" name="transaction_details">
                                </div>
                                
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('signatory name') }}</label>
                                    <input class="form-control" type="text" name="signatory_name">
                                </div>
                            </div>
                            <div class="mb-3 mx-1 row justify-content-between">
                                <button type="submit" class="btn btn-primary col-md-2">{{ __('Submit') }}</button>    
                            </div>
                        </form>
                    </div>
                    
                    <div class="tab-pane fade" id="pills-career" role="tabpanel" aria-labelledby="pills-profile-tab">
                        <form id="paymentVoucherForm" method="post" action="{{ route('dashboard.accounting.voucher.store') }}">
                            @csrf
                            <input type="hidden" name="voucher_type" value="payment">
                            <div class="row">
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('to user') }}</label>
                                    <input name="to_user" class="form-control" type="text">
                                </div>
                                
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('the value') }}</label>
                                    <input name="amount" class="form-control" type="number" step="0.001">
                                </div>
                                
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('accountant name') }}</label>
                                    <input name="accountant" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('cashier name') }}</label>
                                    <input name="cashier" class="form-control" type="text">
                                </div>
                                
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('financial manager') }}</label>
                                    <input name="financial_manager" class="form-control" type="text">
                                </div>
                                
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('transaction details') }}</label>
                                    <input name="transaction_details" class="form-control" type="text">
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group my-3 col-md-4">
                                    <label class="required">{{ __('signatory name') }}</label>
                                    <input name="signatory_name" class="form-control" type="text">
                                </div>
                                
                                <div class="mb-3 mx-1 row justify-content-between">
                                    <button type="submit" class="btn btn-primary col-md-2">{{ __('Submit') }}</button>    
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section("scripts")
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script type="module" src="{{asset('assets/js/pages/create-voucher.js')}}"></script>
@endsection