Add well and customer detail modal
This commit is contained in:
parent
4df61c8a01
commit
810c87e2e0
6 changed files with 668 additions and 5 deletions
|
|
@ -313,6 +313,153 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Customer Details Modal -->
|
||||
<div class="modal fade" id="customerDetailsModal" tabindex="-1" aria-labelledby="customerDetailsModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-xl modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="customerDetailsModalLabel">جزئیات مشترک</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div id="customer-details-loading" class="text-center py-4" style="display:none;">
|
||||
<div class="spinner-border" role="status"></div>
|
||||
<div class="mt-2">در حال بارگذاری...</div>
|
||||
</div>
|
||||
|
||||
<div id="customer-details-content" style="display:none;">
|
||||
<div class="card mb-4">
|
||||
<div class="card-body">
|
||||
<h6 class="fw-bold mb-3 text-primary">مشخصات مشترک</h6>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<table class="table table-borderless table-sm mb-0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="text-muted" style="width: 40%;"><i class="bx bx-user me-1"></i>نام کاربری</td>
|
||||
<td><strong id="cd-username">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-id-card me-1"></i>نام و نام خانوادگی</td>
|
||||
<td><strong id="cd-fullname">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-fingerprint me-1"></i>کد ملی</td>
|
||||
<td><strong id="cd-national-code">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-phone me-1"></i>شماره تلفن اول</td>
|
||||
<td><strong id="cd-phone1">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-phone me-1"></i>شماره تلفن دوم</td>
|
||||
<td><strong id="cd-phone2">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-envelope me-1"></i>ایمیل</td>
|
||||
<td><strong id="cd-email">-</strong></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<table class="table table-borderless table-sm mb-0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="text-muted" style="width: 40%;"><i class="bx bx-credit-card me-1"></i>شماره کارت</td>
|
||||
<td><strong id="cd-card">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-wallet me-1"></i>شماره حساب</td>
|
||||
<td><strong id="cd-account">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-bank me-1"></i>نام بانک</td>
|
||||
<td><strong id="cd-bank">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-map me-1"></i>آدرس</td>
|
||||
<td><strong id="cd-address">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-calendar me-1"></i>تاریخ عضویت</td>
|
||||
<td><strong id="cd-joined">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-check-circle me-1"></i>وضعیت</td>
|
||||
<td><span id="cd-status" class="badge">-</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Wells Section -->
|
||||
<div class="card mb-4">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h6 class="mb-0 fw-bold">چاههای مشترک
|
||||
<span class="badge bg-label-primary" id="cd-wells-count">0</span>
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>شماره اشتراک آب</th>
|
||||
<th>شماره اشتراک برق</th>
|
||||
<th>سریال کنتور</th>
|
||||
<th>شرکت سازنده</th>
|
||||
<th>تاریخ ایجاد</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="cd-wells-body">
|
||||
<tr><td class="text-center py-3" colspan="5"><span class="text-muted">رکوردی یافت نشد</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Requests Section -->
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h6 class="mb-0 fw-bold">درخواستهای مشترک
|
||||
<span class="badge bg-label-primary" id="cd-requests-count">0</span>
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>کد</th>
|
||||
<th>فرآیند</th>
|
||||
<th>چاه</th>
|
||||
<th>مرحله فعلی</th>
|
||||
<th>وضعیت</th>
|
||||
<th>تاریخ ایجاد</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="cd-requests-body">
|
||||
<tr><td class="text-center py-3" colspan="7"><span class="text-muted">رکوردی یافت نشد</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">بستن</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Delete Confirmation Modal -->
|
||||
<div class="modal fade" id="deleteConfirmModal" tabindex="-1" aria-labelledby="deleteConfirmModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
|
|
@ -436,8 +583,96 @@
|
|||
|
||||
// Customer functions
|
||||
function viewCustomer(id) {
|
||||
// Implement view functionality
|
||||
console.log('View customer:', id);
|
||||
const modalEl = document.getElementById('customerDetailsModal');
|
||||
const modal = new bootstrap.Modal(modalEl);
|
||||
// reset content
|
||||
$('#customer-details-content').hide();
|
||||
$('#customer-details-loading').show();
|
||||
$('#cd-wells-body').html('<tr><td class="text-center py-3" colspan="5"><span class="text-muted">در حال بارگذاری...</span></td></tr>');
|
||||
$('#cd-requests-body').html('<tr><td class="text-center py-3" colspan="7"><span class="text-muted">در حال بارگذاری...</span></td></tr>');
|
||||
$('#cd-wells-count').text('0');
|
||||
$('#cd-requests-count').text('0');
|
||||
modal.show();
|
||||
|
||||
// Fetch customer details
|
||||
$.get('{% url "accounts:get_customer_details" 0 %}'.replace('0', id))
|
||||
.done(function(resp){
|
||||
if (!resp.success) { showToast('خطا در دریافت جزئیات مشترک', 'danger'); return; }
|
||||
const c = resp.customer;
|
||||
$('#customerDetailsModalLabel').text('جزئیات مشترک ' + (c.user.full_name || c.user.username));
|
||||
$('#cd-username').text(c.user.username || '-');
|
||||
$('#cd-fullname').text(c.user.full_name || '-');
|
||||
$('#cd-national-code').text(c.national_code || '-');
|
||||
$('#cd-phone1').text(c.phone_number_1 || '-');
|
||||
$('#cd-phone2').text(c.phone_number_2 || '-');
|
||||
$('#cd-email').text(c.user.email || '-');
|
||||
$('#cd-card').text(c.card_number || '-');
|
||||
$('#cd-account').text(c.account_number || '-');
|
||||
$('#cd-bank').text(c.bank_name || '-');
|
||||
$('#cd-address').text(c.address || '-');
|
||||
$('#cd-joined').text(c.user.date_joined || '-');
|
||||
|
||||
// Status badge
|
||||
if (c.is_completed) {
|
||||
$('#cd-status').removeClass().addClass('badge bg-success').text('تکمیل شده');
|
||||
} else {
|
||||
$('#cd-status').removeClass().addClass('badge bg-warning').text('ناقص');
|
||||
}
|
||||
|
||||
$('#cd-wells-count').text(resp.total_wells || '0');
|
||||
$('#cd-requests-count').text(resp.total_requests || '0');
|
||||
$('#customer-details-loading').hide();
|
||||
$('#customer-details-content').show();
|
||||
})
|
||||
.fail(function(){ showToast('خطا در ارتباط با سرور', 'danger'); $('#customer-details-loading').hide(); });
|
||||
|
||||
// Fetch wells
|
||||
$.get('{% url "accounts:get_customer_wells" 0 %}'.replace('0', id))
|
||||
.done(function(resp){
|
||||
if (!resp.success) { $('#cd-wells-body').html('<tr><td class="text-center py-3" colspan="5"><span class="text-danger">خطا در بارگذاری چاهها</span></td></tr>'); return; }
|
||||
const rows = (resp.wells || []).map(function(w){
|
||||
return '<tr>'+
|
||||
'<td>'+ (w.water_subscription_number || '-') +'</td>'+
|
||||
'<td>'+ (w.electricity_subscription_number || '-') +'</td>'+
|
||||
'<td>'+ (w.water_meter_serial_number || '-') +'</td>'+
|
||||
'<td>'+ (w.water_meter_manufacturer || '-') +'</td>'+
|
||||
'<td>'+ (w.created || '-') +'</td>'+
|
||||
'</tr>';
|
||||
});
|
||||
if (!rows.length) {
|
||||
$('#cd-wells-body').html('<tr><td class="text-center py-3" colspan="5"><span class="text-muted">رکوردی یافت نشد</span></td></tr>');
|
||||
} else {
|
||||
$('#cd-wells-body').html(rows.join(''));
|
||||
}
|
||||
})
|
||||
.fail(function(){ $('#cd-wells-body').html('<tr><td class="text-center py-3" colspan="5"><span class="text-danger">خطا در بارگذاری چاهها</span></td></tr>'); });
|
||||
|
||||
// Fetch requests
|
||||
$.get('{% url "accounts:get_customer_requests" 0 %}'.replace('0', id))
|
||||
.done(function(resp){
|
||||
if (!resp.success) { $('#cd-requests-body').html('<tr><td class="text-center py-3" colspan="7"><span class="text-danger">خطا در بارگذاری درخواستها</span></td></tr>'); return; }
|
||||
const rows = (resp.requests || []).map(function(r){
|
||||
const status = r.status_display || r.status;
|
||||
const step = r.current_step || '-';
|
||||
const href = r.url || '#';
|
||||
const well = r.well_subscription || '-';
|
||||
return '<tr>'+
|
||||
'<td>'+ (r.code || '-') +'</td>'+
|
||||
'<td>'+ (r.process || '-') +'</td>'+
|
||||
'<td>'+ well +'</td>'+
|
||||
'<td>'+ step +'</td>'+
|
||||
'<td>'+ status +'</td>'+
|
||||
'<td>'+ (r.created || '-') +'</td>'+
|
||||
'<td><a class="btn btn-sm btn-outline-primary" href="'+ href +'" target="_blank">جزئیات</a></td>'+
|
||||
'</tr>';
|
||||
});
|
||||
if (!rows.length) {
|
||||
$('#cd-requests-body').html('<tr><td class="text-center py-3" colspan="7"><span class="text-muted">رکوردی یافت نشد</span></td></tr>');
|
||||
} else {
|
||||
$('#cd-requests-body').html(rows.join(''));
|
||||
}
|
||||
})
|
||||
.fail(function(){ $('#cd-requests-body').html('<tr><td class="text-center py-3" colspan="7"><span class="text-danger">خطا در بارگذاری درخواستها</span></td></tr>'); });
|
||||
}
|
||||
|
||||
function editCustomer(id) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue