Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 5.14.0-503.34.1.el9_5.x86_64

PHP Version:

8.2.30

User:

u329947844

Directory:

/home/u329947844/domains/hifi11.in/public_html/finance

Free Space:

10.3 TB

🔧 Quick Actions

✏️ Editing: qualified-leads.php

<!DOCTYPE html>
<html lang="en" dir="ltr" data-startbar="dark" data-bs-theme="light">

<?php include 'includes/head.php'; ?>

<body>

<?php include 'includes/topbar.php'; ?>

<div class="startbar d-print-none">
        
        <div class="brand">
            <a href="index.php" class="logo">
                <span>
                    <img src="assets/images/logo-sm.png" alt="logo-small" class="logo-sm">
                </span>
                <span class="">
                    <img src="assets/images/logo-light.png" alt="logo-large" class="logo-lg logo-light">
                    <img src="assets/images/logo-dark.png" alt="logo-large" class="logo-lg logo-dark">
                </span>
            </a>
        </div>

<?php include 'includes/leftbar.php'; ?>
        <div class="startbar-overlay d-print-none"></div>

<div class="row align-items-center mb-3">
                        <div class="col">
                            <h3 class="mb-0">Qualified Leads</h3>
                            <small class="text-muted">Sample data with inline status updates.</small>
                        </div>
                        <div class="col-auto d-flex gap-2">
                            <a href="new-leads.php" class="btn btn-primary">
                                <i class="iconoir-plus me-1"></i> Add New Lead
                            </a>
                            <a href="contacted-leads.php" class="btn btn-outline-secondary">
                                <i class="iconoir-phone me-1"></i> Contacted
                            </a>
                            <a href="converted-leads.php" class="btn btn-outline-success">
                                <i class="iconoir-check-circle me-1"></i> Converted
                            </a>
                        </div>
                    </div>

<div class="card mb-3">
                        <div class="card-body">
                            <form id="filterForm" class="row g-2">
                                <div class="col-sm-4">
                                    <label class="form-label">Search</label>
                                    <input type="text" class="form-control" id="f_q" placeholder="Name / Mobile / Business / Remark">
                                </div>
                                <div class="col-sm-3">
                                    <label class="form-label">Callback From</label>
                                    <input type="date" class="form-control" id="f_from">
                                </div>
                                <div class="col-sm-3">
                                    <label class="form-label">Callback To</label>
                                    <input type="date" class="form-control" id="f_to">
                                </div>
                                <div class="col-sm-2 d-flex align-items-end gap-2">
                                    <button type="button" id="btnFilter" class="btn btn-light w-100">Filter</button>
                                    <button type="button" id="btnReset" class="btn btn-outline-secondary w-100">Reset</button>
                                </div>
                            </form>
                        </div>
                    </div>

<div class="card">
                        <div class="card-header">
                            <h4 class="card-title mb-0">List</h4>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive">
                                <table id="tblQualified" class="table table-striped table-bordered align-middle w-100">
                                    <thead class="table-light">
                                        <tr>
                                            <th>#ID</th>
                                            <th>Customer</th>
                                            <th>Mobile</th>
                                            <th>Business</th>
                                            <th>Qualified Callback</th>
                                            <th>Remark</th>
                                            <th>Status</th>
                                            <th class="text-end">Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        
                                        <tr data-json='{"id":3021,"customer_name":"Kunal Verma","mobile_number":"+91 98100 22334","customer_location":"Noida","business_name":"KV Logistics","business_category":"Logistics","remark_qualified":"Wants enterprise plan; schedule with ops.","qualified_callback":"2025-09-25 10:30","lead_status":"qualified"}'>
                                            <td>QL-3021</td>
                                            <td>Kunal Verma</td>
                                            <td>+91 98100 22334</td>
                                            <td>KV Logistics</td>
                                            <td>2025-09-25 10:30</td>
                                            <td>Wants enterprise plan; schedule with ops.</td>
                                            <td><span class="badge bg-info-subtle text-info">Qualified</span></td>
                                            <td class="text-end">
                                                <button class="btn btn-sm btn-soft-primary btn-edit"><i class="las la-edit"></i></button>
                                            </td>
                                        </tr>
                                        <tr data-json='{"id":3022,"customer_name":"Pooja N","mobile_number":"+91 99000 11122","customer_location":"Bengaluru","business_name":"PnFoods","business_category":"FMCG","remark_qualified":"Needs custom pricing; CFO on call.","qualified_callback":"2025-09-26 15:45","lead_status":"qualified"}'>
                                            <td>QL-3022</td>
                                            <td>Pooja N</td>
                                            <td>+91 99000 11122</td>
                                            <td>PnFoods</td>
                                            <td>2025-09-26 15:45</td>
                                            <td>Needs custom pricing; CFO on call.</td>
                                            <td><span class="badge bg-info-subtle text-info">Qualified</span></td>
                                            <td class="text-end">
                                                <button class="btn btn-sm btn-soft-primary btn-edit"><i class="las la-edit"></i></button>
                                            </td>
                                        </tr>
                                        <tr data-json='{"id":3023,"customer_name":"R. Suresh","mobile_number":"+91 98989 55667","customer_location":"Coimbatore","business_name":"SR Textiles","business_category":"Manufacturing","remark_qualified":"Share SLA; finalize scope.","qualified_callback":"2025-09-24 11:00","lead_status":"qualified"}'>
                                            <td>QL-3023</td>
                                            <td>R. Suresh</td>
                                            <td>+91 98989 55667</td>
                                            <td>SR Textiles</td>
                                            <td>2025-09-24 11:00</td>
                                            <td>Share SLA; finalize scope.</td>
                                            <td><span class="badge bg-info-subtle text-info">Qualified</span></td>
                                            <td class="text-end">
                                                <button class="btn btn-sm btn-soft-primary btn-edit"><i class="las la-edit"></i></button>
                                            </td>
                                        </tr>
                                        
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

