From 810c87e2e0d70e8c4d6f4ac56c36084bdd2c3168 Mon Sep 17 00:00:00 2001
From: aminhashemi92 <aminhashemi92@gmail.com>
Date: Sun, 14 Sep 2025 13:44:03 +0330
Subject: [PATCH] Add well and customer detail modal

---
 .../templates/accounts/customer_list.html     | 239 +++++++++++++++++-
 accounts/urls.py                              |   8 +-
 accounts/views.py                             | 123 +++++++++
 wells/templates/wells/well_list.html          | 204 ++++++++++++++-
 wells/urls.py                                 |   2 +
 wells/views.py                                |  97 +++++++
 6 files changed, 668 insertions(+), 5 deletions(-)

diff --git a/accounts/templates/accounts/customer_list.html b/accounts/templates/accounts/customer_list.html
index 38f2fcc..24f5e5a 100644
--- a/accounts/templates/accounts/customer_list.html
+++ b/accounts/templates/accounts/customer_list.html
@@ -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) {
diff --git a/accounts/urls.py b/accounts/urls.py
index 7c79207..efe27ad 100644
--- a/accounts/urls.py
+++ b/accounts/urls.py
@@ -1,6 +1,9 @@
 from django.urls import path
 
-from accounts.views import login_view, dashboard, customer_list, add_customer_ajax, edit_customer_ajax, get_customer_data, logout_view
+from accounts.views import (
+    login_view, dashboard, customer_list, add_customer_ajax, edit_customer_ajax, 
+    get_customer_data, get_customer_details, get_customer_wells, get_customer_requests, logout_view
+)
 
 app_name = "accounts"
 urlpatterns = [
@@ -11,4 +14,7 @@ urlpatterns = [
     path('customers/add/', add_customer_ajax, name='add_customer_ajax'),
     path('customers/<int:customer_id>/data/', get_customer_data, name='get_customer_data'),
     path('customers/<int:customer_id>/edit/', edit_customer_ajax, name='edit_customer_ajax'),
+    path('customers/<int:customer_id>/details/', get_customer_details, name='get_customer_details'),
+    path('customers/<int:customer_id>/wells/', get_customer_wells, name='get_customer_wells'),
+    path('customers/<int:customer_id>/requests/', get_customer_requests, name='get_customer_requests'),
 ]
\ No newline at end of file
diff --git a/accounts/views.py b/accounts/views.py
index c5bec75..fea6375 100644
--- a/accounts/views.py
+++ b/accounts/views.py
@@ -6,6 +6,7 @@ from django.views.decorators.http import require_POST, require_GET
 from django.views.decorators.csrf import csrf_exempt
 from django import forms
 from django.contrib.auth.decorators import login_required
+from django.urls import reverse
 from accounts.models import Profile
 from accounts.forms import CustomerForm
 from processes.utils import scope_customers_queryset
@@ -174,6 +175,128 @@ def get_customer_data(request, customer_id):
     })
 
 
