Untitled

<div class="page-content">
      <div class="container-fluid">
        <!-- start page title -->
        <div class="row">
          <div class="col-12">
            <div class="page-title-box d-sm-flex align-items-center justify-content-between">
              <h4 class="mb-sm-0">Debit Balances</h4>
  
              <div class="page-title-right">
                <ol class="breadcrumb m-0">
                  <li class="breadcrumb-item"><a href="javascript: void(0);">Followup Reports</a></li>
                  <li class="breadcrumb-item active">Debit Balances</li>
  
                </ol>
              </div>
  
            </div>
          </div>
        </div>
        <!-- end page title -->
        <div class="row">
          <div class="card debit-balance-filter">
            <div class="row d-flex flex-column flex-lg-row">
              <div class="col-auto d-flex">
      
                <label class="rad-label rad-label-background">
                  <input type="radio" class="rad-input" name="rad" value="1" checked onclick="EnableDisable(1)">
                  <div class="rad-design"></div>
                  <p class="rad-text">All Clients</p>
                </label>
  
                <label class="rad-label">
                  <input type="radio" class="rad-input" name="rad" value="2">
                  <div class="rad-design"></div>
                  <p class="rad-text" onclick="EnableDisable(2)">Client</p>
                </label>
            </div>
                <div class="col-auto d-flex flex-column flex-lg-row gap-3">
                  <div style="display: flex; flex-direction: column;" class="clientCodeTextDiv hide">
                    <label for="" class="form-label fw-semibold">Select Client code</label>
                    <input type="text" placeholder="Enter client code" class="clientCodeText" id="client_code" onkeyup="this.value = this.value.toUpperCase();">
                <input type="hidden" id="report_name"
                value="OutstandingBalance">
              </div>
              <div style="display: flex; flex-direction: column;">
                <label for="" class="form-label fw-semibold">Date</label>
                <div class="form-icon right" style="width: 100%;">
                  <input type="text" class="form-control form-control-icon" id="as_on_date" data-provider="flatpickr" data-date-format="d-m-Y"  placeholder="Select dates" width="">
                  <i class="ri-calendar-2-fill"></i>
                </div>
              </div>
              <div style="display: flex; flex-direction: column;">
                <label for="" class="form-label fw-semibold">Select</label>
                <select name="debit-credit-selector" id="client_type">
                  <option value="0">All</option>
                  <option value="1">Debit</option>
                  <option value="2">Credit</option>
                </select>
              </div>
            </div>
      
            <div class="col-auto d-flex justify-content-center">
              <button class="custom-primary-btn mt-4" onclick="GetOutstandingBalanceFUP()">Submit</button>
            </div>
          </div>
        </div>
        </div>
        <div id="outstandingbalance">
                
        </div>
        <div class="ajax-loader">
          <lottie-player src="https://assets5.lottiefiles.com/packages/lf20_uwR49r.json"  background="transparent"  speed="0.7"  style="width: 100px; height: 100px;"  loop  autoplay></lottie-player>
        </div>
        <div class="fileError">
          <h1>Opps.. File not found</h1>
        </div>
      </div>
      <%- include('../include/footer.ejs') %>
    </div>