</div>

<?php include 'includes/rightbar.php'; ?>
                <?php include 'includes/footer.php'; ?>
            </div>
            
        </div>

<?php include 'includes/scripts.php'; ?>

<link rel="stylesheet" href="https://cdn.datatables.net/1.13.8/css/dataTables.bootstrap5.min.css">
        <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
        <script src="https://cdn.datatables.net/1.13.8/js/jquery.dataTables.min.js"></script>
        <script src="https://cdn.datatables.net/1.13.8/js/dataTables.bootstrap5.min.js"></script>

<div class="modal fade" id="modalLead" tabindex="-1" aria-hidden="true">
          <div class="modal-dialog modal-lg modal-dialog-centered">
            <form id="formLead" class="modal-content needs-validation" novalidate enctype="multipart/form-data">
              <div class="modal-header">
                <h5 class="modal-title">Update Lead (Qualified)</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
              </div>

<div class="row g-3">
                  
                  <div class="col-md-6">
                    <label class="form-label">Customer Name <span class="text-muted">(optional)</span></label>
                    <input type="text" class="form-control" id="customer_name" name="customer_name">
                  </div>

<div class="col-md-6">
                    <label class="form-label">Mobile Number <span class="text-danger">*</span></label>
                    <input type="tel" class="form-control" id="mobile_number" name="mobile_number" required pattern="[\+\d][\d\s\-]{6,}">
                    <div class="invalid-feedback">Enter a valid mobile number.</div>
                  </div>

<div class="col-md-6">
                    <label class="form-label">Customer Location <span class="text-muted">(optional)</span></label>
                    <input type="text" class="form-control" id="customer_location" name="customer_location">
                  </div>

<div class="col-md-6">
                    <label class="form-label">Business Name <span class="text-danger">*</span></label>
                    <input type="text" class="form-control" id="business_name" name="business_name" required>
                    <div class="invalid-feedback">Business name is required.</div>
                  </div>

<div class="col-md-6">
                    <label class="form-label">Business Category <span class="text-muted">(optional)</span></label>
                    <input type="text" class="form-control" id="business_category" name="business_category">
                  </div>

<div class="col-md-6">
                    <label class="form-label">Call Record Upload</label>
                    <input class="form-control" type="file" id="call_record" name="call_record" accept=".mp3,.wav,.m4a,.aac,.ogg">
                    <small class="text-muted">Accepted: mp3, wav, m4a, aac, ogg</small>
                  </div>

<div class="col-md-6">
                    <label class="form-label">Lead Status <span class="text-danger">*</span></label>
                    <select class="form-select" id="lead_status" name="lead_status" required>
                      <option value="" disabled>Choose status...</option>
                      <option value="new">New</option>
                      <option value="contacted">Contacted</option>
                      <option value="qualified">Qualified</option>
                      <option value="converted">Converted</option>
                      <option value="canceled">Canceled</option>
                    </select>
                    <div class="invalid-feedback">Please choose a lead status.</div>
                  </div>

<div class="col-12 d-none" id="blk_contacted">
                    <div class="row g-3">
                      <div class="col-md-8">
                        <label class="form-label">Remark (Contacted) <span class="text-danger">*</span></label>
                        <textarea class="form-control" id="remark_contacted" name="remark_contacted" rows="2"></textarea>
                        <div class="invalid-feedback">Remark is required.</div>
                      </div>
                      <div class="col-md-4">
                        <label class="form-label">Estimated Call Back <span class="text-danger">*</span></label>
                        <input type="datetime-local" class="form-control" id="callback_eta" name="callback_eta">
                        <div class="invalid-feedback">Estimated call back is required.</div>
                      </div>
                    </div>
                  </div>

<div class="col-12" id="blk_qualified">
                    <div class="row g-3">
                      <div class="col-md-8">
                        <label class="form-label">Remark (Qualified) <span class="text-danger">*</span></label>
                        <textarea class="form-control" id="remark_qualified" name="remark_qualified" rows="2" required></textarea>
                        <div class="invalid-feedback">Remark is required.</div>
                      </div>
                      <div class="col-md-4">
                        <label class="form-label">Call Back Date &amp; Time <span class="text-danger">*</span></label>
                        <input type="datetime-local" class="form-control" id="qualified_callback" name="qualified_callback" required>
                        <div class="invalid-feedback">Call back date & time is required.</div>
                      </div>
                    </div>
                  </div>

<div class="col-12 d-none" id="blk_converted">
                    <div class="row g-3">
                      <div class="col-md-4">
                        <label class="form-label">Advance Amount (₹) <span class="text-danger">*</span></label>
                        <input type="number" class="form-control" id="advance_amount" name="advance_amount" min="0" step="0.01" placeholder="0.00">
                        <div class="invalid-feedback">Enter advance amount received.</div>
                      </div>
                      <div class="col-md-8">
                        <label class="form-label">Remark (Converted) <span class="text-danger">*</span></label>
                        <textarea class="form-control" id="remark_converted" name="remark_converted" rows="2"></textarea>
                        <div class="invalid-feedback">Remark is required.</div>
                      </div>
                    </div>
                  </div>

<div class="col-12" id="blk_generic">
                    <label class="form-label">Remark <span class="text-muted">(optional)</span></label>
                    <textarea class="form-control" id="remark" name="remark" rows="2"></textarea>
                  </div>
                </div>
              </div>

<div class="modal-footer">
                <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-primary">Save changes</button>
              </div>
            </form>
          </div>
        </div>

// Custom date range filter on "Qualified Callback" (col index 4)
            $.fn.dataTable.ext.search.push(function(settings, data){
                if (settings.nTable.id !== 'tblQualified') return true;
                const from = document.getElementById('f_from').value;
                const to   = document.getElementById('f_to').value;
                const val  = data[4] || ''; // "YYYY-MM-DD HH:mm"
                if (!from && !to) return true;
                if (!val) return false;

const rowDate = new Date(val.replace(' ', 'T'));
                if (from && rowDate < new Date(from)) return false;
                if (to) {
                  const toEnd = new Date(to); toEnd.setHours(23,59,59,999);
                  if (rowDate > toEnd) return false;
                }
                return true;
            });

// ===== Modal logic (status-based conditional blocks) =====
            const modalEl = document.getElementById('modalLead');
            const leadModal = modalEl ? new bootstrap.Modal(modalEl) : null;

const statusSelect = document.getElementById('lead_status');
            const blkContacted = document.getElementById('blk_contacted');
            const blkQualified = document.getElementById('blk_qualified');
            const blkConverted = document.getElementById('blk_converted');
            const blkGeneric   = document.getElementById('blk_generic');

const remarkContacted   = document.getElementById('remark_contacted');
            const callbackEta       = document.getElementById('callback_eta');
            const remarkQualified   = document.getElementById('remark_qualified');
            const qualifiedCallback = document.getElementById('qualified_callback');
            const advanceAmount     = document.getElementById('advance_amount');
            const remarkConverted   = document.getElementById('remark_converted');

function toggleBlocks() {
                const val = statusSelect.value;

// Reset requireds
                [remarkContacted, callbackEta, remarkQualified, qualifiedCallback, advanceAmount, remarkConverted].forEach(el => {
                    if (!el) return;
                    el.removeAttribute('required');
                });

// Hide all
                blkContacted.classList.add('d-none');
                blkQualified.classList.add('d-none');
                blkConverted.classList.add('d-none');
                blkGeneric.classList.remove('d-none');

if (val === 'contacted') {
                    blkContacted.classList.remove('d-none');
                    remarkContacted.setAttribute('required', 'required');
                    callbackEta.setAttribute('required', 'required');
                } else if (val === 'qualified' || val === '') {
                    blkQualified.classList.remove('d-none');
                    remarkQualified.setAttribute('required', 'required');
                    qualifiedCallback.setAttribute('required', 'required');
                } else if (val === 'converted') {
                    blkConverted.classList.remove('d-none');
                    advanceAmount.setAttribute('required', 'required');
                    remarkConverted.setAttribute('required', 'required');
                }
            }
            if (statusSelect) statusSelect.addEventListener('change', toggleBlocks);