+@require_GET
+@login_required
+@allowed_roles([UserRoles.ADMIN, UserRoles.BROKER, UserRoles.MANAGER, UserRoles.ACCOUNTANT])
+def get_customer_details(request, customer_id):
+    """جزئیات کامل مشترک برای نمایش در مدال"""
+    customer = get_object_or_404(
+        Profile.objects.select_related('user', 'affairs', 'county', 'broker'),
+        id=customer_id
+    )
+
+    data = {
+        'id': customer.id,
+        'user': {
+            'username': customer.user.username,
+            'first_name': customer.user.first_name or '',
+            'last_name': customer.user.last_name or '',
+            'full_name': customer.user.get_full_name() or customer.user.username,
+            'email': customer.user.email or '',
+            'date_joined': customer.jcreated_date() if customer.user.date_joined else '',
+        },
+        'national_code': customer.national_code or '',
+        'phone_number_1': customer.phone_number_1 or '',
+        'phone_number_2': customer.phone_number_2 or '',
+        'card_number': customer.card_number or '',
+        'account_number': customer.account_number or '',
+        'bank_name': customer.get_bank_name_display() or '',
+        'address': customer.address or '',
+        'pic_url': customer.pic.url if customer.pic else '',
+        'affairs': str(customer.affairs) if customer.affairs else '',
+        'county': str(customer.county) if customer.county else '',
+        'broker': str(customer.broker) if customer.broker else '',
+        'is_completed': customer.is_completed,
+    }
+
+    # تعداد چاه‌ها و درخواست‌ها برای نمایش سریع
+    try:
+        from wells.models import Well
+        from processes.models import ProcessInstance
+        total_wells = Well.objects.filter(representative=customer.user, is_deleted=False).count()
+        total_requests = ProcessInstance.objects.filter(representative=customer.user, is_deleted=False).count()
+    except Exception:
+        total_wells = 0
+        total_requests = 0
+
+    return JsonResponse({
+        'success': True, 
+        'customer': data, 
+        'total_wells': total_wells,
+        'total_requests': total_requests
+    })
+
+
+@require_GET
+@login_required
+@allowed_roles([UserRoles.ADMIN, UserRoles.BROKER, UserRoles.MANAGER, UserRoles.ACCOUNTANT])
+def get_customer_wells(request, customer_id):
+    """چاه‌های مرتبط با یک مشترک"""
+    customer = get_object_or_404(Profile, id=customer_id)
+    
+    try:
+        from wells.models import Well
+        qs = Well.objects.select_related(
+            'water_meter_manufacturer', 'affairs', 'county', 'broker'
+        ).filter(representative=customer.user, is_deleted=False).order_by('-created')
+        
+        items = []
+        for well in qs[:100]:  # محدودسازی برای عملکرد
+            items.append({
+                'id': well.id,
+                'water_subscription_number': well.water_subscription_number,
+                'electricity_subscription_number': well.electricity_subscription_number or '',
+                'water_meter_serial_number': well.water_meter_serial_number or '',
+                'water_meter_manufacturer': str(well.water_meter_manufacturer) if well.water_meter_manufacturer else '',
+                'well_power': well.well_power or '',
+                'affairs': str(well.affairs) if well.affairs else '',
+                'county': str(well.county) if well.county else '',
+                'broker': str(well.broker) if well.broker else '',
+                'created': well.jcreated_date() if hasattr(well, 'created') and well.created else '',
+            })
+    except Exception:
+        items = []
+
+    return JsonResponse({'success': True, 'wells': items})
+
+
+@require_GET
+@login_required
+@allowed_roles([UserRoles.ADMIN, UserRoles.BROKER, UserRoles.MANAGER, UserRoles.ACCOUNTANT])
+def get_customer_requests(request, customer_id):
+    """درخواست‌های مرتبط با یک مشترک"""
+    customer = get_object_or_404(Profile, id=customer_id)
+    
+    try:
+        from processes.models import ProcessInstance
+        qs = ProcessInstance.objects.select_related(
+            'process', 'current_step', 'requester', 'well'
+        ).filter(representative=customer.user, is_deleted=False).order_by('-created')
+        
+        items = []
+        for inst in qs[:100]:  # محدودسازی برای عملکرد
+            try:
+                url = reverse('processes:instance_summary', args=[inst.id]) if inst.status == 'completed' else reverse('processes:instance_steps', args=[inst.id])
+            except Exception:
+                url = ''
+            items.append({
+                'id': inst.id,
+                'code': inst.code,
+                'process': inst.process.name if inst.process else '',
+                'status': inst.status,
+                'status_display': inst.get_status_display(),
+                'current_step': inst.current_step.name if inst.current_step else '',
+                'requester': inst.requester.get_full_name() if inst.requester else '',
+                'well_subscription': inst.well.water_subscription_number if inst.well else '',
+                'created': inst.jcreated_date() if hasattr(inst, 'created') and inst.created else '',
+                'url': url,
+            })
+    except Exception:
+        items = []
+
+    return JsonResponse({'success': True, 'requests': items})
+
+
 @login_required
 def logout_view(request):
     """Log out current user and redirect to login page."""
diff --git a/wells/templates/wells/well_list.html b/wells/templates/wells/well_list.html
index 2215165..1eb585e 100644
--- a/wells/templates/wells/well_list.html
+++ b/wells/templates/wells/well_list.html
@@ -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>'); });
   }
 
   // حذف فایل موجود
diff --git a/wells/urls.py b/wells/urls.py
index f12e685..e08b8dc 100644
--- a/wells/urls.py
+++ b/wells/urls.py
@@ -10,6 +10,8 @@ urlpatterns = [
     path('<int:well_id>/edit/', views.edit_well_ajax, name='edit_well_ajax'),
     path('<int:well_id>/delete/', views.delete_well, name='delete_well'),
     path('<int:well_id>/data/', views.get_well_data, name='get_well_data'),
+    path('<int:well_id>/details/', views.get_well_details, name='get_well_details'),
+    path('<int:well_id>/requests/', views.get_well_requests, name='get_well_requests'),
     
     # شرکت‌های سازنده کنتور آب
     path('manufacturer/create/', views.create_water_meter_manufacturer, name='create_water_meter_manufacturer'),
diff --git a/wells/views.py b/wells/views.py
index 2c9d55b..6bce1cd 100644
--- a/wells/views.py
+++ b/wells/views.py
@@ -1,5 +1,6 @@
 from django.shortcuts import render, get_object_or_404
 from django.http import JsonResponse
+from django.urls import reverse
 from django.views.decorators.http import require_http_methods, require_GET, require_POST
 from django.core.paginator import Paginator
 from django.db.models import Q
@@ -11,6 +12,7 @@ from django.contrib.auth.decorators import login_required
 from common.decorators import allowed_roles
 from common.consts import UserRoles
 from processes.utils import scope_wells_queryset
+from processes.models import ProcessInstance
 
 @login_required
 @allowed_roles([UserRoles.ADMIN, UserRoles.BROKER, UserRoles.MANAGER, UserRoles.ACCOUNTANT])
@@ -195,6 +197,101 @@ def get_well_data(request, well_id):
     })
 
 
