ledger
unknown
plain_text
2 years ago
26 kB
5
Indexable
<%- include('../layouts/htmlHeader.ejs') %>
<%-include('../include/filterCompnent.ejs')%>
<%-include('../include/downloadComponent.ejs')%>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<%- include('../layouts/top.ejs') %>
<!-- ============================================================== -->
<!-- Start right Content here -->
<!-- ============================================================== -->
<% let client_code1=client_code %>
<style>
@import url(https://fonts.googleapis.com/css?family=Raleway:400,100,200,300);
* {
margin: 0;
padding: 0;
box-sizing:border-box
}
a {
color: #666;
text-decoration: none;
}
a:hover {
color: #4FDA8C;
}
.section-tabs {
padding-top: 15px
}
.swiper-container {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1;
}
.swiper-container-android .swiper-slide, .swiper-wrapper {
transform: translate3d(0px,0,0);
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: flex;
transition-property: transform;
box-sizing: content-box;
}
.swiper-slide {
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
transition-property: transform;
}
.section-tabs .swiper-tabs-nav .swiper-slide {
text-align: center;
padding-bottom: 10px;
border-bottom: 2px solid #f4f6f5;
font-weight: 600;
transition: all 0.3s ease-in-out;
cursor: pointer
}
.section-tabs .swiper-tabs-nav .swiper-slide.swiper-slide-thumb-active {
font-weight: 700;
color: #177dff;
border-color: #177dff
}
.section-tabs .swiper-tabs-content .swiper-slide {
padding: 25px 15px
}
.section-tabs .swiper-tabs-content .swiper-slide .full-height {
display: flex;
flex-direction: column;
min-height: calc(65vh - 25px)
}
.section-tabs .swiper-tabs-content .swiper-slide .row {
margin: 0 -5px
}
.section-tabs .swiper-tabs-content .swiper-slide .row .col-6,
.section-tabs .swiper-tabs-content .swiper-slide .row .col {
padding: 0 5px
}
.section-tabs .swiper-tabs-content .swiper-slide .custom-select {
border-radius: 0
}
.section-tabs .swiper-tabs-content .swiper-slide textarea.form-control {
border-radius: 0;
background-color: #FFF
}
.section-tabs .swiper-tabs-content .swiper-slide .radio-courier .item-radio input~label {
border-radius: 0;
text-align: center
}
.section-tabs .swiper-tabs-content .swiper-slide .radio-courier .item-radio input~label h6 {
color: #177dff
}
.section-tabs .swiper-tabs-content .swiper-slide .radio-courier .item-radio input~label p {
color: #989898
}
.section-tabs .swiper-tabs-content .swiper-slide .bottom {
margin-top: auto
}
.section-tabs .swiper-tabs-content .swiper-slide .bottom .btn {
text-transform: uppercase;
font-weight: 600;
font-family: 'Cairo', sans-serif !important;
position: relative
}
.section-tabs .swiper-tabs-content .swiper-slide .bottom .btn .icon {
position: absolute;
left: 15px;
top: 60%;
transform: translateY(-50%)
}
.section-tabs .swiper-tabs-content .swiper-slide .bottom .btn .icon img {
height: 20px;
width: auto;
filter: invert(1)
}
.input {
box-sizing: border-box;
-moz-box-sizing: border-box;
color: inherit;
font-family: inherit;
padding: .8em 0 10px .8em;
border: 1px solid #CFCFCF;
outline: 0;
display: inline-block;
margin: 0 0 .8em 0;
padding-right: 2em;
width: 100%;
}
.button {
width: 100%;
padding: .8em .8em 10px .8em;
background-color: #28A55F;
border: none;
color: #fff;
cursor: pointer;
text-transform: uppercase;
}
.button:hover {
background-color: #4FDA8C;
}
.checkbox {
visibility: hidden;
padding: 20px;
margin: .5em 0 1.5em;
}
form label[for] {
position: relative;
padding-left: 20px;
cursor: pointer;
}
form label[for]::before {
content: '';
position: absolute;
border: 1px solid #CFCFCF;
width: 17px;
height: 17px;
top: 0px;
left: -14px;
}
form label[for]::after {
opacity: 0;
content: '';
position: absolute;
width: 9px;
height: 5px;
background-color: transparent;
top: 4px;
left: -10px;
border: 3px solid #28A55F;
border-top: none;
border-right: none;
transform: rotate(-45deg);
}
form .checkbox:checked + label:after {
opacity: 1;
}
.help-text {
margin-top: .6em;
}
.help-text p {
text-align: center;
font-size: 14px;
}
#button{
display:block;
margin:20px auto;
padding:10px 30px;
background-color:#eee;
border:solid #ccc 1px;
cursor: pointer;
}
#overlay{
position: absolute;
z-index: 100;
width: 100%;
height: 100%;
display: none;
background: white;
}
.cv-spinner {
display: flex;
justify-content: center;
align-items: center;
padding-top: 30%;
}
.spinner {
width: 40px;
height: 40px;
border: 4px #ddd solid;
border-top: 4px #2e93e6 solid;
border-radius: 50%;
animation: sp-anime 0.8s infinite linear;
}
@keyframes sp-anime {
100% {
transform: rotate(360deg);
}
}
.is-hide{
display:none;
}
</style>
<div class="main-content">
<div class="page-content">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div
class="page-title-box d-sm-flex align-items-center justify-content-between">
<div class="page-title-right">
<ol class="breadcrumb m-0">
<li class="breadcrumb-item"><i
class=" fas fa-arrow-left"></i> <a
href="/getreports">Reports</a></li>
<li class="breadcrumb-item active">Ledger</li>
</ol>
</div>
</div>
</div>
<div class="">
<div class="card ledgerCard">
<div class="cardTitle"
style="display: flex;justify-content: space-between;">
<p style="color:white" class="card-heading">Ledger</p>
<div class="cardRightElement">
<a class="btn" style="background-color: #177DFF; color: white;"
data-bs-toggle="modal"
data-bs-target=".bs-example-modal-center" onclick="handlesegmentType(`mail`)">
<i class="bx bxs-envelope"></i>
</a>
</div>
</div>
<div class="cardBody" style="display: flex; flex-direction: column;gap: 1rem;">
<div class="cardSecondSection">
<div>
<p class="text-small">Opening Balance</p>
<div class="LedgerBalanceBox">
₹<span id="opening_balance">0</span>
</div>
</div>
<div>
<p class="text-small">Closing Balance</p>
<div class="LedgerBalanceBox">
₹<span id="closing_balance">0</span>
</div>
</div>
</div>
<div class="col-xl-12 col-md-12">
<div class="form-group">
<select required="" class="form-control form-select" style="border-radius: 20px;" onchange="getYearWiseLedger()" id="year_filer">
<!-- <option value="22-23">FY - 2022 to 2023</option>
<option value="21-22">FY - 2021 to 2022</option>
<option value="20-21">FY - 2020 to 2021</option> -->
</select>
<input type="hidden" id="client_code" value='<%= client_code %>'>
</div>
</div>
</div>
<!-- end card body -->
</div>
<!-- end card -->
</div>
<div class="col-12">
<div class="ledgerTotalAmountCardDiv" style="gap: 5%;">
<div class="col">
<p class="text-mid"><i class="fas fa-rupee-sign"></i> <span id="total_credit">0</span>
</p>
<p class="text-small">Total Credit</p>
</div>
<div class="col">
<p class="text-mid">-<i class="fas fa-rupee-sign"></i> <span id="total_debit">0</span>
</p>
<p class="text-small">Total Debit</p>
</div>
</div>
</div>
</div>
<div class="d-lg-flex">
<div class="chat-leftsidebar card section-tabs" style="border: none;
margin-top: 12px;">
<div class="chat-leftsidebar-nav">
<ul class="nav nav-tabs nav-tabs-custom nav-justified" role="tablist">
<li class="nav-item">
<a onclick="get_credit_debit('all')" data-bs-toggle="tab"
aria-expanded="true" class="nav-link active">
<p class="custom-text-m-15"> All </p>
</a>
</li>
<li class="nav-item">
<a onclick="get_credit_debit('credit')" data-bs-toggle="tab"
aria-expanded="false" class="nav-link">
<span class="d-lg-block">
<p class="custom-text-m-15"> Credit Only </p>
</span>
</a>
</li>
<li class="nav-item">
<a onclick="get_credit_debit('debit')" data-bs-toggle="tab"
aria-expanded="false" class="nav-link">
<span class="d-lg-block">
<p class="custom-text-m-15">Debit Only</p>
</span>
</a>
</li>
</ul>
<div id="overlay">
<div class="cv-spinner">
<!-- <span class="spinner"></span> -->
<lottie-player src="https://lottie.host/26a6468c-0598-4d71-b7a6-076ad3e36b6c/jBeEsTL7MM.json" background="transparent" speed="1" style="width: 50px; height: 50px; margin: 0;" loop autoplay></lottie-player>
</div>
</div>
<div class="tab-content swiper-container swiper-tabs-content">
<div class="swiper-wrapper">
<div class=" swiper-slide" id="all">
</div>
<div class=" swiper-slide" id="debit">
</div>
<div class=" swiper-slide" id="credit">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tabs navs -->
</div>
<!-- End Page-content -->
</div>
<!-- end main content-->
</div>
<%- include('../layouts/htmlFooter.ejs') %>
<script>
function yyyymmdd(dateIn) {
var yyyy = dateIn.getFullYear();
var mm = dateIn.getMonth() + 1; // getMonth() is zero-based
var dd = dateIn.getDate();
return String(10000 * yyyy + dd + 100 * mm); // Leading zeros for mm and dd
}
$(function () {
let container=$("#year_filer");
let currentYear = new Date().getFullYear();
for(let i=0;i<2;i++){
let option=document.createElement("option");
option.value=currentYear-i;
option.innerText=`FY-`+`${currentYear-(i+1)}`+ ` to ` + `${currentYear-i}`;
container.append(option)
}
var today = new Date();
var priorDate = new Date(new Date().setDate(today.getDate() - 365));
var client_code = '<%= client_code1 %>';
var formData = {
'client_code': client_code,
'from_date': yyyymmdd(priorDate),
'to_date': yyyymmdd(today),
'report_name': "LedgerDetail",
};
$.ajax({
type: "POST",
url: "/get-typewise-ledger-detail",
data: JSON.stringify(formData),
contentType: "application/json",
Accept: "application/text",
dataType: "text",
beforeSend: function () {
$("#overlay").fadeIn(300);
},
success: function (data) {
$("#all").html(data);
},
error: function (err) {
console.log("Error ");
console.log(err);
},
complete: function () {
$("#overlay").fadeOut(300);
},
});
})
function get_credit_debit(type) {
let from_date = ""
let to_date = ""
let from_date1 = $("#start-date").val()
let to_date1 = $("#end-date").val()
if(from_date1 !="" && to_date1 !=""){
from_date = from_date1.replaceAll("-","")
to_date = to_date1.replaceAll("-","")
}else{
let date=new Date();
let finyear=$(`#year_filer`).val();
let start_date=(Number(finyear)-1).toString();
from_date=start_date+String(date.getMonth() + 1).padStart(2, '0')+String(date.getDate()).padStart(2, '0');
to_date=finyear+String(date.getMonth() + 1).padStart(2, '0')+String(date.getDate()).padStart(2, '0');
}
let client_code = $("#ClientCode").val()
let type_filter = $("#type_filter").val()
var filter = $('input[name="filter[]"]:checked')
.map(function () {
return this.value;
})
.get();
var formData = {
client_code: client_code,
from_date: from_date,
to_date: to_date,
filter: filter,
type_filter: type_filter,
type: type
};
$.ajax({
type: "POST",
url: "/get-typewise-ledger-detail",
data: JSON.stringify(formData),
contentType: "application/json",
Accept: "application/text",
dataType: "text",
beforeSend: function () {
$("#overlay").fadeIn(300);
},
success: function (data) {
$("#all").html(data);
},
error: function (err) {
console.log("Error ");
console.log(err);
},
complete: function () {
$("#overlay").fadeOut(300);
},
});
}
function getYearWiseLedger(){
// let year_filer = $("#year_filer").val()
let date=new Date();
let finyear=$(`#year_filer`).val();
let start_date=(Number(finyear)-1).toString();
let from_date=start_date+String(date.getMonth() + 1).padStart(2, '0')+String(date.getDate()).padStart(2, '0');
let to_date=finyear+String(date.getMonth() + 1).padStart(2, '0')+String(date.getDate()).padStart(2, '0');
var client_code = '<%= client_code1%>';
var formData = {
'client_code': client_code,
'from_date': from_date,
'to_date': to_date,
'report_name': "LedgerDetail",
};
$.ajax({
type: "POST",
url: "/get-typewise-ledger-detail",
data: JSON.stringify(formData),
contentType: "application/json",
Accept: "application/text",
dataType: "text",
beforeSend: function () {
$("#overlay").fadeIn(300);
},
success: function (data) {
$("#all").html(data);
},
error: function (err) {
console.log("Error ");
console.log(err);
},
complete: function () {
$("#overlay").fadeOut(300);
},
});
}
</script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/Swiper/5.4.5/js/swiper.min.js'></script>
<script>
swiperTabsNav = new Swiper('.swiper-tabs-nav', {
spaceBetween: 0,
slidesPerView: 3
});
// Swiper Content
swiperTabsContent = new Swiper('.swiper-tabs-content', {
spaceBetween: 0,
thumbs: {
swiper: swiperTabsNav,
}
});
</script>Editor is loading...