// Open modal pre-filled from row
            $(document).on('click', '.btn-edit', function(){
                const tr = $(this).closest('tr')[0];
                const rowData = tr.getAttribute('data-json') ? JSON.parse(tr.getAttribute('data-json')) : {};

// Base fields
                document.getElementById('lead_id').value            = rowData.id || '';
                document.getElementById('customer_name').value      = rowData.customer_name || '';
                document.getElementById('mobile_number').value      = rowData.mobile_number || '';
                document.getElementById('customer_location').value  = rowData.customer_location || '';
                document.getElementById('business_name').value      = rowData.business_name || '';
                document.getElementById('business_category').value  = rowData.business_category || '';
                document.getElementById('remark').value             = rowData.remark || '';

// Status + conditional
                document.getElementById('lead_status').value        = (rowData.lead_status || 'qualified');
                document.getElementById('remark_contacted').value   = rowData.remark_contacted || '';
                document.getElementById('callback_eta').value       = rowData.callback_eta ? rowData.callback_eta.replace(' ', 'T') : '';

document.getElementById('remark_qualified').value   = rowData.remark_qualified || rowData.remark || '';
                document.getElementById('qualified_callback').value = rowData.qualified_callback ? rowData.qualified_callback.replace(' ', 'T') : '';

document.getElementById('advance_amount').value     = rowData.advance_amount || '';
                document.getElementById('remark_converted').value   = rowData.remark_converted || '';

// Keep a reference to the TR for updating later
                modalEl.dataset.targetRowIndex = dt.row(tr).index();

toggleBlocks();
                if (leadModal) leadModal.show();
            });

// Save (client-side update in sample mode)
            document.getElementById('formLead').addEventListener('submit', function(e){
                e.preventDefault();
                toggleBlocks();

if (!this.checkValidity()) {
                    this.classList.add('was-validated');
                    return;
                }

// Build updated object from form
                const obj = {
                    id:               document.getElementById('lead_id').value,
                    customer_name:    document.getElementById('customer_name').value,
                    mobile_number:    document.getElementById('mobile_number').value,
                    customer_location:document.getElementById('customer_location').value,
                    business_name:    document.getElementById('business_name').value,
                    business_category:document.getElementById('business_category').value,
                    remark:           document.getElementById('remark').value,
                    lead_status:      document.getElementById('lead_status').value,
                    remark_contacted: document.getElementById('remark_contacted').value,
                    callback_eta:     document.getElementById('callback_eta').value ? document.getElementById('callback_eta').value.replace('T',' ') : '',
                    remark_qualified: document.getElementById('remark_qualified').value,
                    qualified_callback: document.getElementById('qualified_callback').value ? document.getElementById('qualified_callback').value.replace('T',' ') : '',
                    advance_amount:   document.getElementById('advance_amount').value,
                    remark_converted: document.getElementById('remark_converted').value
                };

// Update which date to show in the "Qualified Callback" column (prefer qualified_callback)
                const showCallback = obj.qualified_callback || obj.callback_eta || '';

// Update DataTable row cells
                const rowIdx = modalEl.dataset.targetRowIndex;
                if (rowIdx !== undefined) {
                    const row = dt.row(rowIdx);
                    const current = row.node();

// Update visible columns
                    row.data([
                        'QL-' + obj.id,
                        obj.customer_name,
                        obj.mobile_number,
                        obj.business_name,
                        showCallback,
                        (obj.remark_qualified || obj.remark_contacted || obj.remark_converted || obj.remark || ''),
                        `<span class="badge bg-${statusBadge(obj.lead_status)}-subtle text-${statusBadge(obj.lead_status)}">${titleCase(obj.lead_status)}</span>`,
                        current.querySelector('td:last-child').innerHTML // keep action cell
                    ]).draw(false);

// Update the row's embedded JSON for future edits
                    current.setAttribute('data-json', JSON.stringify(obj));
                }

if (leadModal) leadModal.hide();
            });

// Filters
            document.getElementById('btnFilter').addEventListener('click', function(){
                const q = document.getElementById('f_q').value || '';
                dt.search(q).draw();
            });
            document.getElementById('btnReset').addEventListener('click', function(){
                document.getElementById('f_q').value   = '';
                document.getElementById('f_from').value= '';
                document.getElementById('f_to').value  = '';
                dt.search('').draw();
            });

// Init DataTable
            $(document).ready(function(){
                dt = $('#tblQualified').DataTable({
                    pageLength: 10,
                    order: [[0, 'desc']],
                });

// Hook date filter live
                $('#f_from,#f_to').on('change', function(){ dt.draw(); });
            });
        </script>

</body>

</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: qualified-leads.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation