Add well and customer detail modal
This commit is contained in:
parent
4df61c8a01
commit
810c87e2e0
6 changed files with 668 additions and 5 deletions
|
|
@ -338,6 +338,134 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Well Details Modal -->
|
||||
<div class="modal fade" id="wellDetailsModal" tabindex="-1" aria-labelledby="wellDetailsModalLabel" 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="wellDetailsModalLabel">جزئیات چاه</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div id="well-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="well-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-droplet me-1"></i>شماره اشتراک آب</td>
|
||||
<td><strong id="wd-water-sub">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class='bx bx-bolt-circle me-1'></i>شماره اشتراک برق</td>
|
||||
<td><strong id="wd-elec-sub">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-user me-1"></i>نماینده</td>
|
||||
<td><strong id="wd-rep">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-briefcase me-1"></i>کارگزار</td>
|
||||
<td><strong id="wd-broker">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-buildings me-1"></i>امور</td>
|
||||
<td><strong id="wd-affairs">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-map me-1"></i>شهرستان</td>
|
||||
<td><strong id="wd-county">-</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-barcode me-1"></i>سریال کنتور</td>
|
||||
<td><strong id="wd-meter-serial">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-barcode me-1"></i>سریال قدیمی</td>
|
||||
<td><strong id="wd-meter-serial-old">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-factory me-1"></i>شرکت سازنده</td>
|
||||
<td><strong id="wd-meter-maker">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-tachometer me-1"></i>قدرت چاه</td>
|
||||
<td><strong id="wd-power">-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-current-location me-1"></i>مختصات</td>
|
||||
<td>
|
||||
<div><small class="text-muted">X:</small> <span id="wd-utm-x">-</span></div>
|
||||
<div><small class="text-muted">Y:</small> <span id="wd-utm-y">-</span></div>
|
||||
<div><small class="text-muted">زون:</small> <span id="wd-utm-zone">-</span> <span id="wd-utm-hem">-</span></div>
|
||||
<div id="wd-latlon-row" style="display:none;"><small class="text-muted">Lat/Lon:</small> <span id="wd-latlon">-</span></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-muted"><i class="bx bx-file me-1"></i>نامه نمایندگی</td>
|
||||
<td>
|
||||
<a id="wd-letter-link" href="#" target="_blank" class="btn btn-sm btn-outline-primary" style="display:none;"><i class="bx bx-file me-1"></i>مشاهده</a>
|
||||
<span id="wd-letter-missing" class="text-muted">-</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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="wd-req-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="wd-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">
|
||||
|
|
@ -556,8 +684,80 @@
|
|||
|
||||
// Well functions
|
||||
function viewWell(id) {
|
||||
// Implement view functionality
|
||||
showToast('قابلیت مشاهده جزئیات به زودی اضافه خواهد شد', 'info');
|
||||
currentWellId = id;
|
||||
const modalEl = document.getElementById('wellDetailsModal');
|
||||
const modal = new bootstrap.Modal(modalEl);
|
||||
// reset content
|
||||
$('#well-details-content').hide();
|
||||
$('#well-details-loading').show();
|
||||
$('#wd-requests-body').html('<tr><td class="text-center py-3" colspan="7"><span class="text-muted">در حال بارگذاری...</span></td></tr>');
|
||||
$('#wd-req-count').text('0');
|
||||
$('#wd-letter-link').hide();
|
||||
$('#wd-letter-missing').show();
|
||||
modal.show();
|
||||
|
||||
// Fetch well details
|
||||
$.get('{% url "wells:get_well_details" 0 %}'.replace('0', id))
|
||||
.done(function(resp){
|
||||
if (!resp.success) { showToast('خطا در دریافت جزئیات چاه', 'danger'); return; }
|
||||
const w = resp.well;
|
||||
$('#wellDetailsModalLabel').text('جزئیات چاه ' + (w.water_subscription_number || ''));
|
||||
$('#wd-water-sub').text(w.water_subscription_number || '-');
|
||||
$('#wd-elec-sub').text(w.electricity_subscription_number || '-');
|
||||
$('#wd-rep').text((w.representative && (w.representative.full_name || w.representative.username)) || '-');
|
||||
$('#wd-broker').text(w.broker || '-');
|
||||
$('#wd-affairs').text(w.affairs || '-');
|
||||
$('#wd-county').text(w.county || '-');
|
||||
$('#wd-meter-serial').text(w.water_meter_serial_number || '-');
|
||||
$('#wd-meter-serial-old').text(w.water_meter_old_serial_number || '-');
|
||||
$('#wd-meter-maker').text(w.water_meter_manufacturer || '-');
|
||||
$('#wd-power').text(w.well_power || '-');
|
||||
$('#wd-utm-x').text((w.utm && w.utm.x) || '-');
|
||||
$('#wd-utm-y').text((w.utm && w.utm.y) || '-');
|
||||
$('#wd-utm-zone').text((w.utm && w.utm.zone) || '-');
|
||||
$('#wd-utm-hem').text((w.utm && w.utm.hemisphere) || '-');
|
||||
if (w.lat_long && w.lat_long.lat !== undefined) {
|
||||
$('#wd-latlon').text(w.lat_long.lat + ', ' + w.lat_long.lon);
|
||||
$('#wd-latlon-row').show();
|
||||
} else {
|
||||
$('#wd-latlon-row').hide();
|
||||
}
|
||||
if (w.representative_letter_file_url) {
|
||||
$('#wd-letter-link').attr('href', w.representative_letter_file_url).show();
|
||||
$('#wd-letter-missing').hide();
|
||||
}
|
||||
$('#wd-req-count').text(resp.total_requests || '0');
|
||||
$('#well-details-loading').hide();
|
||||
$('#well-details-content').show();
|
||||
})
|
||||
.fail(function(){ showToast('خطا در ارتباط با سرور', 'danger'); $('#well-details-loading').hide(); });
|
||||
|
||||
// Fetch requests
|
||||
$.get('{% url "wells:get_well_requests" 0 %}'.replace('0', id))
|
||||
.done(function(resp){
|
||||
if (!resp.success) { $('#wd-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 rep = r.representative || '-';
|
||||
return '<tr>'+
|
||||
'<td>'+ (r.code || '-') +'</td>'+
|
||||
'<td>'+ (r.process || '-') +'</td>'+
|
||||
'<td>'+ step +'</td>'+
|
||||
'<td>'+ status +'</td>'+
|
||||
'<td>'+ rep +'</td>'+
|
||||
'<td>'+ (r.created || '-') +'</td>'+
|
||||
'<td><a class="btn btn-sm btn-outline-primary" href="'+ href +'" target="_blank">جزئیات</a></td>'+
|
||||
'</tr>';
|
||||
});
|
||||
if (!rows.length) {
|
||||
$('#wd-requests-body').html('<tr><td class="text-center py-3" colspan="7"><span class="text-muted">رکوردی یافت نشد</span></td></tr>');
|
||||
} else {
|
||||
$('#wd-requests-body').html(rows.join(''));
|
||||
}
|
||||
})
|
||||
.fail(function(){ $('#wd-requests-body').html('<tr><td class="text-center py-3" colspan="7"><span class="text-danger">خطا در بارگذاری سوابق</span></td></tr>'); });
|
||||
}
|
||||
|
||||
// حذف فایل موجود
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue