632 lines
28 KiB
PHP
632 lines
28 KiB
PHP
<!-- ============================================================== -->
|
||
<!-- Start Page Content here -->
|
||
<!-- ============================================================== -->
|
||
<style>
|
||
#upload_client_button {
|
||
background-color: #4CAF50; /* Green */
|
||
color: white; /* White text */
|
||
border: 1px solid #4CAF50;
|
||
}
|
||
</style>
|
||
<div class="content-page">
|
||
<!-- Start Content-->
|
||
<div class="container-fluid">
|
||
<div class="loader-mask modal-loader-mask" style="display:none;">
|
||
<div class="loader modal-loader" style="display:none;">
|
||
Please Wait <img style="height: 60px !important;width: 60px !important;" src="<?= base_url() . "public" ?>/assets/images/upload_file.gif" height="30" width="30" alt="Loading...">
|
||
</div>
|
||
</div>
|
||
<!-- start page title -->
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<div class="page-title-box page-title-box-alt">
|
||
<h4 class="page-title">Client List</h4>
|
||
<div class="page-title-right">
|
||
<a href="" id="downloadLink" > Download Sample file </a>
|
||
<input type="file" id="clientFileUpload" style="display: none;" />
|
||
|
||
<a id="upload_client_button" class="btn btn-primary waves-effect waves-light" onclick="document.getElementById('clientFileUpload').click();">
|
||
Client Upload
|
||
</a>
|
||
<a id="add_client_button" data-toggle="modal" data-target="#bike_make_login-modal" class="btn btn-primary waves-effect waves-light">
|
||
Create Client
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- end page title -->
|
||
|
||
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<div class="card">
|
||
<div class="card-body">
|
||
|
||
|
||
<table id="client_table" class="table table-striped dt-responsive nowrap w-100">
|
||
<thead>
|
||
<tr>
|
||
<th>Name</th>
|
||
<th>PAN</th>
|
||
<th>Mobile</th>
|
||
<th>Email</th>
|
||
<th>Status</th>
|
||
<th>Action</th>
|
||
</tr>
|
||
</thead>
|
||
|
||
|
||
<tbody>
|
||
|
||
<?php foreach ($clientListForList as $key => $value) { ?>
|
||
|
||
<tr>
|
||
<td> <?php echo $value['name']; ?></td>
|
||
<td> <?php echo $value['pan_no']; ?></td>
|
||
<td><?php echo $value['mobile_no']; ?></td>
|
||
<td><?php echo $value['email']; ?></td>
|
||
<td>
|
||
<?php if($value['is_active'] == 1): ?>
|
||
<span style="color:green">Active</span>
|
||
<?php else: ?>
|
||
<span style="color:red">Inactive</span>
|
||
<?php endif; ?>
|
||
</td>
|
||
<td>
|
||
<div class="btn-group dropdown">
|
||
<a href="javascript: void(0);" class="dropdown-toggle arrow-none btn btn-light btn-sm" data-toggle="dropdown" aria-expanded="false"><i class="mdi mdi-dots-horizontal"></i></a>
|
||
<div class="dropdown-menu dropdown-menu-right">
|
||
<a class="dropdown-item edit" data-toggle="modal" data-target="#bike_make_login-modal" value="<?= $value['client_id']; ?>" onclick="editBranch(this)"> <i class='mdi mdi-pencil-outline mr-1' style="margin-right: 16px !important;margin-left: 5px;"></i>Edit</a>
|
||
|
||
<?php if($value['is_active'] == 1): ?>
|
||
<a class="dropdown-item" data-id="<?php echo $value['client_id']; ?>" data-isactive="<?php echo $value['is_active']; ?>" title="Deactivate" onclick="statusChange(this)"><i class="ri-shield-user-line"></i><i class="fa fa-times" style="font-size: x-small;margin-right:10px"></i>Deactivate</a>
|
||
<?php else: ?>
|
||
<a class="dropdown-item" data-id="<?php echo $value['client_id']; ?>" data-isactive="<?php echo $value['is_active']; ?>" title="Activate" onclick="statusChange(this)"><i class="ri-shield-user-line" style="margin-right:10px"></i>Activate</a>
|
||
<?php endif; ?>
|
||
|
||
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</td>
|
||
</tr>
|
||
|
||
<?php } ?>
|
||
|
||
|
||
</tbody>
|
||
</table>
|
||
|
||
</div> <!-- end card body-->
|
||
</div> <!-- end card -->
|
||
</div><!-- end col-->
|
||
</div>
|
||
|
||
|
||
|
||
</div> <!-- container -->
|
||
|
||
</div> <!-- content -->
|
||
|
||
|
||
|
||
<div id="bike_make_login-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
|
||
<div class="modal-dialog modal-xg">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h4 id="branch_action_type">Add Client</h4>
|
||
|
||
<div style="margin-left: 34px;margin-top: 10px;">
|
||
<label for="">Individual</label>
|
||
<input type="checkbox" id="individual_client" name="individual_client">
|
||
</div>
|
||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
|
||
<form id="model_form_data" class="px-4">
|
||
|
||
<input type="text" id="business_id" value="" hidden>
|
||
<input type="text" id="client_id" value="" hidden>
|
||
<input type="text" id="branch_id" hidden>
|
||
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="name">Name</label>
|
||
<input class="form-control" name="name" type="text" id="name" required="" placeholder="Name">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="panno">PAN No</label>
|
||
<input class="form-control" parsley-trigger="change" name="pan_no" type="text" id="pan_no" required="" placeholder="PAN No" pattern="[A-Z]{5}[0-9]{4}[A-Z]{1}" title="Please enter a valid PAN in the format ABCDE1234F">
|
||
<span id="error-message" style="color:red;display:none;">Invalid PAN Number.</span>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="email">Email</label>
|
||
<input class="form-control" name="email" type="email" id="email" required="" placeholder="Email">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="mobile_no">Mobile No</label>
|
||
<input class="form-control" name="mobile_no" type="text" id="mobile_no" required placeholder="Mobile No" oninput="this.value = this.value.replace(/[^0-9]/g, '');" pattern="[0-9]{6,16}" minlength="6" maxlength="16" title="Please enter a valid mobile number between 6 and 16 digits">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="">
|
||
<h5 class="mb-3 text-uppercase bg-light p-2 create_client">
|
||
<i class="mdi mdi-office-building mr-1"></i> Branch
|
||
</h5>
|
||
|
||
<div class="row create_client">
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="branchname">Branch Name</label>
|
||
<input class="form-control" name="branch_name" type="text" id="branch_name" required="true" placeholder="Branch Name">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="gstno">GST No</label>
|
||
<input class="form-control" name="gst_no" type="text" id="gst_no" required="" placeholder="GST No" oninput="this.value = this.value.replace(/[^0-9A-Z]/g, '').toUpperCase();" pattern="[0-9]{2}[A-Z]{5}[0-9]{4}[A-Z]{1}[0-9]{1}[Z]{1}[0-9A-Z]{1}">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="branch_email">Email</label>
|
||
<input class="form-control" name="branch_email" type="email" id="branch_email" required="" placeholder="Email">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="branch_mobile_no">Mobile No</label>
|
||
<input class="form-control" name="branch_mobile_no" type="text" id="branch_mobile_no" oninput="this.value = this.value.replace(/[^0-9]/g, '');" required="" minlength="6" maxlength="16" placeholder="Mobile No">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<h5 class="mb-3 text-uppercase bg-light p-2 client_address_area">
|
||
<i class="fas fa-map-marker-alt mr-1"></i> Address Details
|
||
</h5>
|
||
<div class="row client_address_area" >
|
||
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="address">Address</label>
|
||
<textarea class="form-control" name="address" type="text" id="address" required="" placeholder="Address"></textarea>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="city">City</label>
|
||
<input class="form-control" name="city" type="text" id="city" required="" placeholder="City">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="state">State</label>
|
||
<input class="form-control" name="state" type="text" id="state" value="Tamil Nadu" required="" placeholder="State">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="country">Country</label>
|
||
<input class="form-control" name="country" type="text" value="India" id="country" required="" placeholder="Country">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="form-group">
|
||
<label for="postalcode">PIN Code</label>
|
||
<input class="form-control" name="pin_code" type="text" id="pin_code" required="" placeholder="Pin Code">
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<h5 class="mb-3 text-uppercase bg-light p-2 client_notification_area"><i class="fas fa-bell mr-1"></i> Notification</h5>
|
||
|
||
<div class="row client_notification_area">
|
||
<!-- </div> -->
|
||
<div class="col-md-2">
|
||
<div class="form-group">
|
||
<label for="sms">SMS</label>
|
||
<input style="float:right;width: 20px;height: 20px;" name="sms" type="checkbox" id="sms" required="" checked>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-2">
|
||
|
||
</div>
|
||
<div class="col-md-2">
|
||
<div class="form-group">
|
||
<label for="whatsapp">WhatsApp</label>
|
||
<input style="float:right;width: 20px;height: 20px;" name="whatsapp" type="checkbox" id="whatsapp" required="" checked>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
<div class="form-group text-right">
|
||
<button class="btn btn-info waves-effect waves-light" type="submit" id="client_submit_button" onclick="submitClient(this, event)">Submit</button>
|
||
</div>
|
||
|
||
</form>
|
||
</div>
|
||
</div><!-- /.modal-content -->
|
||
</div><!-- /.modal-dialog -->
|
||
</div><!-- /.modal -->
|
||
|
||
|
||
|
||
<!-- ============================================================== -->
|
||
<!-- End Page content -->
|
||
<!-- ============================================================== -->
|
||
|
||
<script>
|
||
|
||
$('#individual_client').click(function () {
|
||
if($(this).prop('checked')){
|
||
$('.create_client').hide();
|
||
// $('#client_address_area').show();
|
||
$('#gst_no').prop('required', false);
|
||
$('#branch_email').prop('required', false);
|
||
$('#contact').prop('required', false);
|
||
$('#state_code').prop('required', false);
|
||
$('#branch_name').prop('required', false);
|
||
$('#branch_mobile_no').prop('required', false);
|
||
$('#sms').prop('required', false);
|
||
$('#whatsapp').prop('required', false);
|
||
}else{
|
||
$('.create_client').show();
|
||
$('#gst_no').prop('required', true);
|
||
$('#branch_email').prop('required', true);
|
||
$('#contact').prop('required', true);
|
||
$('#country').prop('required', true);
|
||
$('#state_code').prop('required', true);
|
||
$('#branch_name').prop('required', true);
|
||
$('#address').prop('required', true);
|
||
$('#city').prop('required', true);
|
||
$('#state').prop('required', true);
|
||
$('#pin_code').prop('required', true);
|
||
$('#branch_mobile_no').prop('required', true);
|
||
$('#sms').prop('required', true);
|
||
$('#whatsapp').prop('required', true);
|
||
}
|
||
})
|
||
|
||
$(document).ready(function() {
|
||
|
||
$('.edit').click(function (params) {
|
||
$('.create_client').hide();
|
||
$('.client_address_area').hide();
|
||
$('.client_notification_area').hide();
|
||
|
||
$('#gst_no').prop('required', false);
|
||
$('#branch_email').prop('required', false);
|
||
$('#contact').prop('required', false);
|
||
$('#country').prop('required', false);
|
||
$('#state_code').prop('required', false);
|
||
$('#branch_name').prop('required', false);
|
||
$('#address').prop('required', false);
|
||
$('#city').prop('required', false);
|
||
$('#state').prop('required', false);
|
||
$('#pin_code').prop('required', false);
|
||
$('#branch_mobile_no').prop('required', false);
|
||
$('#sms').prop('required', false);
|
||
$('#whatsapp').prop('required', false);
|
||
})
|
||
|
||
$('#add_client_button').click(function (params) {
|
||
$('.create_client').show();
|
||
$('.client_address_area').show();
|
||
$('.client_notification_area').show();
|
||
|
||
$('#individual_client').attr('disabled',false);
|
||
|
||
$('#name').val('');
|
||
$('#pan_no').val('');
|
||
$('#email').val('');
|
||
$('#mobile_no').val('');
|
||
$('#client_id').val('')
|
||
|
||
$('.create_client').show();
|
||
$('#gst_no').prop('required', true);
|
||
$('#branch_email').prop('required', true);
|
||
$('#contact').prop('required', true);
|
||
$('#country').prop('required', true);
|
||
$('#state_code').prop('required', true);
|
||
$('#branch_name').prop('required', true);
|
||
$('#address').prop('required', true);
|
||
$('#city').prop('required', true);
|
||
$('#state').prop('required', true);
|
||
$('#pin_code').prop('required', true);
|
||
$('#branch_mobile_no').prop('required', true);
|
||
$('#sms').prop('required', true);
|
||
$('#whatsapp').prop('required', true);
|
||
})
|
||
|
||
|
||
datatable_bikeModel = $('#client_table').DataTable({
|
||
"order": [[0, 'asc']], // Set initial sorting to descending on the first column
|
||
"dom": 'Bfrtip', // Show export buttons
|
||
"buttons": [{extend: 'pdfHtml5',title: 'Clients', text: 'PDF',},
|
||
{extend: 'print',title: 'Clients',text: 'Print',},
|
||
{extend: 'copy',text: 'Copy', titleAttr: 'Copy',},
|
||
{extend: 'csv',text: 'CSV', title: 'Clients', }],
|
||
"language": {
|
||
"search": "Search: " // Customize search label
|
||
},
|
||
});
|
||
});
|
||
|
||
document.getElementById('downloadLink').addEventListener('click', function(event)
|
||
{
|
||
event.preventDefault();
|
||
const serverUrl = window.location.origin; // Get the server URL
|
||
const projectFolder = window.location.pathname.split('/')[1]; // Get the project folder name
|
||
const filePath = `/${projectFolder}/public/uploads/client_upload_sample_file.xlsx`; // Construct the path to your file
|
||
|
||
const fullUrl = serverUrl + filePath; // Construct the full URL
|
||
var link = document.createElement('a');
|
||
link.href = fullUrl;
|
||
link.download = 'client_upload_sample_file.xlsx';
|
||
link.click();
|
||
});
|
||
|
||
|
||
|
||
function submitClient(params, event) {
|
||
event.preventDefault();
|
||
|
||
var formData = {
|
||
pan_no: $('#pan_no').val(),
|
||
email: $('#email').val(),
|
||
name: $('#name').val(),
|
||
mobile_no: $('#mobile_no').val()
|
||
};
|
||
|
||
if ($('#client_id').val())
|
||
{
|
||
formData.client_id = $('#client_id').val();
|
||
var url = '<?= base_url("client_edit/"); ?>'+ $('#client_id').val();
|
||
}else{
|
||
var url = '<?= base_url("client_create"); ?>';
|
||
|
||
if($('#individual_client').prop('checked')){
|
||
formData.individual = 1;
|
||
// formData.whatsapp = $('#individual_client').prop('checked');
|
||
}else{
|
||
formData.individual = 0;
|
||
formData.gst_no = $('#gst_no').val();
|
||
formData.branch_email = $('#branch_email').val();
|
||
formData.contact = $('#contact').val();
|
||
formData.state_code = $('#state_code').val();
|
||
formData.branch_name = $('#branch_name').val();
|
||
formData.branch_mobile_no = $('#branch_mobile_no').val();
|
||
|
||
|
||
var formDatagst = {
|
||
gst_no: $('#gst_no').val(),
|
||
};
|
||
var queryString = $.param(formDatagst);
|
||
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: '<?= base_url("check_gst"); ?>'+ '?' + queryString ,
|
||
data: formData,
|
||
dataType: 'json',
|
||
success: function(response) {
|
||
console.log(response);
|
||
if(response == true){
|
||
$('#gst_no').val('');
|
||
$('#gst_no').focus();
|
||
// toastr.waring('GST Number Already Exists');
|
||
$('#client_submit_button').attr('disabled','false');
|
||
return ;
|
||
}
|
||
},
|
||
error: function(xhr, status, error) {
|
||
// Handle error response here
|
||
console.error(xhr.responseText);
|
||
}
|
||
});
|
||
}
|
||
formData.sms = $('#sms').prop('checked');
|
||
formData.whatsapp = $('#whatsapp').prop('checked');
|
||
formData.address = $('#address').val();
|
||
formData.country = $('#country').val();
|
||
formData.city = $('#city').val();
|
||
formData.state = $('#state').val();
|
||
formData.pin_code = $('#pin_code').val();
|
||
}
|
||
|
||
var form = $(params).parent().parent();
|
||
// console.log(form);
|
||
var isValid = true;
|
||
form[0].querySelectorAll('[required]').forEach(function(element) {
|
||
if (!element.value.trim()) {
|
||
isValid = false;
|
||
}
|
||
});
|
||
|
||
if (!isValid) {
|
||
return;
|
||
}
|
||
$('#client_submit_button').attr('disabled','true')
|
||
$.ajax({
|
||
type: 'POST',
|
||
url: url,
|
||
data: formData,
|
||
dataType: 'json',
|
||
success: function(response) {
|
||
console.log(response);
|
||
if(response == true){
|
||
$('#client_submit_button').attr('disabled','false');
|
||
|
||
$('#bike_model_login-modal').modal('hide');
|
||
|
||
window.location.reload();
|
||
}else{
|
||
$('#client_submit_button').attr('disabled','false');
|
||
toastr.waring('GST Number Already Exists');
|
||
// redirect()->to(base_url()."client_list")
|
||
}
|
||
},
|
||
error: function(xhr, status, error) {
|
||
// Handle error response here
|
||
console.error(xhr.responseText);
|
||
}
|
||
});
|
||
$('#client_submit_button').attr('disabled','false');
|
||
|
||
}
|
||
|
||
|
||
|
||
|
||
function statusChange(params) {
|
||
console.log(params);
|
||
var status = params.getAttribute('data-isactive');
|
||
var client_id = params.getAttribute('data-id');
|
||
if(status == 1){
|
||
var is_active= 0;
|
||
}else{
|
||
var is_active= 1;
|
||
}
|
||
|
||
var formData = {
|
||
client_id: client_id,
|
||
is_active: is_active
|
||
};
|
||
$.ajax({
|
||
type: 'POST',
|
||
url: '<?php echo base_url()."status_client"?>',
|
||
data: formData,
|
||
dataType: 'json',
|
||
success: function(response) {
|
||
if (response.data) {
|
||
window.location.reload();
|
||
}
|
||
},
|
||
error: function(xhr, status, error) {
|
||
// Handle error response here
|
||
console.error(xhr.responseText);
|
||
}
|
||
});
|
||
|
||
|
||
}
|
||
|
||
|
||
function validatePanNumber() {
|
||
var panNumber = document.getElementById("pan_no").value;
|
||
var errorMessage = document.getElementById("error-message");
|
||
|
||
// Example regex: Adjust according to the format you need to validate
|
||
var regex = /^[A-Za-z]{5}\d{4}[A-Za-z]$/;
|
||
|
||
if (regex.test(panNumber)) {
|
||
errorMessage.style.display = "none";
|
||
|
||
} else {
|
||
errorMessage.style.display = "inline";
|
||
|
||
}
|
||
}
|
||
|
||
|
||
function editBranch(params) {
|
||
$('#branch_action_type').html('Edit Client');
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: '<?= base_url("client_edit/"); ?>' +params.getAttribute('value'),
|
||
dataType: 'json',
|
||
success: function(response) {
|
||
console.log(response);
|
||
// console.log(response.individual);
|
||
$('#client_id').val(response.client_id);
|
||
$('#name').val(response.name);
|
||
$('#pan_no').val(response.pan_no);
|
||
$('#email').val(response.email);
|
||
$('#mobile_no').val(response.mobile_no);
|
||
|
||
console.log("response.individual:", response.individual);
|
||
|
||
if(response.individual == 1){
|
||
$('#individual_client').prop('checked', true);
|
||
console.log("Checkbox checked");
|
||
}else{
|
||
$('#individual_client').prop('checked', false);
|
||
console.log("Checkbox unchecked");
|
||
}
|
||
$('#individual_client').attr('disabled',true);
|
||
},
|
||
error: function(xhr, status, error) {
|
||
// Handle error response here
|
||
console.error(xhr.responseText);
|
||
}
|
||
});
|
||
}
|
||
|
||
$('#bike_make_login-modal').click(function (params) {
|
||
$('#branch_action_type').html('Add Client');
|
||
})
|
||
|
||
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
|
||
const fileInput = document.getElementById('clientFileUpload');
|
||
|
||
if (fileInput) {
|
||
fileInput.addEventListener('change', function(event) {
|
||
console.log('File input change event triggered');
|
||
$('.loader').fadeIn();
|
||
$('.loader-mask').fadeIn();
|
||
const file = event.target.files[0];
|
||
if (file) {
|
||
var url = '<?= base_url("client_upload"); ?>';
|
||
var formData = new FormData();
|
||
formData.append('file', file);
|
||
$.ajax({
|
||
type: 'POST',
|
||
url: url,
|
||
data: formData,
|
||
dataType: 'json',
|
||
processData: false,
|
||
contentType: false,
|
||
success: function(response) {
|
||
|
||
console.log(response);
|
||
if(response == true){
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
toastr.success( 'Clients and Branches Added SuccessFully');
|
||
}
|
||
window.location.reload();
|
||
},
|
||
error: function(xhr, status, error) {
|
||
$('.loader').fadeOut();
|
||
$('.loader-mask').fadeOut('slow');
|
||
// Handle error response here
|
||
console.error(xhr.responseText);
|
||
}
|
||
});
|
||
// console.log('File selected:', file.name);
|
||
} else {
|
||
console.log('No file selected');
|
||
}
|
||
});
|
||
} else {
|
||
console.error('File input not found');
|
||
}
|
||
|
||
});
|
||
|
||
</script>
|