@extends('am::layouts.app')

@section('head')
    <!-- DataTable -->
    <link rel="stylesheet" href="{{ url('vendors/dataTable/datatables.min.css') }}" type="text/css">
    <!-- Prism -->
    <link rel="stylesheet" href="{{ url('vendors/prism/prism.css') }}" type="text/css">
    <link rel="stylesheet" href="{{ url('vendors/dropzone/dropzone.css') }}" type="text/css">

    <meta name="csrf-token" content="{{ csrf_token() }}">

@endsection

@section('content')
<div class="page-header">
    <div>
        <h3>Purchase new asset</h3>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item">
                    <a href="#">Home</a>
                </li>
                <li class="breadcrumb-item active" aria-current="page">Purchase new asset</li>
            </ol>
        </nav>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="card ">
            <form method="POST" id="assetrequestForm" enctype="multipart/form-data">
                <div class="card-body">
                           <div class="row">
                                <div class="col-md-6">
                                    <h6 class="card-title" >Fixed Asset Purchase Request</h6>

                                </div>
                                <div class="col-md-6" style="text-align: right">
                                    <button type="button" id="btnaddcomment" class="btn btn-secondary">Add Comment</button>
                                    <div class="dropdown" id="btnaction">
                                        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
                                          Action
                                        </button>
                                        <div class="dropdown-menu">
                                          <a class="dropdown-item" id="requestQuote"  href="#">Request Quotation</a>
                                          <a class="dropdown-item" id="revice" href="#">Revice</a>
                                          <a class="dropdown-item" id="approve" href="#">Approve</a>
                                          <a class="dropdown-item" id="reject" href="#">Reject</a>

                                        </div>
                                      </div>

                                </div>
                           </div>

                    <br>
                    <div>
                        <ul class="nav nav-pills mb-3" role="tablist" id="navMenuItem">
                            <li class="nav-item">
                                <a class="nav-link active" id="pills-site-tab" data-toggle="pill" href="#tbform" role="tab" aria-controls="pills-site" aria-selected="true">Form</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link "  id="pills-site-tab2" data-toggle="pill" href="#tbquote" role="tab" aria-controls="pills-site" aria-selected="false">Quotations</a>
                            </li>

                        </ul>
                    </div>

                    <br>


                    <div class="tab-content">
                        <div class="tab-pane fade show active" id="tbform" role="tabpanel" aria-labelledby="pills-site-tab">
                            <div class="card-body">
                                <h4 class="card-title"></h4>
                                <p class="card-description">  </p>

                                <form id="quoteForm" class="forms-sample">
                                    <input type="hidden" class="form-control" name="hiddenid" id="txthiddenrequestid" placeholder="Purpose">

                                    <div class="form-group">
                                        <label for="exampleInputName1">Requesting From</label>
                                        <select class="form-control" name="RequestFrom" id="cmbRequestFrom">
                                            <option value="0">Undefined</option>
                                        </select>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputName1">Requesting By</label>
                                        <select class="form-control" name="RequestBy" id="cmbRequestBy">
                                            <option value="0">Undefined</option>
                                        </select>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputName1">Request To</label>
                                        <select class="form-control" name="RequestTo" id="cmbRequestTo">
                                            <option value="0">Undefined</option>
                                        </select>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputName1">Approving Authority</label>
                                        <select class="form-control" name="ApproveAuthority" id="cmbApprovingAuth">
                                            <option value="0">Undefined</option>
                                        </select>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputName1">Purpose</label>
                                        <input type="text" class="form-control" name="Purpose" id="txtPurpose" placeholder="Purpose">
                                    </div>
                                    <div class="form-group row">
                                        <label class="col-sm-3 col-form-label">Type Of Purchase Request</label>
                                        <div class="col-sm-4">
                                            <div class="form-check">
                                                <label class="form-check-label">
                                                    <input type="radio" class="form-check-input" name="PurcahseType" id="chkNew" value="new" > New </label>
                                            </div>
                                        </div>
                                        <div class="col-sm-5">
                                            <div class="form-check">
                                                <label class="form-check-label">
                                                    <input type="radio" class="form-check-input" name="PurcahseType" id="chkReplace" value="replace"> Replace </label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputEmail2">Asset Name</label>
                                        <input type="text" class="form-control" id="txtNameOfAsset" name="name" placeholder="Asset Name">
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputEmail2" >No Of Units</label>
                                        <input type="number" class="form-control" id="txtNoOfUnit" name="unit" placeholder="No Of Unit">
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputEmail2">Model</label>
                                        <input type="text" class="form-control" id="txtModel" name="model" placeholder="Model">
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputEmail2">Capacity/ect</label>
                                        <input type="text" class="form-control" id="txtCapacity" name="capasity" placeholder="Capacity/ect">
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputEmail2" >Other</label>
                                        <input type="text" class="form-control" id="txtOther" name="other" placeholder="Other">
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputEmail2" >Cost Of Units</label>
                                        <input type="number" class="form-control" id="txtCostOfUnit" name="cost" placeholder="Cost Of Units">
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleTextarea1">Brief Description For Purchase Justification</label>
                                        <textarea class="form-control" id="txtJustification" name="JustificationDescription" rows="6"></textarea>
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleTextarea1">Impact To The Bussiness/Operation With This Asset</label>
                                        <textarea class="form-control" id="txtImpactTo" name="AssetImpact" rows="6"></textarea>
                                    </div>



                                    <button id="btnsave" type="button" class="btn btn-primary mr-2 mb-4">Save</button>
                                </form>
                                <div class="table-responsive">
                                    <table id="tblcomments" class="table table-striped table-bordered dataTable dtr-inline collapsed" role="grid" aria-describedby="example1_info">
                                        <thead>
                                            <tr>
                                                <th class="thComment">comments</th>
                                            </tr>
                                        </thead>
                                        <tbody></tbody>
                                    </table>
                                </div>
                            </div>

                        </div>
                        <div class="tab-pane fade " id="tbquote" role="tabpanel" aria-labelledby="pills-site-tab">
                            <div class="card-body">
                                <h4 class="card-title"></h4>
                                <p class="card-description">  </p>

                                <form class="forms-sample">

                                    <div class="form-group">
                                        <div class="col-lg-12 grid-margin stretch-card">
                                            <div class="card">
                                                <div class="card-body">
                                                    <h4 class="card-title">Quotation Details</h4>
                                                    <p class="card-description">
                                                        <div class="mb-3">
                                                            <button type="button" id="btnModalQuotation" class="btn btn-primary" data-target="" data-whatever="@getbootstrap" name="save">
                                                                <i class="fa fa-plus" aria-hidden="true"></i>
                                                            </button>
                                                        </div>
                                                    </p>
                                                    <div class="table-responsive">
                                                        <table id="tblquote" class="table table-striped table-bordered dataTable dtr-inline collapsed" role="grid" aria-describedby="example1_info">
                                                            <thead>
                                                                <tr>
                                                                    <th class="thcompany"> Company</th>
                                                                    <th class="thdiscription"> Item Description </th>
                                                                    <th class="thquote"> Price Quoted </th>
                                                                    <th class="edit"> Edit </th>
                                                                    <th class="view"> View </th>
                                                                    <th class="delete"> Delete </th>
                                                                </tr>
                                                            </thead>
                                                            <tbody></tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>


                                </form>
                            </div>
                         </div>

                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- models --}}

<div class="modal fade" id="ModalQuotation">
    <div class="modal-dialog" id="SearchModalDialog">
        <div class="modal-content">
            <div class="modal-header" >
                <h5 id="modal_title" class="modal-title" >Details Of Quotation </h5>
            </div>
            <div class="modal-body" >

                <form class="forms-sample" id="frmquote"  enctype="multipart/form-data" method="post" >
                    <input type="hidden" class="form-control" id="txthiddenrequestidmodel" name="hiddenidmodel" placeholder="Purpose">

                    <div class="form-group row">
                        <label for="exampleInputEmail2" class="col-sm-3 col-form-label">Company</label>
                        <div class="col-sm-9">
                            <input type="text" name="company" class="form-control" placeholder="Company">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="exampleInputEmail2" class="col-sm-3 col-form-label">Item Description</label>
                        <div class="col-sm-9">
                            <input type="text" name="discription" class="form-control" placeholder="Item Description">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="exampleInputEmail2" class="col-sm-3 col-form-label">Warrenty</label>
                        <div class="col-sm-9">
                            <input type="text" name="warrenty" class="form-control"  placeholder="Warrenty">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="exampleInputEmail2" class="col-sm-3 col-form-label">Price Quoted</label>
                        <div class="col-sm-9">
                            <input type="number" name="price" class="form-control"  placeholder="Price Quoted">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-3 col-form-label">Condition</label>
                        <div class="col-sm-3">
                            <div class="form-check">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input" name="Condition" value="New" checked> Brand New </label>
                            </div>
                        </div>
                        <div class="col-sm-3">
                            <div class="form-check">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input" name="Condition"  value="Recondition"> Recondition </label>
                            </div>
                        </div>
                        <div class="col-sm-3">
                            <div class="form-check">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input" name="Condition"  value="Used"> Used </label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-3 col-form-label">Status</label>
                        <div class="col-sm-3">
                            <div class="form-check">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input" name="Status"  value="1" checked> Approve </label>
                            </div>
                        </div>
                        <div class="col-sm-3">
                            <div class="form-check">
                                <label class="form-check-label">
                                    <input type="radio" class="form-check-input" name="Status" value="2"> Reject </label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="exampleInputEmail2" class="col-sm-3 col-form-label">Choose Document</label>
                        <div class="col-sm-9">
                            <div class="dropzone" id="my-dropzone" name="mainFileUploader">
                                <div class="fallback">
                                    <input name="file" type="file" multiple />
                                </div>
                            </div>
                        </div>

                    </div>
                </form>

            </div>
            <div class="modal-footer">
                <button id="addQuatation" type="button" class="btn btn-primary">ADD</button>
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="ModelComment">
    <div class="modal-dialog" id="SearchModalDialog">
        <div class="modal-content">
            <div class="modal-header" >
                <h5 id="modal_title" class="modal-title" >Comments </h5>
            </div>
            <div class="modal-body" >
                <form class="forms-sample" id="frmComment"  enctype="multipart/form-data" method="post" >

                    <div class="form-group row">
                        <label for="exampleInputEmail2" class="col-sm-3 col-form-label">Comment</label>
                        <div class="col-sm-9">
                            <input type="hidden" name="reqidcomment" id="txtreqidcomment" >

                            <input type="text" name="comment" id="txtcomment" class="form-control" placeholder="Write Comment">
                        </div>
                    </div>

                </form>
            </div>
            <div class="modal-footer">
                <button id="btncomment" type="button" class="btn btn-primary">ADD</button>
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
@endsection

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
@section('script')
    <!-- DataTable -->
    <script src="{{ url('vendors/dataTable/datatables.min.js') }}"></script>
    <script src="{{ url('assets/js/examples/datatable.js') }}"></script>
    <script src="{{ url('vendors/dropzone/dropzone.js') }}"></script>
    <!-- Prism -->
    <script src="{{ url('vendors/prism/prism.js') }}"></script>

    <!-- my script  -->
    <script src="{{ Module::asset('am:js/purchasenewassest.js') }}"></script>



@endsection