+@require_GET
+@login_required
+@allowed_roles([UserRoles.ADMIN, UserRoles.BROKER, UserRoles.MANAGER, UserRoles.ACCOUNTANT])
+def get_well_details(request, well_id):
+    """جزئیات کامل چاه برای نمایش در مدال"""
+    well = get_object_or_404(
+        Well.objects.select_related(
+            'representative', 'water_meter_manufacturer', 'affairs', 'county', 'broker'
+        ),
+        id=well_id
+    )
+
+    lat_long = None
+    try:
+        lat_long_val = well.lat_long()
+        if lat_long_val:
+            # utm.to_latlon returns (lat, lon)
+            lat_long = {
+                'lat': round(float(lat_long_val[0]), 6),
+                'lon': round(float(lat_long_val[1]), 6),
+            }
+    except Exception:
+        lat_long = None
+
+    data = {
+        'id': well.id,
+        'water_subscription_number': well.water_subscription_number,
+        'electricity_subscription_number': well.electricity_subscription_number or '',
+        'representative': {
+            'id': well.representative.id if well.representative else None,
+            'full_name': well.representative.get_full_name() if well.representative else '',
+            'username': well.representative.username if well.representative else '',
+        },
+        'water_meter_serial_number': well.water_meter_serial_number or '',
+        'water_meter_old_serial_number': well.water_meter_old_serial_number or '',
+        'water_meter_manufacturer': str(well.water_meter_manufacturer) if well.water_meter_manufacturer else '',
+        'utm': {
+            'x': str(well.utm_x) if well.utm_x is not None else '',
+            'y': str(well.utm_y) if well.utm_y is not None else '',
+            'zone': well.utm_zone or '',
+            'hemisphere': well.utm_hemisphere or '',
+        },
+        'lat_long': lat_long,
+        'well_power': well.well_power or '',
+        'reference_letter_number': well.reference_letter_number or '',
+        'reference_letter_date': well.reference_letter_date.strftime('%Y-%m-%d') if well.reference_letter_date else '',
+        'representative_letter_file_url': well.representative_letter_file.url if well.representative_letter_file else '',
+        'affairs': str(well.affairs) if well.affairs else '',
+        'county': str(well.county) if well.county else '',
+        'broker': str(well.broker) if well.broker else '',
+    }
+
+    # تعداد درخواست‌ها برای نمایش سریع
+    try:
+        total_requests = ProcessInstance.objects.filter(well_id=well.id, is_deleted=False).count()
+    except Exception:
+        total_requests = 0
+
+    return JsonResponse({'success': True, 'well': data, 'total_requests': total_requests})
+
+
+@require_GET
+@login_required
+@allowed_roles([UserRoles.ADMIN, UserRoles.BROKER, UserRoles.MANAGER, UserRoles.ACCOUNTANT])
+def get_well_requests(request, well_id):
+    """سوابق درخواست‌های مرتبط با یک چاه"""
+    # Scoped access: reuse base scoping by filtering on ProcessInstance via broker/affairs of current user if needed
+    qs = ProcessInstance.objects.select_related(
+        'process', 'current_step', 'requester', 'representative'
+    ).filter(well_id=well_id, is_deleted=False).order_by('-created')
+
+    items = []
+    for inst in qs[:100]:  # محدودسازی برای عملکرد
+        try:
+            url = reverse('processes:instance_summary', args=[inst.id]) if inst.status == 'completed' else reverse('processes:instance_steps', args=[inst.id])
+        except Exception:
+            url = ''
+        items.append({
+            'id': inst.id,
+            'code': inst.code,
+            'process': inst.process.name if inst.process else '',
+            'status': inst.status,
+            'status_display': inst.get_status_display(),
+            'priority': inst.priority,
+            'priority_display': inst.get_priority_display(),
+            'current_step': inst.current_step.name if inst.current_step else '',
+            'requester': inst.requester.get_full_name() if inst.requester else '',
+            'representative': inst.representative.get_full_name() if inst.representative else '',
+            'created': inst.jcreated_date() if hasattr(inst, 'created') and inst.created else '',
+            'url': url,
+        })
+
+    return JsonResponse({'success': True, 'requests': items})
+
+
 @require_POST
 @login_required
 def create_water_meter_manufacturer(request):