@extends('adminlayout.dashadmin')

@section('content')

<style >
  section .due_sec{
   margin: 10px 0px 10px 15px;
   
 }
 div .due_content{
   display: inline-block;
   border-radius: 10px;
   padding: 10px 15px 10px 15px;
 }
 div .due_warning{
  background-color: #bcfbaf;
}
div .due_success{
  background-color:#f9e1c0 ;
}
div  .due_primary{
  background-color: #b9e5f0;
}
</style>

<!-- Content Wrapper Start -->
<div class="content-wrapper" ng-controller="PurchaseController">

  <br><br>
  <div class="box box-info collapsed-box">
    <div class="box-header with-border">
      
      <div style="float:right;">
          <a class="btn btn-lg btn-info" data-toggle="modal" data-target="#new_particular">Create New particular</a>
        <a class="btn btn-lg btn-info" data-toggle="modal" data-target="#new_entry">Create New Entry</a>
      </div>
    </div>
  </div>
  
  <!-- Modal for Adding New Particulars -->
<div class="modal fade" id="new_particular" tabindex="-1" role="dialog" aria-labelledby="add_productLabel" aria-hidden="true">
  
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="add_productLabel">New Particular</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
          </button>
        </div>
        <form id="particulars-form" class="form-horizontal" action="#" method="post" enctype="multipart/form-data">
    @csrf
        <div class="modal-body">
          <div class="row">
            <div class="col-sm-6">
              <label for="name" class="control-label">Particular Name<i class="required">*</i></label>
              <input type="text" class="form-control" id="name" name="name" placeholder="Type name" required>
              <span class="text-danger"></span>
            </div>
            
          </div>
        </div>
        <div class="modal-footer" style="text-align: center;">
                  <button class="btn btn-lg btn-info" name="submit" data-loading-text="Processing...">
                    <i class="fa fa-fw fa-save"></i>
                      Submit        </button>
                </div>
        </form>
            

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

<!-- Modal for Adding New Particulars -->
<div class="modal fade" id="new_entry" tabindex="-1" role="dialog" aria-labelledby="add_productLabel" aria-hidden="true">
  
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="add_productLabel">New Entry</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
          </button>
        </div>
        <form id="particulars-form" class="form-horizontal" action="#" method="post" enctype="multipart/form-data">
    @csrf
        <div class="modal-body">
          <div class="row">
             
            <div class="col-sm-12">
              <label for="slug" class="control-label">Entry Type<i class="required">*</i></label>
              <select class="form-control" name="particulars[]" required="">
                <option value="">--Select--</option>
                <option value="Contra`">Contra`</option>
                <option value="Credit Note">Credit Note</option>
                <option value="CASH">CASH</option>
                <option value="Debit Note">Debit Note</option>
                <option value="Delivery Note">Delivery Note</option>
                <option value="Journal`">Journal`</option>
                <option value="Payment">Payment</option>
                <option value="CASH">CASH</option>
                <option value="Purchase">Purchase</option>
                <option value="Receipt">Receipt</option>
                <option value="Sales">Sales</option>
                <
               </select>
            </div>
          </div>
        </div>
        <div class="modal-footer" style="text-align: center;">
                  <button class="btn btn-lg btn-info" name="submit" data-loading-text="Processing...">
                    <i class="fa fa-fw fa-save"></i>
                      Create        </button>
                </div>
        </form>
            

      </div>
    </div>
  
</div>
<section class="content">


  <!-- <div class="box box-info collapsed-box">
    <div class="box-header with-border">
      <form>
       <h3 class="box-title"> From : </h3>
         <input type="date" name="from" value="" required> 
          <h3 class="box-title"> to</h3>
         <input type="date" name="to" value="" required>        
         <button><i class="fa fa-fw fa-search"></i></button>
      </form>
      </div>

      


 </div> -->

 <div class="row">
  <div class="col-xs-12">
    <div class="box box-success">
      <div class="box-header">
        <h3 class="box-title">
        <b>LIST OF Payments     </h3>
          <form>
            <div class="text-right"> 
               From :      
              <input type="date" name="from" value=""> 
              <h3 class="box-title"> to</h3>
               <input type="date" name="to" value="">

                 
               <button style="height: 30px;"><i class="fa fa-fw fa-search"></i></button>
                  </div>
          </form>
      </div>
      <div class="box-body">
         <div class="col-lg-12 col-xs-12">
                              <div class="table-responsive" style="min-height:166px">
                                  <table class="table table-striped no-margin">
                                  <thead>
                                   
                                    <tr class="bg-gray">
                                      <th class="text-left ">DATE</th>
                                       <th class="text-left ">PARTICULARS</th>
                                       <th class="text-left ">VCH TYPE.</th>
                                       <th class="text-left ">VCH NO.</th>
                                       <th class="text-left ">DEBIT</th>
                                       <th class="text-left ">CREDIT</th>
                                    </tr>
                                  </thead>
                                   
                                  <tbody>
                                    <tr style="font-size: 14px;">
                                      <td class="text-left" ><a href="{{route('payment_voucher')}}"><span >2024-10-08 </span></a></td>
                                      <td>UBI SAVING ACC</td>
                                      <td>Payment</td>
                                      <td>213</td>
                                      <td>1010000</td>
                                      <td></td>
                                    </tr>
                                    
                                    

                                    
                                  </tbody>
                                  <!-- <tfoot>
                                    <tr class="bg-gray">
                                      <th class="text-center" >Total</th>
                                       
                                    </tr>
                                   
                                    </tfoot> -->
                                </table>

 

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


</section>
<!-- Content End -->
</div>



@endsection
 <style>
      * {
        box-sizing: border-box;
      }

      
      .h4-14 h4 {
        font-size: 12px;
        margin-top: 0;
        margin-bottom: 5px;
      }
      .img {
        margin-left: "auto";
        margin-top: "auto";
        height: 30px;
      }
      pre,
      p {
        /* width: 99%; */
        /* overflow: auto; */
        /* bpicklist: 1px solid #aaa; */
        padding: 0;
        margin: 0;
      }
      table {
        font-family: arial, sans-serif;
        width: 100%;
        border-collapse: collapse;
        padding: 1px;
      }
      .hm-p p {
        text-align: left;
        padding: 1px;
        padding: 5px 4px;
      }
      td,
      th {
        text-align: left;
        padding: 8px 6px;
      }
      .table-b td,
      .table-b th {
        border: 1px solid #ddd;
      }
      th {
        /* background-color: #ddd; */
      }
      .hm-p td,
      .hm-p th {
        padding: 3px 0px;
      }
      .cropped {
        float: right;
        margin-bottom: 20px;
        height: 100px; /* height of container */
        overflow: hidden;
      }
      .cropped img {
        width: 400px;
        margin: 8px 0px 0px 80px;
      }
      .main-pd-wrapper {
        box-shadow: 0 0 10px #ddd;
        background-color: #fff;
        border-radius: 10px;
        padding: 15px;
      }
      .table-bordered td,
      .table-bordered th {
        border: 1px solid #ddd;
        padding: 10px;
        font-size: 14px;
      }
    </style>