@extends('template.navbar')
@section('document_title')
    <h4 class="font-weight-bolder text-white mb-0 text-capitalize">purchase order Form</h4>
@endsection
@extends('master')
@section('css')
    <style>
        .demo-animals .scientific {
            font-weight: normal;
            opacity: 0.3;
            margin: 0 0 0 2px;
        }

        .demo-animals .scientific::before {
            content: '(';
        }

        .demo-animals .scientific::after {
            content: ')';
        }

        .table tbody tr:last-child td {
            border-width: 1 !important;
        }
    </style>
@endsection
@section('content')
    <form action="{{ route('pr.store') }}" method="POST" id="form_tambah_edit" class="text-capitalize">
        <div class="form-group">
            <input type="hidden" name="_token" value="{{ csrf_token() }}" />
            <input type="hidden" name="_method" value="POST" />
            <input type="hidden" name="kd_permohonan_pembelian" value="">
            <input type="hidden" id="detail_count" value="0">
        </div>

        <div class="row mb-3">
            <div class="col-md-9">
                <div class="card h-100 mb-3">
                    <div class="card-body">
                        <div class="row row-cols-1 row-cols-md-3">
                            <div class="col">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="exampleFormControlInput1">PR No.</label>
                                            <br>
                                            <label class="fw-bolder font-italic mb-md-0"
                                                id="no_permohonan_pembelian">PR123456789</label>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="exampleFormControlInput1">PR date</label>
                                            <br>
                                            <label class="fw-bolder font-italic mb-md-0"
                                                id="no_permohonan_pembelian">24/10/1996</label>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group mb-md-0">
                                    <label for="exampleFormControlInput1">transaction date</label>
                                    <input type="date" class="form-control form-control-sm"
                                        name="tgl_permohonan_pembelian" id="tgl_document" placeholder="name@example.com"
                                        value="{{ $sld_now }}">
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label class="form-label mb-1">
                                        branch
                                    </label>
                                    <select name="kd_cabang" id="kd_cabang" class="form-select form-select-sm"
                                        data-control="select2" data-hide-search="true">
                                    </select>
                                </div>
                                <div class="form-group mb-md-0">
                                    <label class="form-label mb-1">
                                        supplier
                                    </label>
                                    <select name="kd_cabang" id="kd_cabang" class="form-select form-select-sm"
                                        data-control="select2" data-hide-search="true">
                                    </select>
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label class="form-label mb-1">
                                        prepared by
                                    </label>
                                    <select name="kd_karyawan_01" id="kd_karyawan_01" class="form-select form-select-sm"
                                        data-control="select2" data-hide-search="true">
                                    </select>
                                </div>
                                <div class="form-group mb-md-0">
                                    <label class="form-label mb-1">
                                        approved by
                                    </label>
                                    <select name="kd_karyawan_02" id="kd_karyawan_02" class="form-select form-select-sm"
                                        data-control="select2" data-hide-search="true">
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card h-100 mb-3">
                    <div class="card-body">
                        <div class="form-group mb-md-0">
                            <label class="form-label mb-1 text-capitalize">
                                remark
                            </label>
                            <textarea class="form-control" id="exampleFormControlTextarea1" rows="4"></textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row mb-3">
            <div class="col-md-4">
                <div class="card mb-3">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-6">
                                <div class="form-group">
                                    <label class="form-label mb-1">
                                        currency
                                    </label>
                                    <select name="kd_mata_uang" id="kd_mata_uang" class="form-select form-select-sm"
                                        data-control="select2" data-hide-search="true">
                                    </select>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="form-group">
                                    <label class="form-label mb-1">
                                        kurs
                                    </label>
                                    <input type="text" class="form-control form-control-sm" id="exampleFormControlInput1"
                                        placeholder="name@example.com">
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="form-label mb-1 text-center">
                                term
                            </label>
                            <div class="d-grid gap-2">
                                <div class="btn-group btn-group-sm" role="group" aria-label="Basic example">
                                    <input type="radio" class="btn-check" name="options-outlined"
                                        id="success-outlined" autocomplete="off">
                                    <label class="btn btn-outline-success btn-sm" for="success-outlined">cash</label>

                                    <input type="radio" class="btn-check" name="options-outlined" id="danger-outlined"
                                        autocomplete="off">
                                    <label class="btn btn-outline-danger btn-sm" for="danger-outlined">credit</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-8">
                <div class="card">
                    <div class="card-body">
                        <div class="row row-cols-1 row-cols-md-4">
                            <div class="col">
                                <div class="form-group">
                                    <label class="form-label mb-1">
                                        total
                                    </label>
                                    <input type="text" class="form-control form-control-sm"
                                        id="exampleFormControlInput1" placeholder="name@example.com">
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label class="form-label mb-1">
                                        tax
                                    </label>
                                    <input type="text" class="form-control form-control-sm"
                                        id="exampleFormControlInput1" placeholder="name@example.com">
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label class="form-label mb-1">
                                        expense
                                    </label>
                                    <input type="text" class="form-control form-control-sm"
                                        id="exampleFormControlInput1" placeholder="name@example.com">
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group">
                                    <label class="form-label mb-1">
                                        rounding
                                    </label>
                                    <input type="text" class="form-control form-control-sm"
                                        id="exampleFormControlInput1" placeholder="name@example.com">
                                </div>
                            </div>
                        </div>
                        <div class="form-floating mb-3">
                            <input type="text" class="form-control bg-light-success text-success text-end readonly"
                                id="grand_total_str" style="font-size: 2rem" placeholder="Password" value="100000000">
                            <label class="text-capitalize" for="keterangan">grand total</label>
                        </div>
                    </div>
                </div>
            </div>
        </div>



        <div class="card mb-3">
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table table-bordered">
                        <thead>
                            <tr>
                                <th scope="col">Column 1</th>
                                <th scope="col">Column 2</th>
                                <th scope="col">Column 3</th>
                                <th scope="col">Column 1</th>
                                <th scope="col">Column 2</th>
                                <th scope="col">Column 3</th>
                                <th scope="col">Column 1</th>
                                <th scope="col">Column 2</th>
                                <th scope="col">Column 3</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                            </tr>
                            <tr>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                            </tr>
                            <tr>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                            </tr>
                            <tr>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                            </tr>
                            <tr>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                                <td>snasfjoklsnda</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>


        <div class="row mb-3">
            <div class="col-md-4">
                <div class="card">
                    <div class="card-body">
                        <div class="row mb-0">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="exampleFormControlInput1">PR No.</label>
                                    <br>
                                    <label class="fw-bolder font-italic" id="no_permohonan_pembelian">PR123456789</label>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="exampleFormControlInput1">PR date</label>
                                    <br>
                                    <label class="fw-bolder font-italic" id="no_permohonan_pembelian">24/10/1996</label>
                                </div>
                            </div>
                        </div>
                        <hr class="mb-3 mt-0">
                        <div class="form-group mb-0">
                            <label for="exampleFormControlInput1">transaction date</label>
                            <input type="date" class="form-control form-control-sm" name="tgl_permohonan_pembelian"
                                id="tgl_document" placeholder="name@example.com" value="{{ $sld_now }}">
                        </div>

                        <hr class="mb-3 mt-0">

                    </div>
                </div>
            </div>
            <div class="col-md-8">
                <div class="card">
                    <div class="card-body">
                        <div class="form-group">
                            <label for="exampleFormControlTextarea1">remark</label>
                            <textarea class="form-control" id="exampleFormControlTextarea1" name="keterangan_head"></textarea>
                        </div>
                        <div class="d-grid gap-2">
                            <button type="button" id="input_product" class="btn text-capitalize bg-gradient-info">
                                add product
                            </button>
                        </div>

                        <hr>
                        <div class="row row-cols-1 row-cols-md-2" id="detail_card">
                            {{-- <div class="cols">
                                <div class="card">
                                    <div class="card-body">
                                        <h5 class="text-center">nama_barang</h5>
                                        <h6 class="mb-0 text-center">no_barang / nama_merk_barang</h6>
                                        <hr>
                                        <div class="form-group mb-1">
                                            <label class="form-label mb-1">
                                                qty
                                            </label>
                                            <div class="input-group">
                                                <input type="text" class="form-control"
                                                    placeholder="Recipient's username" aria-label="Recipient's username"
                                                    aria-describedby="basic-addon2">
                                                <span class="input-group-text" id="basic-addon2">satuan</span>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label for="exampleFormControlTextarea1">remark</label>
                                            <textarea class="form-control" id="exampleFormControlTextarea1"></textarea>
                                        </div>
                                    </div>
                                </div>
                            </div> --}}
                        </div>
                        <hr>
                        <div class="d-grid gap-2">
                            <button type="submit" class="btn text-capitalize bg-gradient-success">
                                save
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </form>

    <div class="card mb-4">
        <div class="card-body">

            <div class="row row-cols-1 row-cols-md-3 text-capitalize">
                <div class="col">
                    <div class="form-group col-md-6">
                        <label for="exampleFormControlInput1">transaction date</label>
                        <input type="date" class="form-control form-control-sm" id="exampleFormControlInput1"
                            placeholder="name@example.com">
                    </div>
                    <div class="form-group">
                        <label class="form-label mb-1">
                            branch
                        </label>
                        <select name="kd_cabang" id="kd_cabang" class="form-select form-select-sm"
                            data-control="select2" data-hide-search="true">
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="form-label mb-1">
                            supplier
                        </label>
                        <select name="kd_cabang" id="kd_cabang" class="form-select form-select-sm"
                            data-control="select2" data-hide-search="true">
                        </select>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="exampleFormControlInput1">PR No.</label>
                                <input type="text" class="form-control form-control-sm" id="exampleFormControlInput1"
                                    placeholder="name@example.com">
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="exampleFormControlInput1">PR date</label>
                                <input type="text" class="form-control form-control-sm" id="exampleFormControlInput1"
                                    placeholder="name@example.com">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col">
                    <div class="row">

                    </div>
                    <div class="form-group">
                        <label class="form-label mb-1 text-center">
                            term
                        </label>
                        <div class="d-grid gap-2">
                            <div class="btn-group" role="group" aria-label="Basic example">
                                <input type="radio" class="btn-check" name="options-outlined" id="success-outlined"
                                    autocomplete="off">
                                <label class="btn btn-outline-success btn-sm" for="success-outlined">cash</label>

                                <input type="radio" class="btn-check" name="options-outlined" id="danger-outlined"
                                    autocomplete="off">
                                <label class="btn btn-outline-danger btn-sm" for="danger-outlined">credit</label>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="col">
                    <div class="form-group">
                        <label class="form-label mb-1">
                            prepared by
                        </label>
                        <select name="kd_karyawan_01" id="kd_karyawan_01" class="form-select form-select-sm"
                            data-control="select2" data-hide-search="true">
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="form-label mb-1">
                            approved by
                        </label>
                        <select name="kd_karyawan_02" id="kd_karyawan_02" class="form-select form-select-sm"
                            data-control="select2" data-hide-search="true">
                        </select>
                    </div>
                </div>
                {{-- <div class="col">
                    <div class="row row-cols-1 row-cols-md-2">
                        <div class="col">

                        </div>
                        <div class="col">
                            <div class="form-group">
                                <label for="exampleFormControlInput1">require date</label>
                                <input type="date" class="form-control form-control-sm" id="exampleFormControlInput1"
                                    placeholder="name@example.com">
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="exampleFormControlInput1">branch</label>
                        <input type="date" class="form-control form-control-sm" id="exampleFormControlInput1"
                            placeholder="name@example.com">
                    </div>
                </div> --}}

            </div>

            {{-- <div class="table-responsive">
                <table class="table align-items-center table-sm" id="transaction_table">
                    <thead class="text-capitalize bg-gradient-secondary">
                        <tr>
                            <th rowspan="2" scope="col" class="text-light">purchase order no.</th>
                            <th rowspan="2" class="text-light">date</th>
                            <th colspan="2" class="text-light text-center">status</th>
                            <th rowspan="2" class="text-light">grand total</th>
                            <th rowspan="2" class="text-light">Remark</th>
                            <th rowspan="2"></th>
                            <th rowspan="2"></th>
                            <th rowspan="2"></th>
                        </tr>
                        <tr>
                            <th class="text-light">close</th>
                            <th class="text-light">approval</th>
                        </tr>

                    </thead>
                </table>
            </div> --}}

        </div>

    </div>
    @include('content.modal.modal_outstanding_pr')
@endsection
@section('script')
    @include('content.transaction.PO.create.script')
@endsection