admin-erahn/resources/views/bajet/tambahbajet.blade.php

@extends('layouts.app')

@section('content')
<div class="bg-gray-900 opacity-50 hidden fixed inset-0 z-10" id="sidebarBackdrop"></div>
<div id="main-content" class="h-full w-full bg-gray-50 relative overflow-y-auto">
   <main>

      <div class="pt-6 px-4">
          
         <breadcrumb :items="[{'title' : 'Bajet', 'icon' : 'fas fa-file-invoice'},{'title' : 'Tambah', 'icon' : 'fas fa-chart-pie'}]"></breadcrumb>

         <div class="bg-white mx-auto shadow rounded-lg p-4 sm:p-6 xl:p-8 w-1/2  2xl:col-span-1">
         
            @if ($errors->any())
               <small class="text-red-500">*Sila pastikan semua petak diisi dengan betul!</small>
            @endif
            
            <h2 class="text-2xl mx-auto font-semibold leading-normal mt-0 mb-2 text-blueGray-800">
               TAMBAH BAJET
            </h2>

            <form name="frmbajet" action="{{ route('bajet.functiontambah') }}" method="post">
               @csrf
               <getkodcaw-component></getkodcaw-component>
            <div class="w-full md:w-2/3 px-3 mb-6 grid grid-cols-2 gap-2">
               <div class="relative">
                 <select name="year" class="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                   <option value="none" selected disabled>Pilih Tahun</option>
                   <option value="2021">2021</option>
                   <option value="2022">2022</option>
                   <option value="2023">2023</option>
                   <option value="2024">2024</option>
                   <option value="2025">2025</option>
                   <option value="2026">2026</option>
                 </select>
                 <div class="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-700">
                   <svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
                 </div>
               </div>

               <div class="relative">
                  <select name="jenisbajet" class="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                    <option value="none" selected disabled>Pilih Jenis Bajet</option>
                    <option value="Gadai">Gadai</option>
                    <option value="Penebusan">Penebusan</option>
                    <option value="Keuntungan">Keuntungan</option>
                    <option value="Bilangan-Gadai">Bilangan Gadai</option>
                    <option value="Bilangan-Tebus">Bilangan Tebus</option>
                  </select>
                  <div class="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-700">
                    <svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
                  </div>
                </div>
            </div>

            <div class="grid grid-cols-2">
               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Januari
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Februari
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Mac
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  April
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Mei
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Jun
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Julai
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Ogos
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  September
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Oktober
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  November
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

               <div class="w-full px-3 mb-4">
                  <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
                  Disember
                  </label>
                  <input name="bajet[]" class="appearance-none block w-full bg-white-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                  {{-- <div class="text-red-500 text-xs italic">Field is required</div> --}}
               </div>

            </div>

            <div class="flex justify-end">
               <button type="submit" class="bg-blue-500 text-white active:bg-lightBlue-600 font-bold uppercase text-sm px-6 py-3 rounded shadow hover:shadow-lg outline-none focus:outline-none mr-1 mb-1 ease-linear transition-all duration-150" type="button">
               Tambah
               </button>
            </div>

         </form>

         </div>


      </div>
   </main>
   @include('layouts.footer')
@endsection