Amiali6262's picture
در فرم تعریف تسهیلات بانکی گزینه افزودن اضافه شود - Follow Up Deployment
9fbe144 verified
<!DOCTYPE html>
<html dir="rtl" lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>سیستم مدیریت تسهیلات بانکی</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/persian-datepicker/dist/css/persian-datepicker.min.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/persian-date.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/persian-datepicker/dist/js/persian-datepicker.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/persian-number.min.js"></script>
<style>
@font-face {
font-family: 'IRANSans';
src: url('https://cdn.fontcdn.ir/Font/Persian/IRANSans/IRANSansWeb.eot');
src: url('https://cdn.fontcdn.ir/Font/Persian/IRANSans/IRANSansWeb.eot?#iefix') format('embedded-opentype'),
url('https://cdn.fontcdn.ir/Font/Persian/IRANSans/IRANSansWeb.woff2') format('woff2'),
url('https://cdn.fontcdn.ir/Font/Persian/IRANSans/IRANSansWeb.woff') format('woff'),
url('https://cdn.fontcdn.ir/Font/Persian/IRANSans/IRANSansWeb.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
body {
font-family: 'IRANSans', sans-serif;
}
.table-container {
overflow-x: auto;
}
.active-tab {
background-color: #3b82f6;
color: white;
}
.hidden {
display: none;
}
</style>
</head>
<body class="bg-gray-100">
<div class="container mx-auto px-4 py-8">
<h1 class="text-3xl font-bold text-center mb-8 text-blue-700">سیستم مدیریت تسهیلات بانکی</h1>
<!-- Navigation Tabs -->
<div class="flex mb-6 border-b">
<button id="loanTabBtn" class="px-6 py-2 rounded-t-lg active-tab" onclick="showTab('loanTab')">تعریف تسهیلات</button>
<button id="paymentTabBtn" class="px-6 py-2 rounded-t-lg bg-gray-200" onclick="showTab('paymentTab')">ثبت پرداخت</button>
<button id="reportTabBtn" class="px-6 py-2 rounded-t-lg bg-gray-200" onclick="showTab('reportTab')">گزارش مغایرت</button>
</div>
<!-- Loan Definition Tab -->
<div id="loanTab" class="bg-white p-6 rounded-lg shadow-md">
<h2 class="text-xl font-semibold mb-4 text-blue-600">فرم تعریف تسهیلات بانکی</h2>
<form id="loanForm" class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label for="loanNumber" class="block mb-2 font-medium">شماره تسهیلات</label>
<input type="text" id="loanNumber" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" required>
</div>
<div>
<label for="bankName" class="block mb-2 font-medium">نام بانک</label>
<div class="flex">
<select id="bankName" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" required>
<option value="">انتخاب کنید</option>
<option value="بانک ملی">بانک ملی</option>
<option value="بانک صادرات">بانک صادرات</option>
<option value="بانک ملت">بانک ملت</option>
<option value="بانک تجارت">بانک تجارت</option>
<option value="بانک رفاه">بانک رفاه</option>
<option value="بانک سپه">بانک سپه</option>
<option value="بانک کشاورزی">بانک کشاورزی</option>
<option value="بانک پارسیان">بانک پارسیان</option>
</select>
<button type="button" onclick="showAddBankModal()" class="mr-2 px-3 bg-blue-100 text-blue-600 rounded hover:bg-blue-200">
+
</button>
</div>
</div>
<!-- Add Bank Modal -->
<div id="addBankModal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
<div class="bg-white p-6 rounded-lg shadow-lg w-96">
<h3 class="text-xl font-semibold mb-4">افزودن بانک جدید</h3>
<input type="text" id="newBankName" class="w-full p-2 border rounded mb-4" placeholder="نام بانک">
<div class="flex justify-end">
<button onclick="hideAddBankModal()" class="px-4 py-2 bg-gray-200 rounded mr-2">انصراف</button>
<button onclick="addNewBank()" class="px-4 py-2 bg-blue-600 text-white rounded">ذخیره</button>
</div>
</div>
</div>
<div>
<label for="loanType" class="block mb-2 font-medium">نوع تسهیلات</label>
<select id="loanType" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" required>
<option value="">انتخاب کنید</option>
<option value="مسکن">مسکن</option>
<option value="خودرو">خودرو</option>
<option value="ماده‌ی ۹۱">ماده‌ی ۹۱</option>
<option value="قرض‌الحسنه">قرض‌الحسنه</option>
<option value="تجاری">تجاری</option>
</select>
</div>
<div>
<label for="loanAmount" class="block mb-2 font-medium">مبلغ تسهیلات (ریال)</label>
<input type="text" id="loanAmount" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500 persian-number" required>
</div>
<div>
<label for="installmentCount" class="block mb-2 font-medium">تعداد اقساط</label>
<input type="number" id="installmentCount" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" required>
</div>
<div>
<label for="loanDate" class="block mb-2 font-medium">تاریخ اخذ تسهیلات</label>
<input type="text" id="loanDate" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500 datepicker" required>
</div>
<div>
<label for="installmentAmount" class="block mb-2 font-medium">مبلغ هر قسط (ریال)</label>
<input type="text" id="installmentAmount" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500 persian-number" required>
</div>
<div>
<label for="interestRate" class="block mb-2 font-medium">درصد سود (%)</label>
<input type="number" step="0.01" id="interestRate" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" required>
</div>
<div>
<label for="penaltyRate" class="block mb-2 font-medium">درصد جریمه (%)</label>
<input type="number" step="0.01" id="penaltyRate" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" required>
</div>
<div class="md:col-span-2 flex flex-wrap gap-2">
<button type="submit" class="w-full md:w-auto bg-blue-600 text-white px-6 py-2 rounded hover:bg-blue-700 transition">ذخیره تسهیلات</button>
<button type="button" onclick="generateInstallments()" class="w-full md:w-auto bg-green-600 text-white px-6 py-2 rounded hover:bg-green-700 transition">تولید اقساط</button>
<button type="button" onclick="clearLoanForm()" class="w-full md:w-auto bg-gray-600 text-white px-6 py-2 rounded hover:bg-gray-700 transition">افزودن جدید</button>
</div>
</form>
<div id="installmentsSection" class="mt-8 hidden">
<h3 class="text-lg font-semibold mb-4 text-blue-600">جدول اقساط</h3>
<div class="table-container">
<table id="installmentsTable" class="min-w-full bg-white border">
<thead>
<tr class="bg-gray-200">
<th class="py-2 px-4 border">ردیف</th>
<th class="py-2 px-4 border">تاریخ سررسید</th>
<th class="py-2 px-4 border">مبلغ قسط</th>
<th class="py-2 px-4 border">سود</th>
<th class="py-2 px-4 border">جریمه</th>
<th class="py-2 px-4 border">اصل تسهیلات</th>
</tr>
</thead>
<tbody id="installmentsBody">
<!-- Installments will be added here -->
</tbody>
</table>
</div>
<div class="mt-4">
<button id="saveInstallmentsBtn" class="bg-blue-600 text-white px-6 py-2 rounded hover:bg-blue-700 transition hidden">ذخیره اقساط</button>
</div>
</div>
<!-- Loans List Table -->
<div class="mt-8">
<h3 class="text-lg font-semibold mb-4 text-blue-600">لیست تسهیلات تعریف شده</h3>
<div class="table-container">
<table id="loansTable" class="min-w-full bg-white border">
<thead>
<tr class="bg-gray-200">
<th class="py-2 px-4 border">ردیف</th>
<th class="py-2 px-4 border">شماره تسهیلات</th>
<th class="py-2 px-4 border">بانک</th>
<th class="py-2 px-4 border">نوع تسهیلات</th>
<th class="py-2 px-4 border">مبلغ</th>
<th class="py-2 px-4 border">اقدامات</th>
</tr>
</thead>
<tbody id="loansBody">
<!-- Loans will be added here -->
</tbody>
</table>
</div>
</div>
</div>
<!-- Payment Registration Tab -->
<div id="paymentTab" class="hidden bg-white p-6 rounded-lg shadow-md">
<h2 class="text-xl font-semibold mb-4 text-blue-600">فرم ثبت پرداخت</h2>
<form id="paymentForm" class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label for="paymentLoanNumber" class="block mb-2 font-medium">شماره تسهیلات</label>
<select id="paymentLoanNumber" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" required>
<option value="">انتخاب کنید</option>
<!-- Loans will be populated here -->
</select>
</div>
<div>
<label for="paymentBankName" class="block mb-2 font-medium">نام بانک</label>
<input type="text" id="paymentBankName" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500" readonly>
</div>
<div>
<label for="paymentDate" class="block mb-2 font-medium">تاریخ پرداخت</label>
<input type="text" id="paymentDate" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500 datepicker" required>
</div>
<div>
<label for="paymentAmount" class="block mb-2 font-medium">مبلغ پرداخت (ریال)</label>
<input type="text" id="paymentAmount" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500 persian-number" required>
</div>
<div class="md:col-span-2">
<h3 class="text-lg font-semibold mb-2 text-blue-600">توزیع مبلغ پرداختی</h3>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div>
<label for="principalAmount" class="block mb-2 font-medium">اصل تسهیلات (ریال)</label>
<input type="text" id="principalAmount" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500 persian-number" required>
</div>
<div>
<label for="interestAmount" class="block mb-2 font-medium">سود تسهیلات (ریال)</label>
<input type="text" id="interestAmount" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500 persian-number" required>
</div>
<div>
<label for="penaltyAmount" class="block mb-2 font-medium">جریمه (ریال)</label>
<input type="text" id="penaltyAmount" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500 persian-number">
</div>
</div>
</div>
<div class="md:col-span-2">
<button type="submit" class="w-full md:w-auto bg-blue-600 text-white px-6 py-2 rounded hover:bg-blue-700 transition">ثبت پرداخت</button>
</div>
</form>
<div class="mt-8">
<h3 class="text-lg font-semibold mb-4 text-blue-600">پرداخت‌های ثبت شده</h3>
<div class="table-container">
<table id="paymentsTable" class="min-w-full bg-white border">
<thead>
<tr class="bg-gray-200">
<th class="py-2 px-4 border">ردیف</th>
<th class="py-2 px-4 border">شماره تسهیلات</th>
<th class="py-2 px-4 border">بانک</th>
<th class="py-2 px-4 border">تاریخ پرداخت</th>
<th class="py-2 px-4 border">مبلغ پرداخت</th>
<th class="py-2 px-4 border">اصل</th>
<th class="py-2 px-4 border">سود</th>
<th class="py-2 px-4 border">جریمه</th>
<th class="py-2 px-4 border">اقدامات</th>
</tr>
</thead>
<tbody id="paymentsBody">
<!-- Payments will be added here -->
</tbody>
</table>
</div>
</div>
</div>
<!-- Discrepancy Report Tab -->
<div id="reportTab" class="hidden bg-white p-6 rounded-lg shadow-md">
<h2 class="text-xl font-semibold mb-4 text-blue-600">گزارش مغایرت بانکی</h2>
<form id="reportForm" class="mb-6">
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<div>
<label for="reportLoanNumber" class="block mb-2 font-medium">شماره تسهیلات</label>
<select id="reportLoanNumber" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500">
<option value="">همه تسهیلات</option>
<!-- Loans will be populated here -->
</select>
</div>
<div>
<label for="reportBankName" class="block mb-2 font-medium">بانک</label>
<select id="reportBankName" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500">
<option value="">همه بانک‌ها</option>
<option value="بانک ملی">بانک ملی</option>
<option value="بانک صادرات">بانک صادرات</option>
<option value="بانک ملت">بانک ملت</option>
<option value="بانک تجارت">بانک تجارت</option>
<option value="بانک رفاه">بانک رفاه</option>
<option value="بانک سپه">بانک سپه</option>
<option value="بانک کشاورزی">بانک کشاورزی</option>
<option value="بانک پارسیان">بانک پارسیان</option>
</select>
</div>
<div>
<label for="reportMethod" class="block mb-2 font-medium">روش محاسباتی</label>
<select id="reportMethod" class="w-full p-2 border rounded focus:ring-2 focus:ring-blue-500">
<option value="equal">تقسیم مساوی (اصل/سود/جریمه)</option>
<option value="interestFirst">پرداخت سود و جریمه قبل از اصل</option>
</select>
</div>
</div>
<div class="mt-4">
<button type="button" onclick="generateReport()" class="w-full md:w-auto bg-blue-600 text-white px-6 py-2 rounded hover:bg-blue-700 transition">تهیه گزارش</button>
</div>
</form>
<div id="reportResult" class="hidden">
<h3 class="text-lg font-semibold mb-4 text-blue-600">نتایج گزارش مغایرت</h3>
<div class="mb-4 p-4 bg-blue-50 rounded">
<p id="summaryText"></p>
</div>
<div class="table-container">
<table id="discrepancyTable" class="min-w-full bg-white border">
<thead>
<tr class="bg-gray-200">
<th class="py-2 px-4 border">ردیف</th>
<th class="py-2 px-4 border">شماره تسهیلات</th>
<th class="py-2 px-4 border">بانک</th>
<th class="py-2 px-4 border">تاریخ پرداخت</th>
<th class="py-2 px-4 border">مبلغ ثبت شده</th>
<th class="py-2 px-4 border">مبلغ محاسبه شده</th>
<th class="py-2 px-4 border">اختلاف</th>
<th class="py-2 px-4 border">نوع اختلاف</th>
</tr>
</thead>
<tbody id="discrepancyBody">
<!-- Report results will be added here -->
</tbody>
</table>
</div>
</div>
</div>
</div>
<script>
// Persian date picker initialization
$(document).ready(function() {
$(".datepicker").pDatepicker({
observer: true,
format: 'YYYY/MM/DD',
initialValue: false
});
// Format Persian numbers
$('.persian-number').on('input', function() {
this.value = persianJs(this.value).englishNumber().toString();
});
});
// Data storage
let loans = [];
let payments = [];
// Switch between tabs
function showTab(tabId) {
document.getElementById('loanTab').classList.add('hidden');
document.getElementById('paymentTab').classList.add('hidden');
document.getElementById('reportTab').classList.add('hidden');
document.getElementById('loanTabBtn').classList.remove('active-tab');
document.getElementById('paymentTabBtn').classList.remove('active-tab');
document.getElementById('reportTabBtn').classList.remove('active-tab');
document.getElementById(tabId).classList.remove('hidden');
document.getElementById(tabId + 'Btn').classList.add('active-tab');
if (tabId === 'paymentTab') {
populateLoanNumbers('paymentLoanNumber');
document.getElementById('paymentBankName').value = '';
} else if (tabId === 'reportTab') {
populateLoanNumbers('reportLoanNumber');
}
}
// Populate loan numbers in dropdowns
function populateLoanNumbers(elementId) {
const selectElement = document.getElementById(elementId);
// Save the current selected value
const currentValue = selectElement.value;
// Clear existing options except the first one
while (selectElement.options.length > 1) {
selectElement.remove(1);
}
// Add loan numbers from the loans array
loans.forEach(loan => {
const option = document.createElement('option');
option.value = loan.loanNumber;
option.textContent = loan.loanNumber;
selectElement.appendChild(option);
});
// Restore the previous selection if it still exists
if (currentValue && Array.from(selectElement.options).some(o => o.value === currentValue)) {
selectElement.value = currentValue;
}
}
// Clear loan form
function clearLoanForm() {
document.getElementById('loanForm').reset();
document.getElementById('installmentsSection').classList.add('hidden');
document.getElementById('saveInstallmentsBtn').classList.add('hidden');
document.getElementById('installmentsBody').innerHTML = '';
}
// Handle loan form submission
document.getElementById('loanForm').addEventListener('submit', function(e) {
e.preventDefault();
const loan = {
loanNumber: document.getElementById('loanNumber').value,
bankName: document.getElementById('bankName').value,
loanType: document.getElementById('loanType').value,
loanDate: document.getElementById('loanDate').value,
loanAmount: parseFloat(document.getElementById('loanAmount').value.replace(/,/g, '')) || 0,
installmentCount: parseInt(document.getElementById('installmentCount').value),
installmentAmount: parseFloat(document.getElementById('installmentAmount').value.replace(/,/g, '')),
interestRate: parseFloat(document.getElementById('interestRate').value),
penaltyRate: parseFloat(document.getElementById('penaltyRate').value),
installments: [],
createdAt: new Date().toISOString()
};
// Validate required fields
if (!loan.loanNumber || !loan.bankName || !loan.loanType || !loan.loanDate ||
isNaN(loan.loanAmount) || isNaN(loan.installmentCount) || isNaN(loan.installmentAmount) ||
isNaN(loan.interestRate) || isNaN(loan.penaltyRate)) {
alert('لطفاً همه فیلدهای فرم را به درستی پر کنید.');
return;
}
// Check if this loan number already exists
const existingIndex = loans.findIndex(l => l.loanNumber === loan.loanNumber);
if (existingIndex !== -1) {
loans[existingIndex] = loan; // Update existing loan
alert('تسهیلات با این شماره قبلاً ثبت شده و اطلاعات آن به‌روزرسانی شد.');
} else {
loans.push(loan); // Add new loan
alert('تسهیلات جدید با موفقیت ثبت شد.');
}
refreshLoansTable();
});
// Format loan amount input
function formatLoanAmount(input) {
let value = input.value.replace(/,/g, '');
if (!value) return;
value = parseInt(value);
if (isNaN(value)) value = 0;
input.value = value.toLocaleString('en-US');
}
// Generate installments
function generateInstallments() {
const loanNumber = document.getElementById('loanNumber').value;
const loanAmountInput = document.getElementById('loanAmount');
const installmentCountInput = document.getElementById('installmentCount');
const installmentAmountInput = document.getElementById('installmentAmount');
const interestRateInput = document.getElementById('interestRate');
// Basic validation
if (!loanNumber) {
alert('لطفاً ابتدا تسهیلات را ذخیره کنید');
return;
}
// Validate required fields have values
if (!loanNumber || !loanAmountInput.value || !installmentCountInput.value ||
!installmentAmountInput.value || !interestRateInput.value) {
alert('لطفاً همه فیلدهای تسهیلات را تکمیل کنید.');
return;
}
// Convert to numeric values
const loanAmount = parseFloat(loanAmountInput.value.replace(/,/g, '')) || 0;
const installmentCount = parseInt(installmentCountInput.value) || 0;
const installmentAmount = parseFloat(installmentAmountInput.value.replace(/,/g, '')) || 0;
const interestRate = parseFloat(interestRateInput.value) || 0;
// Additional validation
if (loanAmount <= 0 || installmentCount <= 0 || installmentAmount <= 0 || interestRate <= 0) {
alert('مقادیر باید بزرگتر از صفر باشند.');
return;
}
const tbody = document.getElementById('installmentsBody');
tbody.innerHTML = '';
const fixedPrincipal = loanAmount / installmentCount;
// Convert Persian numbers to English for calculations
function toEnglishNumber(number) {
return parseFloat(persianJs(number).englishNumber().toString().replace(/,/g, ''));
}
for (let i = 0; i < installmentCount; i++) {
const tr = document.createElement('tr');
tr.className = 'hover:bg-gray-50';
// Row number
const td1 = document.createElement('td');
td1.className = 'py-2 px-4 border text-center';
td1.textContent = i + 1;
// Due date (Persian date picker)
const td2 = document.createElement('td');
td2.className = 'py-2 px-4 border';
const dateInput = document.createElement('input');
dateInput.type = 'text';
dateInput.className = 'w-full p-2 border rounded datepicker';
dateInput.placeholder = 'انتخاب تاریخ';
dateInput.required = true;
// Try to preserve existing date if available
const loanNumber = document.getElementById('loanNumber').value;
const loan = loans.find(l => l.loanNumber === loanNumber);
if (loan && loan.installments && loan.installments[i]) {
dateInput.value = loan.installments[i].dueDate;
}
td2.appendChild(dateInput);
$(dateInput).pDatepicker({
observer: true,
format: 'YYYY/MM/DD',
initialValue: false
});
// Installment amount (fixed)
const td3 = document.createElement('td');
td3.className = 'py-2 px-4 border text-left';
td3.textContent = installmentAmount.toLocaleString('fa-IR');
// Interest amount
const td4 = document.createElement('td');
td4.className = 'py-2 px-4 border text-left';
const remainingAmount = loanAmount - (fixedPrincipal * i);
const interest = Math.round((remainingAmount * interestRate / 100) / 12);
td4.textContent = interest.toLocaleString('fa-IR');
// Penalty amount
const td5 = document.createElement('td');
td5.className = 'py-2 px-4 border text-left';
td5.textContent = '۰';
// Principal amount
const td6 = document.createElement('td');
td6.className = 'py-2 px-4 border text-left';
td6.textContent = (installmentAmount - interest).toLocaleString('fa-IR');
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
tr.appendChild(td4);
tr.appendChild(td5);
tr.appendChild(td6);
tbody.appendChild(tr);
}
// Show save button if we have installments
if (installmentCount > 0) {
document.getElementById('saveInstallmentsBtn').classList.remove('hidden');
} else {
document.getElementById('saveInstallmentsBtn').classList.add('hidden');
}
}
// Bank management functions
function showAddBankModal() {
document.getElementById('addBankModal').classList.remove('hidden');
}
function hideAddBankModal() {
document.getElementById('addBankModal').classList.add('hidden');
document.getElementById('newBankName').value = '';
}
function addNewBank() {
const bankName = document.getElementById('newBankName').value.trim();
if (!bankName) {
alert('لطفاً نام بانک را وارد کنید.');
return;
}
const select = document.getElementById('bankName');
const option = document.createElement('option');
option.value = bankName;
option.textContent = bankName;
select.appendChild(option);
select.value = bankName;
hideAddBankModal();
}
// Load loans into the table
function refreshLoansTable() {
const tbody = document.getElementById('loansBody');
tbody.innerHTML = '';
loans.forEach((loan, index) => {
const tr = document.createElement('tr');
tr.className = 'hover:bg-gray-50';
const td1 = document.createElement('td');
td1.className = 'py-2 px-4 border text-center';
td1.textContent = index + 1;
const td2 = document.createElement('td');
td2.className = 'py-2 px-4 border text-center';
td2.textContent = loan.loanNumber;
const td3 = document.createElement('td');
td3.className = 'py-2 px-4 border';
td3.textContent = loan.bankName;
const td4 = document.createElement('td');
td4.className = 'py-2 px-4 border';
td4.textContent = loan.loanType;
const td5 = document.createElement('td');
td5.className = 'py-2 px-4 border text-left';
td5.textContent = loan.loanAmount.toLocaleString('fa-IR');
const td6 = document.createElement('td');
td6.className = 'py-2 px-4 border text-center';
const editBtn = document.createElement('button');
editBtn.className = 'text-blue-600 hover:text-blue-800 ml-2';
editBtn.innerHTML = 'ویرایش';
editBtn.addEventListener('click', () => editLoan(index));
const deleteBtn = document.createElement('button');
deleteBtn.className = 'text-red-600 hover:text-red-800';
deleteBtn.innerHTML = 'حذف';
deleteBtn.addEventListener('click', () => deleteLoan(index));
td6.appendChild(editBtn);
td6.appendChild(deleteBtn);
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
tr.appendChild(td4);
tr.appendChild(td5);
tr.appendChild(td6);
tbody.appendChild(tr);
});
}
// Edit a loan
function editLoan(index) {
const loan = loans[index];
document.getElementById('loanNumber').value = loan.loanNumber;
document.getElementById('bankName').value = loan.bankName;
document.getElementById('loanType').value = loan.loanType;
document.getElementById('loanAmount').value = loan.loanAmount.toLocaleString('en-US');
document.getElementById('installmentCount').value = loan.installmentCount;
document.getElementById('installmentAmount').value = loan.installmentAmount.toLocaleString('en-US');
document.getElementById('loanDate').value = loan.loanDate;
document.getElementById('interestRate').value = loan.interestRate;
document.getElementById('penaltyRate').value = loan.penaltyRate;
// Show installments section if it has installments
if (loan.installments && loan.installments.length > 0) {
document.getElementById('installmentsSection').classList.remove('hidden');
document.getElementById('saveInstallmentsBtn').classList.remove('hidden');
const tbody = document.getElementById('installmentsBody');
tbody.innerHTML = '';
loan.installments.forEach((inst, idx) => {
const tr = document.createElement('tr');
tr.className = 'hover:bg-gray-50';
// Row number
const td1 = document.createElement('td');
td1.className = 'py-2 px-4 border text-center';
td1.textContent = idx + 1;
// Due date
const td2 = document.createElement('td');
td2.className = 'py-2 px-4 border';
const dateInput = document.createElement('input');
dateInput.type = 'text';
dateInput.className = 'w-full p-2 border rounded datepicker';
dateInput.value = inst.dueDate;
dateInput.required = true;
td2.appendChild(dateInput);
$(dateInput).pDatepicker({
observer: true,
format: 'YYYY/MM/DD',
initialValue: false
});
// Installment amount
const td3 = document.createElement('td');
td3.className = 'py-2 px-4 border text-left';
td3.textContent = inst.amount.toLocaleString('fa-IR');
// Interest amount
const td4 = document.createElement('td');
td4.className = 'py-2 px-4 border text-left';
td4.textContent = inst.interest.toLocaleString('fa-IR');
// Penalty amount
const td5 = document.createElement('td');
td5.className = 'py-2 px-4 border text-left';
td5.textContent = inst.penalty.toLocaleString('fa-IR');
// Principal amount
const td6 = document.createElement('td');
td6.className = 'py-2 px-4 border text-left';
td6.textContent = inst.principal.toLocaleString('fa-IR');
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
tr.appendChild(td4);
tr.appendChild(td5);
tr.appendChild(td6);
tbody.appendChild(tr);
});
}
// Scroll to form
document.getElementById('loanTab').scrollIntoView({behavior: 'smooth'});
}
// Delete a loan
function deleteLoan(index) {
if (confirm('آیا از حذف این تسهیلات مطمئن هستید؟')) {
loans.splice(index, 1);
refreshLoansTable();
// Also refresh payment and report dropdowns if open
if (!document.getElementById('paymentTab').classList.contains('hidden')) {
populateLoanNumbers('paymentLoanNumber');
}
if (!document.getElementById('reportTab').classList.contains('hidden')) {
populateLoanNumbers('reportLoanNumber');
}
alert('تسهیلات با موفقیت حذف شد.');
}
}
// Save installments
document.getElementById('saveInstallmentsBtn').addEventListener('click', function() {
const loanNumber = document.getElementById('loanNumber').value;
const loanIndex = loans.findIndex(l => l.loanNumber === loanNumber);
if (loanIndex === -1) {
alert('تسهیلات یافت نشد.');
return;
}
const rows = document.getElementById('installmentsBody').rows;
const installments = [];
for (let i = 0; i < rows.length; i++) {
const cells = rows[i].cells;
const installment = {
number: i + 1,
dueDate: cells[1].querySelector('input').value,
amount: parseFloat(document.getElementById('installmentAmount').value.replace(/,/g, '')),
interest: parseFloat(persianJs(cells[3].textContent).englishNumber().toString().replace(/,/g, '')),
penalty: parseFloat(persianJs(cells[4].textContent).englishNumber().toString().replace(/,/g, '')),
principal: parseFloat(persianJs(cells[5].textContent).englishNumber().toString().replace(/,/g, ''))
};
installments.push(installment);
}
loans[loanIndex].installments = installments;
alert('اقساط با موفقیت ذخیره شدند.');
});
// Update bank name when loan number is selected in payment form
document.getElementById('paymentLoanNumber').addEventListener('change', function() {
const loanNumber = this.value;
if (!loanNumber) {
document.getElementById('paymentBankName').value = '';
return;
}
const loan = loans.find(l => l.loanNumber === loanNumber);
if (loan) {
document.getElementById('paymentBankName').value = loan.bankName;
}
});
// Handle payment form submission
document.getElementById('paymentForm').addEventListener('submit', function(e) {
e.preventDefault();
const payment = {
loanNumber: document.getElementById('paymentLoanNumber').value,
bankName: document.getElementById('paymentBankName').value,
paymentDate: document.getElementById('paymentDate').value,
paymentAmount: parseFloat(document.getElementById('paymentAmount').value.replace(/,/g, '')),
principalAmount: parseFloat(document.getElementById('principalAmount').value.replace(/,/g, '')),
interestAmount: parseFloat(document.getElementById('interestAmount').value.replace(/,/g, '')),
penaltyAmount: parseFloat((document.getElementById('penaltyAmount').value || '').replace(/,/g, '')) || 0,
createdAt: new Date().toISOString()
};
// Make generateInstallments button work
document.querySelector('button[onclick="generateInstallments()"]').addEventListener('click', function(e) {
e.preventDefault();
generateInstallments();
document.getElementById('installmentsSection').classList.remove('hidden');
});
// Validate payment
const calculatedTotal = payment.principalAmount + payment.interestAmount + payment.penaltyAmount;
if (Math.abs(calculatedTotal - payment.paymentAmount) > 1) {
alert(`جمع مبالغ جزء (${calculatedTotal.toLocaleString('fa-IR')}) با مبلغ کل پرداختی (${payment.paymentAmount.toLocaleString('fa-IR')}) مغایرت دارد.`);
return;
}
payments.push(payment);
addPaymentToTable(payment);
// Clear the form (except for loan number)
document.getElementById('paymentDate').value = '';
document.getElementById('paymentAmount').value = '';
document.getElementById('principalAmount').value = '';
document.getElementById('interestAmount').value = '';
document.getElementById('penaltyAmount').value = '';
alert('پرداخت با موفقیت ثبت شد.');
});
// Add payment to payments table
function addPaymentToTable(payment) {
const tbody = document.getElementById('paymentsBody');
const tr = document.createElement('tr');
tr.className = 'hover:bg-gray-50';
tr.dataset.paymentId = payments.length - 1;
const td1 = document.createElement('td');
td1.className = 'py-2 px-4 border text-center';
td1.textContent = payments.length;
const td2 = document.createElement('td');
td2.className = 'py-2 px-4 border text-center';
td2.textContent = payment.loanNumber;
const td3 = document.createElement('td');
td3.className = 'py-2 px-4 border';
td3.textContent = payment.bankName;
const td4 = document.createElement('td');
td4.className = 'py-2 px-4 border text-center';
td4.textContent = payment.paymentDate;
const td5 = document.createElement('td');
td5.className = 'py-2 px-4 border text-left';
td5.textContent = payment.paymentAmount.toLocaleString('fa-IR');
const td6 = document.createElement('td');
td6.className = 'py-2 px-4 border text-left';
td6.textContent = payment.principalAmount.toLocaleString('fa-IR');
const td7 = document.createElement('td');
td7.className = 'py-2 px-4 border text-left';
td7.textContent = payment.interestAmount.toLocaleString('fa-IR');
const td8 = document.createElement('td');
td8.className = 'py-2 px-4 border text-left';
td8.textContent = payment.penaltyAmount.toLocaleString('fa-IR');
const td9 = document.createElement('td');
td9.className = 'py-2 px-4 border text-center';
const deleteBtn = document.createElement('button');
deleteBtn.className = 'text-red-600 hover:text-red-800';
deleteBtn.innerHTML = 'حذف';
deleteBtn.addEventListener('click', function() {
deletePayment(this.closest('tr').dataset.paymentId);
});
td9.appendChild(deleteBtn);
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
tr.appendChild(td4);
tr.appendChild(td5);
tr.appendChild(td6);
tr.appendChild(td7);
tr.appendChild(td8);
tr.appendChild(td9);
tbody.appendChild(tr);
}
// Delete a payment
function deletePayment(paymentId) {
if (confirm('آیا از حذف این پرداخت مطمئن هستید؟')) {
payments.splice(paymentId, 1);
refreshPaymentsTable();
// Reindex payments
payments = payments.map((payment, index) => {
return {...payment, id: index};
});
}
}
// Refresh payments table
function refreshPaymentsTable() {
const tbody = document.getElementById('paymentsBody');
tbody.innerHTML = '';
payments.forEach((payment, index) => {
payment.id = index; // Update payment ID
addPaymentToTable(payment);
});
}
// Generate discrepancy report
function generateReport() {
const loanNumberFilter = document.getElementById('reportLoanNumber').value;
const bankNameFilter = document.getElementById('reportBankName').value;
const method = document.getElementById('reportMethod').value;
// Filter payments
let filteredPayments = [...payments];
if (loanNumberFilter) {
filteredPayments = filteredPayments.filter(p => p.loanNumber === loanNumberFilter);
}
if (bankNameFilter) {
filteredPayments = filteredPayments.filter(p => p.bankName === bankNameFilter);
}
if (filteredPayments.length === 0) {
alert('با فیلترهای انتخاب شده پرداختی یافت نشد.');
return;
}
// Process each payment based on the selected method
const discrepancies = [];
filteredPayments.forEach(payment => {
const loan = loans.find(l => l.loanNumber === payment.loanNumber);
if (!loan) return;
if (method === 'equal') {
// Equal distribution method
const calculatedPrincipal = Math.round(payment.paymentAmount / 3);
const calculatedInterest = Math.round(payment.paymentAmount / 3);
const calculatedPenalty = Math.round(payment.paymentAmount / 3);
// Calculate differences
const principalDiff = payment.principalAmount - calculatedPrincipal;
const interestDiff = payment.interestAmount - calculatedInterest;
const penaltyDiff = payment.penaltyAmount - calculatedPenalty;
if (principalDiff !== 0 || interestDiff !== 0 || penaltyDiff !== 0) {
discrepancies.push({
loanNumber: payment.loanNumber,
bankName: payment.bankName,
paymentDate: payment.paymentDate,
recordedAmount: `${payment.principalAmount.toLocaleString('fa-IR')} + ${payment.interestAmount.toLocaleString('fa-IR')} + ${payment.penaltyAmount.toLocaleString('fa-IR')}`,
calculatedAmount: `${calculatedPrincipal.toLocaleString('fa-IR')} + ${calculatedInterest.toLocaleString('fa-IR')} + ${calculatedPenalty.toLocaleString('fa-IR')}`,
difference: (principalDiff + interestDiff + penaltyDiff).toLocaleString('fa-IR'),
type: 'تقسیم مساوی'
});
}
} else if (method === 'interestFirst') {
// Interest and penalty first method
// 1. Apply to penalty
const remainingAfterPenalty = Math.max(0, payment.paymentAmount - payment.penaltyAmount);
// 2. Apply to interest
const remainingAfterInterest = Math.max(0, remainingAfterPenalty - payment.interestAmount);
// 3. Remainder goes to principal
const calculatedPrincipal = remainingAfterInterest;
const calculatedInterest = payment.interestAmount;
const calculatedPenalty = payment.penaltyAmount;
// Calculate differences
const principalDiff = payment.principalAmount - calculatedPrincipal;
const interestDiff = 0; // No difference in interest as we use the exact amount
const penaltyDiff = 0; // No difference in penalty as we use the exact amount
if (principalDiff !== 0 || interestDiff !== 0 || penaltyDiff !== 0) {
discrepancies.push({
loanNumber: payment.loanNumber,
bankName: payment.bankName,
paymentDate: payment.paymentDate,
recordedAmount: `${payment.principalAmount.toLocaleString('fa-IR')} + ${payment.interestAmount.toLocaleString('fa-IR')} + ${payment.penaltyAmount.toLocaleString('fa-IR')}`,
calculatedAmount: `${calculatedPrincipal.toLocaleString('fa-IR')} + ${calculatedInterest.toLocaleString('fa-IR')} + ${calculatedPenalty.toLocaleString('fa-IR')}`,
difference: (principalDiff + interestDiff + penaltyDiff).toLocaleString('fa-IR'),
type: 'سود و جریمه قبل از اصل'
});
}
}
});
// Display results
if (discrepancies.length === 0) {
document.getElementById('summaryText').textContent = `هیچ مغایرتی با روش "${method === 'equal' ? 'تقسیم مساوی' : 'سود و جریمه قبل از اصل'}" یافت نشد.`;
document.getElementById('discrepancyBody').innerHTML = '';
} else {
document.getElementById('summaryText').textContent = `${discrepancies.length} مغایرت با روش "${method === 'equal' ? 'تقسیم مساوی' : 'سود و جریمه قبل از اصل'}" یافت شد.`;
const tbody = document.getElementById('discrepancyBody');
tbody.innerHTML = '';
discrepancies.forEach((item, index) => {
const tr = document.createElement('tr');
tr.className = 'hover:bg-gray-50';
const td1 = document.createElement('td');
td1.className = 'py-2 px-4 border text-center';
td1.textContent = index + 1;
const td2 = document.createElement('td');
td2.className = 'py-2 px-4 border text-center';
td2.textContent = item.loanNumber;
const td3 = document.createElement('td');
td3.className = 'py-2 px-4 border';
td3.textContent = item.bankName;
const td4 = document.createElement('td');
td4.className = 'py-2 px-4 border text-center';
td4.textContent = item.paymentDate;
const td5 = document.createElement('td');
td5.className = 'py-2 px-4 border text-left';
td5.textContent = item.recordedAmount;
const td6 = document.createElement('td');
td6.className = 'py-2 px-4 border text-left';
td6.textContent = item.calculatedAmount;
const td7 = document.createElement('td');
td7.className = 'py-2 px-4 border text-left';
td7.textContent = item.difference;
const td8 = document.createElement('td');
td8.className = 'py-2 px-4 border';
td8.textContent = item.type;
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
tr.appendChild(td4);
tr.appendChild(td5);
tr.appendChild(td6);
tr.appendChild(td7);
tr.appendChild(td8);
tbody.appendChild(tr);
});
}
document.getElementById('reportResult').classList.remove('hidden');
}
</script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Amiali6262/https-huggingface-co-amiali62623" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>