@extends('booth.layouts.app')
@section('title', 'Booth - Create Requirement')
@section('content')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.14.0-beta2/css/bootstrap-select.min.css" integrity="sha512-mR/b5Y7FRsKqrYZou7uysnOdCIJib/7r5QeJMFvLNHNhtye3xJp1TdJVPLtetkukFn227nKpXD9OjUc09lx97Q==" crossorigin="anonymous"
referrerpolicy="no-referrer" />
<style>
    .bootstrap-select>select.bs-select-hidden, select.bs-select-hidden, select.selectpicker {
     display: block !important;
}
</style>
    <div class="page-wrapper">
        <!-- ============================================================== -->
        <!-- Container fluid  -->
        <!-- ============================================================== -->
        <div class="container-fluid">
            <!-- ============================================================== -->
            <!-- Bread crumb and right sidebar toggle -->
            <!-- ============================================================== -->
            <div class="row page-titles">
                <div class="col-md-5 align-self-center">
                    <h4 class="text-themecolor">Add Requirement</h4>
                </div>
                <div class="col-md-7 align-self-center text-right">
                    <div class="d-flex justify-content-end align-items-center">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="{{route('booth.index')}}">Home</a></li>
                            <li class="breadcrumb-item">Add Requirement</li>
                        </ol>
                        <!-- <button type="button" class="btn btn-info d-none d-lg-block m-l-15"><i class="fa fa-plus-circle"></i> Create New</button> -->
                    </div>
                </div>
            </div>
            <!-- ============================================================== -->
            <!-- End Bread crumb and right sidebar toggle -->
            <!-- ============================================================== -->
            <div class="row">
                <div class="col-lg-12">
                    <!-- <div class="tabs-container">-->
                    <!-- <ul class="nav nav-tabs">
                            <li class="active"><a data-toggle="tab" href="#tab-1"><i class="fa fa-hand-o-down"></i>
                                    Caste Report</a></li>
                        </ul>  -->
                    <div class="ibox-title">
                        <h5><span> Add Requirement</span></h5>
                        <!-- <div class="ibox-tools">
                                <a class="collapse-link">
                                    <i class="fa fa-chevron-up"></i>
                                </a>
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                    <i class="fa fa-wrench"></i>
                                </a>
                                <a class="close-link">
                                    <i class="fa fa-times"></i>
                                </a>
                            </div> -->
                    </div>
                    <div class="ibox-content">
                            <form action="{{ route('requirement.store') }}" method="post" class="form-horizontal" enctype="multipart/form-data">
                                @csrf
                            <div class="form-group d-flex">
                                <label class="col-lg-3 control-label">Select Category<span
                                        class="text-danger">*</span></label>
                                <div class="col-lg-5">
                                    {!! Form::select('category_name',[''=>'--Select Cotegory --']+$category,old('category_name'),array('class'=>'form-control chosen','id'=>'category_id'))  !!}
                                    <div class="text-danger">{{ $errors->first('category_name')}}</div>
                                </div>
                            </div>
                            <div class="form-group d-flex">
                                <label class="col-lg-3 control-label">Quantity<span
                                        class="text-danger">*</span></label>
                                <div class="col-lg-5">
                                    <input type="text" name="quantity" class="form-control number"
                                        autocomplete="off" placeholder="Quantity">
                                        <div class="text-danger">{{ $errors->first('quantity')}}</div>
                                </div>
                            </div>
                            <div class="form-group d-flex">
                                <label class="col-lg-3 control-label">Date<span
                                        class="text-danger">*</span></label>
                                <div class="col-lg-5">
                                   
                                        <input type="date"  id="txtDate" class="form-control" name="date" placeholder="Select suitable date" />
                                        <div class="text-danger">{{ $errors->first('date')}}</div>
                                </div>
                            </div>
                            <div class="form-group d-flex">
                                <label class="col-lg-3 control-label">Remark<span
                                        class="text-danger">*</span></label>
                                <div class="col-lg-5">
                                        <textarea class="form-control"  name="remark" id="exampleFormControlTextarea1" rows="10" placeholder="Remark"></textarea>
                                        <div class="text-danger">{{ $errors->first('remark')}}</div>
                                </div>
                            </div>
                         
                           
                            <div class="form-group d-flex">
                                <div class="col-lg-3">
                                </div>
                                <div class="col-lg-5">
                                    <input type="submit" class="btn btn-primary pull-right bt-block" name="add_meeting"
                                        value="Save">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>

            </div>
        </div>



    </div>
    <script src="https://code.jquery.com/jquery-3.7.0.min.js" integrity="sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.14.0-beta2/js/bootstrap-select.min.js"></script>

    <script>
        $('.number').keyup(function(e) {
            if (/\D/g.test(this.value)) {
                this.value = this.value.replace(/\D/g, '');
            }
        });
    </script>
    
    <script>
    $(function() {
    
    $('.string').keydown(function (e) {
    
    if (e.shiftKey || e.ctrlKey || e.altKey) {
    
      e.preventDefault();
    
    } else {
    
      var key = e.keyCode;
    
      if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90))) {
    
        e.preventDefault();
    
      }
    
    }
    
    });
    
    });
    </script>
    <script> 
    var today = new Date().toISOString().split('T')[0];
     document.getElementsByName("date")[0].setAttribute('min', today);
</script>
    @endsection