| Server IP : 210.245.233.93 / Your IP : 216.73.216.226 Web Server : Apache/2.2.15 (CentOS) System : Linux webserver2.onesolution.com.hk 2.6.32-754.35.1.el6.x86_64 #1 SMP Sat Nov 7 12:42:14 UTC 2020 x86_64 User : apache ( 48) PHP Version : 5.3.3 Disable Function : exec, shell_exec, system, passthru, popen, proc_open, pcntl_exec MySQL : ON | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : ON | Pkexec : ON Directory : /var/www/hkosl.com/billingsystem/dashboard/ |
Upload File : |
<!DOCTYPE html>
<html lang="en-HK" prefix="og: http://ogp.me/ns#">
<head>
<!-- Required meta tags -->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<title>Invoice</title>
<!-- css -->
<?php include 'inc/headlinks.php'; ?>
<?php include 'inc/link-js.php'; ?>
<!-- End layout styles -->
<link rel="stylesheet" type="text/css" href="../assets/css/daterangepicker.css" />
</head>
<body>
<div class="container-scroller">
<!-- partial:partials/_sidebar.html -->
<?php include 'inc/sidebar.php'; ?>
<!-- partial -->
<div class="container-fluid page-body-wrapper">
<!-- partial:partials/_navbar.html -->
<?php include 'inc/navbar.php'; ?>
<!-- partial -->
<div class="main-panel">
<!-- breadcrumb -->
<div class="page-title-box d-flex align-items-center justify-content-between">
<ol class="breadcrumb m-0 p-0">
<li class="breadcrumb-item active">Invoice</li>
</ol>
<div class="page-title-right">
<div class="splitBtn mb-md-0 mb-3">
<button type="button" class="btn btn-indigo dropdown-toggle px-3 shadow_green"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="mr-3">Action</span> <span class="sr-only"> Toggle Dropdown</span>
</button>
<div class="dropdown-menu dropdown-menu-right small">
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#addNewInvoice"> <i
class="mdi mdi-plus-circle"></i>
Add Invoice</a>
<a class="dropdown-item" href="#"><i class="mdi mdi-file-pdf"></i> Export to CSV</a>
<a class="dropdown-item" href="#"><i class="mdi mdi-checkbox-multiple-blank-circle"></i>
Change Status</a>
<a class="dropdown-item" href="#"><i class="mdi mdi-email"></i> Send Email</a>
</div>
</div>
</div>
</div>
<!-- breadcrumb end -->
<div class="content-wrapper pb-0">
<!-- alert Message -->
<?php include 'inc/alertmessage.php'; ?>
<!-- alert Message END-->
<div class="row searchWrap">
<!-- Search Row -->
<div class="col-lg-10">
<div class="row searchDefault">
<!-- searchDefault Item -->
<div class="col-lg-3">
<div class="form-group shadow">
<input type="text" class="form-control noborder" placeholder="Invoice#">
</div>
</div>
<div class="col-lg-3">
<div class="form-group select2singleSearch shadow">
<select class="form-control noborder" id="Customer">
<option></option>
<option value="ABC Company">ABC Company </option>
</select>
</div>
</div>
<div class="col-lg-4">
<div class="input-group form-group shadow">
<input class="form-control noborder dataStart" id="from"
placeholder="Due Start">
<input class="form-control noborder dataEnd" id="to" placeholder="Due End">
</div>
<!--
<div class="form-group shadow">
<input type="text" class="form-control noborder" placeholder="Due Start"
id="DueStart" value="">
</div> -->
</div>
<!-- <div class="col-lg-2">
<div class="form-group shadow">
<input type="text" class="form-control noborder" placeholder="Due End"
id="DueEnd" value="">
</div>
</div> -->
<div class="col-lg-2">
<div class="form-group shadow">
<select class="form-control noborder ">
<option disabled selected>Status</option>
<option value="All">All</option>
<option value="Draft">Draft</option>
<option value="Pending">Pending</option>
<option value="Awaiting Payment">Awaiting Payment</option>
<option value="Partially paid">Partially paid</option>
<option value="Paid">Paid</option>
<option value="Voided">Voided</option>
</select>
</div>
</div>
<!-- searchDefault Item END-->
<!-- searchAdditionItem Item -->
<div class="col-lg-3 searchAdditionItem">
<div class="form-group select2singleSearch shadow">
<select class="form-control noborder" id="Salesman">
<option></option>
<option value="">Salesman</option>
<option value="Jackie">Jackie Wong</option>
<option value="Amy">Amy Wong</option>
<option value="Peter">Peter Wong</option>
</select>
</div>
</div>
<div class="col-lg-6 searchAdditionItem">
<div class="form-group shadow">
<input type="text" class="form-control noborder" placeholder="Product#">
</div>
</div>
<div class="col-lg-3 searchAdditionItem">
<div class="form-group select2singleSearch shadow">
<select class="form-control noborder" id="ServiceType">
<option></option>
<option value="Rental">Rental</option>
<option value="Retail">Retail</option>
<option value="CNY">CNY</option>
<option value="XMAS">XMAS</option>
</select>
</div>
</div>
<!-- searchAdditionItem Item -->
<!-- searchAdditionItem Item END-->
</div>
</div>
<div class="col-lg-2">
<div class="btn-group w-100 shadow whiteBg mb-2" role="group" aria-label="Basic example">
<button type="button" class="btn btn-secondary w-100">
Clear </button>
<button type="button" class="btn btn-dark w-100">
Search </button>
</div>
<div class="text-center">
<a href="javascript:" class="small sbtn advancedSearchBtn"><i
class="mdi mdi-shape-square-plus"></i> Advanced Search</a>
</div>
</div>
<!-- Search Row END -->
</div>
<div class="boxShadow whiteBg mb-4">
<!-- Data Table -->
<div class="table-responsive">
<table id="DataDT" class="table">
</table>
</div>
<!-- Data Table END -->
</div>
<!-- content-wrapper ends -->
<!-- partial:partials/_footer.html -->
<?php include 'inc/footer.php'; ?>
<!-- partial -->
</div>
<!-- main-panel ends -->
</div>
<!-- page-body-wrapper ends -->
</div>
<?php include 'component/add_invoice.php'; ?>
<?php include 'component/add_customer.php'; ?>
<script type="text/javascript" src="../assets/js/moment.js?<?= rand(1, 10000) / 7; ?>"></script>
<script type="text/javascript" src="../assets/js/daterangepicker.min.js?<?= rand(1, 10000) / 7; ?>"></script>
<script src="../assets/datatables/buttons/1.1.2/js/dataTables.buttons.min.js?<?= rand(1, 10000) / 7; ?>">
</script>
<script src="../assets/datatables/select/1.1.2/js/dataTables.select.min.js?<?= rand(1, 10000) / 7; ?>"></script>
<script src="../assets/js/bootstrap-datepicker.js?<?= rand(1, 10000) / 7; ?>"></script>
<script src="../assets/js/jsgrid.js?<?= rand(1, 10000) / 7; ?>"></script>
<script src="../assets/js/dataTables.checkboxes.js?<?= rand(1, 10000) / 7; ?>"></script>
<script
src="../assets/js/dataTables.fixedHeader.min.js?<?= rand(1, 10000) / 7; ?>">
</script>
<script>
$(function() {
//customer Search
ajaxSearchDetail();
function ajaxSearchDetail() {
$.ajax({
url: "../assets/json/mainsearch.json",
type: "get",
data: {},
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
success: function(data) {
var recent = data.recentSearch;
$('.mainSearchInput').wrap(`<div class="mainSearchWrap">`);
$(`<div class="mainSearchDetail noborder shadow"><ul class="mainSearchGroup"></ul><button type="button" class="small sbtn btn-inverse-primary btn-fw mt-2 addnewcustomerBtn" >Add New</button></div>`)
.appendTo(".mainSearchWrap");
$.each(recent, function(index, item) {
//$("<option >").append(item.eng_desc).appendTo("#loanPurpose");
$('<li class="mainSearchItems"><div class="mainSearchItem"><input class="form-check-input radioSearch" type="radio" name="mainSearch" value="' +
item.val + '" id="mainSearchItem' + item.id +
'"><label class="form-check-label fullWidth" for="mainSearchItem' +
item
.id + '">' + item.val +
'</label></div></li>'
).appendTo(".mainSearchGroup");
});
function checkMainSearch(val) {
$(".mainSearchItems").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(
val) >
-1)
console.log($(this).val);
});
};
$(".mainSearchInput").on("keyup change", function() {
let val = $(this).val().toLowerCase();
checkMainSearch(val);
});
},
error: function(xhr, status, errorThrown) {
console.log(errorThrown + "\n" + status + "\n" + xhr.statusTex);
},
});
};
$(document).on("click", "input[type='radio'][name='mainSearch']:checked", function() {
$(this).closest(".mainSearchWrap").find(".mainSearchInput").val($(
this)
.val());
$(this).closest(".mainSearchWrap").removeClass('active');
});
$("#Customer").select2({
placeholder: "Customer",
allowClear: true,
});
$("#Salesman").select2({
placeholder: "Salesman",
allowClear: true
});
$("#ServiceType").select2({
placeholder: "Service Type",
allowClear: true
});
// $("#SearchReceipt").select2({
// placeholder: "Receipt Code",
// allowClear: true
// });
// $("#SearchCreatBy").select2({
// placeholder: "Created By",
// allowClear: true
// });
// $('#SearchCreatAt').daterangepicker({
// autoUpdateInput: false,
// locale: {
// cancelLabel: 'Clear'
// }
// });
// $('#SearchCreatAt').on('apply.daterangepicker', function(ev, picker) {
// $(this).val(picker.startDate.format('DD MMM, YY') + ' - ' + picker.endDate.format('DD MMM, YY'));
// });
// $('#SearchCreatAt').on('cancel.daterangepicker', function(ev, picker) {
// $(this).val('');
// });
if ($('#from, #to').length) {
// check if element is available to bind ITS ONLY ON HOMEPAGE
var currentDate = moment().format("DD-MM-YYYY");
$('#from, #to').daterangepicker({
locale: {
format: 'DD-MM-YYYY'
},
alwaysShowCalendars: true,
// "minDate": currentDate,
autoApply: true,
autoUpdateInput: false,
ranges: {
'Today': [moment(), moment()],
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
'This Month': [moment().startOf('month'), moment().endOf('month')],
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment()
.subtract(1, 'month').endOf('month')
]
}
}, function(start, end, label) {
// console.log("New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')");
// Lets update the fields manually this event fires on selection of range
var selectedStartDate = start.format('DD-MM-YYYY'); // selected start
var selectedEndDate = end.format('DD-MM-YYYY'); // selected end
$checkinInput = $('#from');
$checkoutInput = $('#to');
// Updating Fields with selected dates
$checkinInput.val(selectedStartDate);
$checkoutInput.val(selectedEndDate);
// Setting the Selection of dates on calender on CHECKOUT FIELD (To get this it must be binded by Ids not Calss)
var checkOutPicker = $checkoutInput.data('daterangepicker');
checkOutPicker.setStartDate(selectedStartDate);
checkOutPicker.setEndDate(selectedEndDate);
// Setting the Selection of dates on calender on CHECKIN FIELD (To get this it must be binded by Ids not Calss)
var checkInPicker = $checkinInput.data('daterangepicker');
checkInPicker.setStartDate(selectedStartDate);
checkInPicker.setEndDate(selectedEndDate);
});
}
// End Daterange Picker
// $('#SearchExpired').on('apply.daterangepicker', function(ev, picker) {
// $(this).val(picker.startDate.format('DD MMM, YY') + ' - ' + picker.endDate.format(
// 'DD MMM, YY'));
// });
// $('#SearchExpired').on('cancel.daterangepicker', function(ev, picker) {
// $(this).val('');
// });
var columnDefs = [{
data: "columnindex",
title: "All"
},
{
render: function(data, type, row) {
var result =
'<a href="#" class="h1 enText"><i class="mdi mdi-file-pdf"> </i></a>';
return result;
},
title: "PDF"
},
{
render: function(data, type, row) {
order = row.column01;
var result =
'<div><a href="invoice_detail.php?id=' +
order + '">' + order +
'</a></div>';
return result;
},
title: "INV#"
},
{
data: "column02",
title: "Service Type"
},
{
data: "column04",
title: "Customer(EN)"
},
{
data: "column03",
title: "Customer(CN)"
},
{
data: "column05",
title: "INV DATE"
},
{
data: "column06",
title: "Due Date"
},
{
data: "column08",
title: "Amount DUE",
className: 'dt-body-right'
},
{
data: "column09",
title: "PAID",
className: 'dt-body-right'
},
{
data: "column11",
title: "Sent"
},
{
render: function(data, type, row) {
status = row.column12;
var result = '<label class="badge ' + row.column12class + ' ">' + status +
'</label>';
return result;
},
title: "Status"
}
];
var siteTable = $('#DataDT').DataTable({
scrollX: true,
ajax: "../assets/json/invoice_list.json",
columns: columnDefs,
searching: false,
select: 'single',
responsive: true,
lengthMenu: [
[10, 25, 50, 100, -1],
[10, 25, 50, 100, "All"]
],
altEditor: true, // Enable altEditor
pageLength: 10,
columnDefs: [{
'targets': 0,
'checkboxes': {
'selectRow': false
}
}],
order: []
});
new $.fn.dataTable.FixedHeader(siteTable);
$(document).on("click", ".addnewcustomerBtn", function() {
$(".modal").modal("hide");
setTimeout(function() {
$("#addNewCustomer").modal({
refresh: true
});
}, 500);
});
});
</script>
</body>
</html>