@extends('layouts.master')

@section('content')

<div class="page-header mb-3">

    <div class="row">

        <div class="col-lg-12 col-md-12 col-12">

            <ul class="breadcrumb">

              <li class="breadcrumb-item">

                  <a href="#">{{ $title }}</a>

              </li>

              <li class="breadcrumb-item active">{{ $subtitle }}</li>

          </ul>

          </div>

    </div>

</div>

<div class="row">

    <div class="col-lg-8 col-12">

      <div class="card mb-4">

        <div class="card-body">

            <form action="{{ route('transaksi-out/save') }}" method="POST" enctype="multipart/form-data">

            @csrf

            <div class="row">

                <div class="col-xl-6">

                    <div class="form-group mb-2">

                        <label class="form-label">Tanggal Transaksi<a class="text-danger">*</a></label>

                        <input type="date" name="tanggal_trans" value="{{ old('tanggal_trans') }}" class="form-control"/>

                    </div>

                </div>

                <div class="col-xl-6">

                    <div class="form-group mb-2">

                        <label class="form-label">Kode Transaksi<a class="text-danger">*</a></label>

                        <input type="text" name="transaksi_code" value="{{ $code_trans }}" class="form-control" readonly/>

                    </div>

                </div>

                <div class="col-xl-6">

                    <div class="form-group mb-2">

                        <label class="form-label">Nama Pegawai<a class="text-danger">*</a></label>

                        <div class="input-group">

                            <select class="form-select select2" name="karyawan_id" id="pegawai">

                                <option>Pilih Pegawai</option>

                                @foreach ($karyawanList as $item)

                                    <option value="{{ $item->id }}" data-email={{ $item->email }} data-hp={{ $item->hp }}>{{ $item->name }}</option>

                                @endforeach

                            </select>

                            <div class="input-group-append">

                                <button class="btn btn-primary" type="button"><a href="{{ route('pegawai/create') }}" class="text-white">Tambah</a></button>

                            </div>

                        </div>

                    </div>

                </div>

                <div class="col-xl-6">

                    <div class="form-group mb-2">

                        <label class="form-label">Email<a class="text-danger">*</a></label>

                        <input type="text" name="email" id="email" class="form-control" readonly />

                    </div>

                </div>

            </div>

          </div>        

      </div>

      <div class="card mb-4">

        <div class="card-body">

            <div class="row">

                <div class="col-xl-6">

                    <div class="form-group mb-2">

                        <label class="form-label">Nama Produk<a class="text-danger">*</a></label>

                        <select class="form-select select2" name="produk_id" id="name">

                        <option>Pilih Produk</option>

                        @foreach ($productList as $item)

                        <option value="{{ $item->id }}" data-product_code={{ $item->product_code }} data-quantity={{ $item->quantity }} 

                            data-categori_id={{ $item->categori->name_categori }} data-brand_id={{ $item->brand->name_brand }} data-unit_id={{ $item->unit->name_unit }}>{{ $item->name_product }}</option>

                        @endforeach

                        </select>

                    </div>

                </div>

                <div class="col-xl-6">

                    <div class="form-group mb-2">

                        <label class="form-label">Kode Produk<a class="text-danger">*</a></label>

                        <input type="text" name="product_code" id="product_code" class="form-control" readonly />

                    </div>

                </div>

            </div> 

          </div>        

      </div>

    </div>

    <div class="col-sm-4">

        <div class="card">

          <div class="card-body">

              <div class="row">

                <div class="col-xl-12">

                    <div class="form-group mb-2">

                        <label class="form-label">Sisa Stok<a class="text-danger">*</a></label>

                        <input type="text" name="stok_awal" id="quantity" class="form-control" readonly />

                    </div>

                    <div class="form-group mb-2">

                        <label class="form-label">Stok Keluar</label>

                        <input type="number" name="stok_keluar" id="stok_keluar" value="{{ old('stok_keluar') }}" class="form-control @error('stok_keluar') is-invalid @enderror"  placeholder="Stok" />

                        @error('stok_keluar')

                            <span class="invalid-feedback" role="alert">

                                <strong>{{ $message }}</strong>

                            </span>

                        @enderror

                    </div> 

                    <div class="form-group mb-2">

                        <label class="form-label">Status Serial Number<a class="text-danger">*</a></label>

                        <select class="form-select" name="is_serial_number">

                          <option selected>Pilih status</option>

                          <option value="1">Ya</option>

                          <option value="2">Tidak</option>

                        </select>

                    </div>  

                </div>

              </div>

          </div>

        </div>

            <div class="d-grid mb-4">

                <button type="submit" class="btn btn-primary mb-2">

                    Proses Transaksi

                </button>

                <a href="{{ route('transaksi-out') }}" class="btn btn-warning">

                    Keluar

                </a>

          </div>

      </div>

    {{-- <div class="col-lg-12 col-12">

        <div class="card mb-4">

          <div class="card-body">

            <div class="table-responsive">

                <table class="table table-stripped">

                    <thead>

                        <tr>

                            <th>No</th>

                            <th>Nama Produk</th>

                            <th>Kategori</th>

                            <th>Unit</th>

                            <th>Brand</th>

                            <th>Stok</th>

                            <th>Status</th>

                            {{-- <th>Date Join</th> 

                            <th class="text-center">Action</th>

                        </tr>

                    </thead>

                    <tbody>

                        <tr>

                            <td colspan="8" class="text-center">Data Masih Kosong</td>

                        </tr>

                    </tbody>

                </table>

            </div>

            </div>        

        </div>

      </div> --}}

    {{-- <div class="col-sm-4">

        <div class="card">

          <div class="card-body">

              <div class="row">

                <div class="col-xl-12">

                        <div class="form-group mb-2">

                          <label class="form-label">Brand<a class="text-danger">*</a></label>

                          <input type="text" name="" id="brand" class="form-control" readonly />

                        </div>

                        <div class="row">

                        <div class="col-xl-9">

                            <div class="form-group mb-2">

                                <label class="form-label">Stok Keluar</label>

                                <input type="number" name="stok_keluar" id="stok_keluar" value="{{ old('stok_keluar') }}" class="form-control @error('stok_keluar') is-invalid @enderror"  placeholder="Stok" />

                                @error('stok_keluar')

                                    <span class="invalid-feedback" role="alert">

                                        <strong>{{ $message }}</strong>

                                    </span>

                                @enderror

                            </div>  

                        </div>

                        <div class="col-xl-3">

                            <div class="form-group mb-2">

                                <label class="form-label">Unit</label>

                                <input type="text" name="" id="unit" class="form-control" readonly />

                            </div>  

                        </div>

                     </div>

                </div>

              </div>

          </div>

        </div>

        <div class="d-grid mb-4">

            <button type="submit" class="btn btn-primary mb-2">

                Proses Transaksi

            </button>

            <a href="{{ route('transaksi-in/detail') }}" type="submit" class="btn btn-warning">

                Keluar

              </a>

          </div>

      </div> --}}

      {{-- <div class="text-end">

        <button type="submit" class="btn btn-primary">

          Simpan Transaksi

        </button>

        <button type="reset" class="btn btn-success">

          Reset

        </button>

        <a href="{{ route('transaksi-out') }}" type="submit" class="btn btn-warning">

          Kembali

        </a>

      </div> --}}

    </form>

  </div>

  @section('script')

  <script>

      $(document).ready(function() {

          $('.select2s-hidden-accessible').select2({

              closeOnSelect: false

          });

      });

  </script>



  <script>

      // select auto id and email

      $('#name').on('change',function()

      {

          $('#product_code').val($(this).find(':selected').data('product_code'));

          $('#quantity').val($(this).find(':selected').data('quantity'));

        //   $('#categori').val($(this).find(':selected').data('categori_id'));

        //   $('#brand').val($(this).find(':selected').data('brand_id'));

          $('#unit').val($(this).find(':selected').data('unit_id'));

      });

  </script>



<script>

    // select auto id and email

    $('#pegawai').on('change',function()

    {

        $('#email').val($(this).find(':selected').data('email'));

        $('#hp').val($(this).find(':selected').data('hp'));

    });

</script>

  @endsection



@endsection