Add qoute step.

This commit is contained in:
aminhashemi92 2025-08-21 09:18:51 +03:30
parent b71ea45681
commit 6ff4740d04
30 changed files with 3362 additions and 376 deletions

View file

@ -0,0 +1,54 @@
{% load static %}
<div class="bs-stepper-header">
{% for item in steps_context %}
{% with step=item.step status=item.status can_access=item.can_access is_selected=item.is_selected is_todo=item.is_todo %}
<div class="step
{% if not can_access %}disabled
{% elif status == 'completed' %}completed
{% elif is_todo %}active
{% endif %}
{% if is_selected %} selected{% endif %}"
data-target="#step-{{ step.id }}">
{% if can_access %}
<a href="{% url 'processes:step_detail' instance.id step.id %}"
class="step-trigger text-decoration-none p-0"
aria-selected="{% if is_selected %}true{% else %}false{% endif %}">
{% else %}
<span class="step-trigger">
{% endif %}
<span class="bs-stepper-circle">{{ forloop.counter }}</span>
<span class="bs-stepper-label mt-1">
<span class="bs-stepper-title">{{ step.name }}</span>
<span class="bs-stepper-subtitle">{{ step.description|default:' ' }}</span>
</span>
{% if can_access %}
</a>
{% else %}
</span>
{% endif %}
</div>
{% endwith %}
{% if not forloop.last %}<div class="line"></div>{% endif %}
{% endfor %}
</div>
<style>
.step.disabled .step-trigger { opacity: 0.5; cursor: not-allowed; }
.step.disabled .bs-stepper-circle { background-color: #6c757d; }
/* تکمیل شده */
.step.completed .bs-stepper-circle { background-color: #28a745 !important; color: #fff !important; border-color: #28a745 !important; }
.step.completed .bs-stepper-title { color: #28a745 !important; }
/* مرحله‌ای که باید انجام شود (فعلی سیستم) */
.step.active .bs-stepper-circle { background-color: #696cff; color: #fff; }
.step.active .bs-stepper-title { color: #696cff; }
/* مرحله انتخاب‌شده (نمایش فعلی صفحه) */
.step.selected { outline: 1px solid #696cff; border-radius: 8px; }
.step.selected .bs-stepper-circle { box-shadow: 0 0 0 3px rgba(13,202,240,.25); }
</style>

View file

@ -0,0 +1,774 @@
{% extends '_base.html' %}
{% load static %}
{% block sidebar %}
{% include 'sidebars/admin.html' %}
{% endblock sidebar %}
{% block navbar %}
{% include 'navbars/admin.html' %}
{% endblock navbar %}
{% block title %}درخواست‌ها{% endblock %}
{% block style %}
<!-- DataTables CSS -->
<link rel="stylesheet" href="{% static 'assets/vendor/libs/datatables-bs5/datatables.bootstrap5.css' %}">
<link rel="stylesheet" href="{% static 'assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.css' %}">
<link rel="stylesheet" href="{% static 'assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.css' %}">
<!-- Persian Date Picker CSS -->
<link rel="stylesheet" href="https://unpkg.com/persian-datepicker@latest/dist/css/persian-datepicker.min.css">
{% endblock style %}
{% block content %}
{% include '_toasts.html' %}
<div class="container-xxl flex-grow-1 container-p-y">
<div class="d-flex align-items-center justify-content-between mb-3">
<h4 class="mb-0">درخواست‌ها</h4>
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#requestModal">
<i class="bx bx-plus"></i>
درخواست جدید
</button>
</div>
<div class="card">
<div class="table-responsive">
<table id="requestsTable" class="table table-striped">
<thead>
<tr>
<th>شناسه</th>
<th>فرآیند</th>
<th>شماره اشتراک آب</th>
<th>نماینده</th>
<th>درخواست‌کننده</th>
<th>اولویت</th>
<th>وضعیت</th>
<th>تاریخ ایجاد</th>
<th>عملیات</th>
</tr>
</thead>
<tbody>
{% for inst in instances %}
<tr>
<td>{{ inst.code }}</td>
<td>{{ inst.process.name }}</td>
<td>{{ inst.well.water_subscription_number }}</td>
<td>{% if inst.representative %}{{ inst.representative.get_full_name }}{% else %}-{% endif %}</td>
<td>{% if inst.requester %}{{ inst.requester.get_full_name }}{% else %}-{% endif %}</td>
<td>{{ inst.get_priority_display }}</td>
<td>{{ inst.get_status_display }}</td>
<td>{{ inst.jcreated }}</td>
<td>
<div class="d-inline-block">
<a href="javascript:;" class="btn btn-icon dropdown-toggle hide-arrow" data-bs-toggle="dropdown">
<i class="icon-base bx bx-dots-vertical-rounded"></i>
</a>
<ul class="dropdown-menu dropdown-menu-end m-0">
<li>
<a href="{% url 'processes:instance_steps' inst.id %}" class="dropdown-item">
<i class="bx bx-show me-1"></i>مشاهده جزئیات
</a>
</li>
<div class="dropdown-divider"></div>
<li>
<a href="#" class="dropdown-item text-danger" data-instance-id="{{ inst.id }}" data-instance-code="{{ inst.code }}" onclick="deleteRequest(this.getAttribute('data-instance-id'), this.getAttribute('data-instance-code'))">
<i class="bx bx-trash me-1"></i>حذف
</a>
</li>
</ul>
</div>
</td>
</tr>
{% empty %}
<tr>
<td colspan="9" class="text-center text-muted">موردی ثبت نشده است</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="requestModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">درخواست جدید</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<form id="requestForm">
{% csrf_token %}
<div class="row g-3">
<div class="col-sm-12">
<label class="form-label">فرآیند</label>
<select class="form-select" name="process" id="req_process" required>
{% for process in processes %}
<option value="{{ process.id }}">{{ process.name }}</option>
{% endfor %}
</select>
</div>
<hr class="mt-3 border border-dashed">
<div class="col-sm-12">
<label class="form-label">شماره اشتراک آب</label>
<div class="input-group">
<input type="text" class="form-control" id="req_water_sub" placeholder="مثال: 12345" required>
<button class="btn btn-outline-secondary" type="button" id="btnLookupWell">
بررسی/افزودن چاه
</button>
</div>
<div class="form-text" id="wellStatus"></div>
</div>
<!-- Well form fields (from WellForm) -->
<div id="wellFormBlock" class="col-sm-12" style="display:none;">
<div class="row g-3">
<div class="col-sm-6">
<label class="form-label" for="id_electricity_subscription_number">{{ well_form.electricity_subscription_number.label }}</label>
{{ well_form.electricity_subscription_number }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_water_meter_manufacturer">{{ well_form.water_meter_manufacturer.label }}</label>
<div class="input-group">
<select name="water_meter_manufacturer" class="form-select" id="id_water_meter_manufacturer">
<option value="" selected="">انتخاب شرکت سازنده</option>
{% for manufacturer in manufacturers %}
<option value="{{ manufacturer.id }}">{{ manufacturer.name }}</option>
{% endfor %}
</select>
<input type="text" class="form-control" id="id_new_manufacturer" name="new_manufacturer" placeholder="شرکت سازنده جدید" style="display:none;">
<button class="btn btn-outline-primary" type="button" id="btnToggleManufacturer">
<i class="bx bx-plus"></i>
</button>
</div>
</div>
<div class="col-sm-6">
<label class="form-label" for="id_water_meter_serial_number">{{ well_form.water_meter_serial_number.label }}</label>
{{ well_form.water_meter_serial_number }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_water_meter_old_serial_number">{{ well_form.water_meter_old_serial_number.label }}</label>
{{ well_form.water_meter_old_serial_number }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_utm_x">{{ well_form.utm_x.label }}</label>
{{ well_form.utm_x }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_utm_y">{{ well_form.utm_y.label }}</label>
{{ well_form.utm_y }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_utm_zone">{{ well_form.utm_zone.label }}</label>
{{ well_form.utm_zone }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_utm_hemisphere">{{ well_form.utm_hemisphere.label }}</label>
{{ well_form.utm_hemisphere }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_well_power">{{ well_form.well_power.label }}</label>
{{ well_form.well_power }}
</div>
<div class="col-sm-6"></div>
<div class="col-sm-6">
<label class="form-label" for="id_reference_letter_number">{{ well_form.reference_letter_number.label }}</label>
{{ well_form.reference_letter_number }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_reference_letter_date">{{ well_form.reference_letter_date.label }}</label>
<input type="text" class="form-control" id="id_reference_letter_date" name="reference_letter_date" placeholder="انتخاب تاریخ" readonly>
</div>
<div class="col-sm-12">
<label class="form-label" for="id_representative_letter_file">{{ well_form.representative_letter_file.label }}</label>
{{ well_form.representative_letter_file }}
<!-- نمایش فایل موجود -->
<div id="current-file-display" style="display: none; margin-top: 10px;">
<div class="alert alert-info d-flex align-items-center justify-content-between">
<div class="d-flex align-items-center">
<i class="bx bx-file me-2"></i>
<span id="current-file-name" class="text-truncate" style="max-width: 200px;" title=""></span>
</div>
<button type="button" class="btn btn-sm btn-outline-danger" onclick="removeCurrentFile()">
<i class="bx bx-trash me-1"></i>حذف
</button>
</div>
</div>
<input type="hidden" id="remove-file" name="remove_file" value="false">
</div>
</div>
</div>
<hr class="mt-3 border border-dashed">
<div class="col-sm-12">
<label class="form-label">کد ملی نماینده</label>
<div class="input-group">
<input type="text" class="form-control" id="rep_national_code" placeholder="مثال: 0012345678">
<button class="btn btn-outline-secondary" type="button" id="btnLookupRep">
بررسی/افزودن نماینده
</button>
</div>
<div class="form-text" id="repStatus"></div>
</div>
<div id="repNewFields" class="col-sm-12" style="display:none;">
<div class="row g-3">
<div class="col-sm-6">
<label class="form-label" for="id_first_name">{{ customer_form.first_name.label }}</label>
{{ customer_form.first_name }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_last_name">{{ customer_form.last_name.label }}</label>
{{ customer_form.last_name }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_phone_number_1">{{ customer_form.phone_number_1.label }}</label>
{{ customer_form.phone_number_1 }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_phone_number_2">{{ customer_form.phone_number_2.label }}</label>
{{ customer_form.phone_number_2 }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_national_code">{{ customer_form.national_code.label }}</label>
{{ customer_form.national_code }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_card_number">{{ customer_form.card_number.label }}</label>
{{ customer_form.card_number }}
</div>
<div class="col-sm-6">
<label class="form-label" for="id_account_number">{{ customer_form.account_number.label }}</label>
{{ customer_form.account_number }}
</div>
<div class="col-sm-12">
<label class="form-label" for="id_address">{{ customer_form.address.label }}</label>
{{ customer_form.address }}
</div>
</div>
</div>
<hr class="mt-3 border border-dashed">
<div class="col-sm-12">
<label class="form-label">توضیحات</label>
<textarea class="form-control" rows="3" id="req_description"></textarea>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">بستن</button>
<button type="button" class="btn btn-primary" id="btnSaveRequest" disabled>ذخیره</button>
</div>
</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">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="deleteConfirmModalLabel">تایید حذف</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p id="deleteConfirmText">آیا از حذف این درخواست اطمینان دارید؟</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">انصراف</button>
<button type="button" class="btn btn-danger" id="confirmDeleteBtn">حذف</button>
</div>
</div>
</div>
</div>
{% endblock %}
{% block script %}
<!-- DataTables JS -->
<script src="{% static 'assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js' %}"></script>
<!-- Persian DataTable defaults -->
<script src="{% static 'assets/js/persian-datatable.js' %}"></script>
<!-- Persian Date Picker JS -->
<script src="https://unpkg.com/persian-date@latest/dist/persian-date.min.js"></script>
<script src="https://unpkg.com/persian-datepicker@latest/dist/js/persian-datepicker.min.js"></script>
<script>
// Function to initialize Persian Date Picker
function initPersianDatePicker() {
if ($.fn.persianDatepicker && $('#id_reference_letter_date').length) {
try {
$('#id_reference_letter_date').persianDatepicker({
format: 'YYYY/MM/DD',
initialValue: false,
autoClose: true,
persianDigit: false,
observer: true,
calendar: {
persian: {
locale: 'fa',
leapYearMode: 'astronomical'
}
},
onSelect: function(unix) {
// تبدیل تاریخ شمسی به میلادی برای ارسال به سرور
const gregorianDate = new Date(unix);
const year = gregorianDate.getFullYear();
const month = String(gregorianDate.getMonth() + 1).padStart(2, '0');
const day = String(gregorianDate.getDate()).padStart(2, '0');
const gregorianDateString = `${year}-${month}-${day}`;
// نمایش تاریخ شمسی در فیلد
if (window.persianDate) {
const persianDate = new window.persianDate(unix);
const persianDateString = persianDate.format('YYYY/MM/DD');
$('#id_reference_letter_date').val(persianDateString);
} else {
// اگر persianDate در دسترس نبود، تاریخ میلادی را نمایش بده
$('#id_reference_letter_date').val(gregorianDateString);
}
// ذخیره تاریخ میلادی در فیلد مخفی برای ارسال به سرور
$('#id_reference_letter_date').attr('data-gregorian', gregorianDateString);
}
});
} catch (e) {
console.error('Error initializing Persian Date Picker:', e);
}
}
}
$(function() {
// if ($.fn.DataTable) {
// try {
// $('#requestsTable').DataTable({
// pageLength: 10,
// order: [[0, 'desc']]
// });
// } catch (e) {
// console.error('DataTable init failed', e);
// }
// } else {
// console.warn('DataTables library not loaded');
// }
let currentWellId = null;
let currentRepId = null;
let wellChecked = false;
let repChecked = false;
function setStatus(el, text, type) {
$(el).text(text).removeClass('text-danger text-success text-muted').addClass(type ? 'text-' + type : 'text-muted');
}
function checkSaveButton() {
const canSave = wellChecked && repChecked;
$('#btnSaveRequest').prop('disabled', !canSave);
}
// Inline error helpers
function clearInlineErrors() {
$('#requestModal .is-invalid').removeClass('is-invalid');
$('#requestModal .invalid-feedback.inline-error').remove();
}
function applyErrorTo(selector, message) {
const $el = $(selector);
if (!$el.length) return false;
$el.addClass('is-invalid');
const $feedback = $('<div class="invalid-feedback inline-error"></div>').text(message);
const $grp = $el.closest('.input-group');
if ($grp.length) {
$feedback.insertAfter($grp);
} else {
$feedback.insertAfter($el);
}
return true;
}
function mapWellFieldToSelector(field) {
switch (field) {
case 'water_subscription_number': return '#req_water_sub';
case 'electricity_subscription_number': return '#id_electricity_subscription_number';
case 'water_meter_serial_number': return '#id_water_meter_serial_number';
case 'water_meter_old_serial_number': return '#id_water_meter_old_serial_number';
case 'water_meter_manufacturer': return '#id_water_meter_manufacturer';
case 'new_manufacturer': return '#id_new_manufacturer';
case 'utm_x': return '#id_utm_x';
case 'utm_y': return '#id_utm_y';
case 'utm_zone': return '#id_utm_zone';
case 'utm_hemisphere': return '#id_utm_hemisphere';
case 'well_power': return '#id_well_power';
case 'reference_letter_number': return '#id_reference_letter_number';
case 'reference_letter_date': return '#id_reference_letter_date';
case 'representative_letter_file': return '#id_representative_letter_file';
case 'representative': return '#rep_national_code';
default: return '#id_' + field;
}
}
function mapCustomerFieldToSelector(field) {
switch (field) {
case 'national_code': return $('#id_national_code').length ? '#id_national_code' : '#rep_national_code';
case 'first_name': return '#id_first_name';
case 'last_name': return '#id_last_name';
case 'phone_number_1': return '#id_phone_number_1';
case 'phone_number_2': return '#id_phone_number_2';
case 'card_number': return '#id_card_number';
case 'account_number': return '#id_account_number';
case 'address': return '#id_address';
default: return '#id_' + field;
}
}
function showInlineErrors(errors) {
if (!errors) return;
let nonFieldWell = '';
let nonFieldCustomer = '';
if (errors.well) {
for (const key in errors.well) {
const msgs = Array.isArray(errors.well[key]) ? errors.well[key] : [errors.well[key]];
if (key === '__all__' || key === 'non_field_errors') { nonFieldWell = msgs.join('، '); continue; }
const sel = mapWellFieldToSelector(key);
applyErrorTo(sel, msgs[0]);
}
}
if (errors.customer) {
for (const key in errors.customer) {
const msgs = Array.isArray(errors.customer[key]) ? errors.customer[key] : [errors.customer[key]];
if (key === '__all__' || key === 'non_field_errors') { nonFieldCustomer = msgs.join('، '); continue; }
const sel = mapCustomerFieldToSelector(key);
applyErrorTo(sel, msgs[0]);
}
}
if (nonFieldWell) setStatus('#wellStatus', nonFieldWell, 'danger');
if (nonFieldCustomer) setStatus('#repStatus', nonFieldCustomer, 'danger');
}
$('#btnLookupWell').on('click', function() {
const sub = $('#req_water_sub').val().trim();
if (!sub) { setStatus('#wellStatus', 'لطفا شماره اشتراک آب را وارد کنید', 'danger'); return; }
setStatus('#wellStatus', 'در حال بررسی...', 'muted');
wellChecked = true;
checkSaveButton();
$.get('{% url "processes:lookup_well_by_subscription" %}', { water_subscription_number: sub })
.done(function(resp){
if (resp.exists) {
currentWellId = resp.well.id;
$('#wellFormBlock').show();
// Initialize Persian Date Picker after well form is shown
setTimeout(initPersianDatePicker, 100);
// Prefill well form
$('#id_electricity_subscription_number').val(resp.well.electricity_subscription_number || '');
$('#id_water_meter_serial_number').val(resp.well.water_meter_serial_number || '');
$('#id_water_meter_old_serial_number').val(resp.well.water_meter_old_serial_number || '');
$('#id_water_meter_manufacturer').val(resp.well.water_meter_manufacturer || '');
$('#id_utm_x').val(resp.well.utm_x || '');
$('#id_utm_y').val(resp.well.utm_y || '');
$('#id_utm_zone').val(resp.well.utm_zone || '');
$('#id_utm_hemisphere').val(resp.well.utm_hemisphere || '');
$('#id_well_power').val(resp.well.well_power || '');
$('#id_reference_letter_number').val(resp.well.reference_letter_number || '');
// Prefill date: show Persian in input, keep Gregorian in data attribute
if (resp.well.reference_letter_date) {
try {
if (window.persianDate) {
const gregorianDate = new Date(resp.well.reference_letter_date);
const persianDateObj = new window.persianDate(gregorianDate);
const persianDateString = persianDateObj.format('YYYY/MM/DD');
$('#id_reference_letter_date').val(persianDateString);
} else {
$('#id_reference_letter_date').val(resp.well.reference_letter_date);
}
$('#id_reference_letter_date').attr('data-gregorian', resp.well.reference_letter_date);
} catch (e) {
$('#id_reference_letter_date').val(resp.well.reference_letter_date);
}
} else {
$('#id_reference_letter_date').val('');
$('#id_reference_letter_date').removeAttr('data-gregorian');
}
// Existing representative letter file display
if (resp.well.representative_letter_file_url) {
$('#current-file-display').show();
const fileName = resp.well.representative_letter_file_name || 'فایل موجود';
$('#current-file-name').text(fileName).attr('title', fileName);
$('#id_representative_letter_file').hide();
$('#remove-file').val('false');
} else {
$('#current-file-display').hide();
$('#id_representative_letter_file').show();
$('#remove-file').val('false');
}
setStatus('#wellStatus', 'چاه یافت شد', 'success');
} else {
currentWellId = null;
$('#wellFormBlock').show();
$('#wellFormBlock').find('input, select').val('');
$('#id_reference_letter_date').removeAttr('data-gregorian');
// Reset file UI for new well
$('#current-file-display').hide();
$('#id_representative_letter_file').show().val('');
$('#remove-file').val('false');
// Initialize Persian Date Picker after well form is shown
setTimeout(initPersianDatePicker, 100);
setStatus('#wellStatus', 'چاه یافت نشد. با ذخیره، ایجاد خواهد شد.', 'danger');
}
})
.fail(function(){ setStatus('#wellStatus', 'خطا در بررسی چاه', 'danger'); });
});
$('#btnLookupRep').on('click', function() {
const nc = $('#rep_national_code').val().trim();
if (!nc) { setStatus('#repStatus', 'لطفا کد ملی نماینده را وارد کنید', 'danger'); return; }
setStatus('#repStatus', 'در حال بررسی...', 'muted');
repChecked = true;
checkSaveButton();
$.get('{% url "processes:lookup_representative_by_national_code" %}', { national_code: nc })
.done(function(resp){
if (resp.exists) {
currentRepId = resp.user.id;
$('#repNewFields').show();
// Prefill customer form fields for editing
$('#id_first_name').val(resp.user.first_name || '');
$('#id_last_name').val(resp.user.last_name || '');
if (resp.user.profile) {
$('#id_national_code').val(resp.user.profile.national_code || nc);
$('#id_phone_number_1').val(resp.user.profile.phone_number_1 || '');
$('#id_phone_number_2').val(resp.user.profile.phone_number_2 || '');
$('#id_card_number').val(resp.user.profile.card_number || '');
$('#id_account_number').val(resp.user.profile.account_number || '');
$('#id_address').val(resp.user.profile.address || '');
} else {
$('#id_national_code').val(nc);
$('#id_phone_number_1').val('');
$('#id_phone_number_2').val('');
$('#id_card_number').val('');
$('#id_account_number').val('');
$('#id_address').val('');
}
setStatus('#repStatus', 'نماینده یافت شد.', 'success');
} else {
currentRepId = null;
$('#repNewFields').show();
// Clear form and prefill national code
$('#id_first_name').val('');
$('#id_last_name').val('');
$('#id_national_code').val(nc);
$('#id_phone_number_1').val('');
$('#id_phone_number_2').val('');
$('#id_card_number').val('');
$('#id_account_number').val('');
$('#id_address').val('');
setStatus('#repStatus', 'نماینده یافت نشد. لطفا اطلاعات را تکمیل کنید.', 'danger');
}
})
.fail(function(){ setStatus('#repStatus', 'خطا در بررسی نماینده', 'danger'); });
});
$('#btnSaveRequest').on('click', function(){
const formData = new FormData();
formData.append('csrfmiddlewaretoken', $('input[name=csrfmiddlewaretoken]').val());
formData.append('process', $('#req_process').val());
formData.append('description', $('#req_description').val());
formData.append('water_subscription_number', $('#req_water_sub').val().trim());
if (currentWellId) formData.append('well_id', currentWellId);
if (currentRepId) formData.append('representative_id', currentRepId);
// Send fields using CustomerForm names if visible
const ncField = $('#id_national_code').length ? $('#id_national_code').val() : '';
formData.append('national_code', (ncField || $('#rep_national_code').val().trim()));
formData.append('first_name', $('#id_first_name').val() || '');
formData.append('last_name', $('#id_last_name').val() || '');
formData.append('phone_number_1', $('#id_phone_number_1').val() || '');
formData.append('phone_number_2', $('#id_phone_number_2').val() || '');
formData.append('card_number', $('#id_card_number').val() || '');
formData.append('account_number', $('#id_account_number').val() || '');
formData.append('address', $('#id_address').val() || '');
// Include WellForm fields so edits are saved
if ($('#wellFormBlock').is(':visible')) {
formData.append('electricity_subscription_number', $('#id_electricity_subscription_number').val() || '');
formData.append('water_meter_serial_number', $('#id_water_meter_serial_number').val() || '');
formData.append('water_meter_old_serial_number', $('#id_water_meter_old_serial_number').val() || '');
formData.append('water_meter_manufacturer', $('#id_water_meter_manufacturer').is(':visible') ? ($('#id_water_meter_manufacturer').val() || '') : '');
formData.append('new_manufacturer', $('#id_new_manufacturer').is(':visible') ? ($('#id_new_manufacturer').val() || '') : '');
formData.append('utm_x', $('#id_utm_x').val() || '');
formData.append('utm_y', $('#id_utm_y').val() || '');
formData.append('utm_zone', $('#id_utm_zone').val() || '');
formData.append('utm_hemisphere', $('#id_utm_hemisphere').val() || '');
formData.append('well_power', $('#id_well_power').val() || '');
formData.append('reference_letter_number', $('#id_reference_letter_number').val() || '');
// Use gregorian date if available, otherwise use the field value
const gregorianDate = $('#id_reference_letter_date').attr('data-gregorian');
formData.append('reference_letter_date', gregorianDate || $('#id_reference_letter_date').val() || '');
// Remove flag
formData.append('remove_file', $('#remove-file').val() || 'false');
const repFile = document.getElementById('id_representative_letter_file');
if (repFile && repFile.files && repFile.files[0]) {
formData.append('representative_letter_file', repFile.files[0]);
}
}
const $btn = $(this).prop('disabled', true).text('در حال ذخیره...');
$.ajax({
url: '{% url "processes:create_request_with_entities" %}',
method: 'POST',
data: formData,
processData: false,
contentType: false,
}).done(function(resp){
if (resp.ok) {
showToast('درخواست با موفقیت ثبت شد', 'success');
if (resp.redirect) {
setTimeout(function(){ window.location.href = resp.redirect; }, 800);
} else {
setTimeout(function(){ location.reload(); }, 1200);
}
} else {
const msg = buildErrorMessage(resp);
showToast(msg, 'danger');
}
}).fail(function(xhr){
let msg = 'خطا در ذخیره';
try {
const resp = JSON.parse(xhr.responseText);
msg = buildErrorMessage(resp) || msg;
} catch(e) {}
showToast(msg, 'danger');
}).always(function(){
$btn.prop('disabled', false).text('ذخیره');
});
});
function buildErrorMessage(resp){
if (!resp) return '';
if (resp.error) return resp.error;
if (resp.errors) {
// Collect form-related errors
const parts = [];
if (resp.errors.customer) {
parts.push('خطای نماینده: ' + flattenErrors(resp.errors.customer));
}
if (resp.errors.well) {
parts.push('خطای چاه: ' + flattenErrors(resp.errors.well));
}
return parts.join(' | ');
}
return '';
}
function flattenErrors(errorsObj){
if (typeof errorsObj === 'string') return errorsObj;
try {
const parts = [];
for (const k in errorsObj){
const v = errorsObj[k];
if (Array.isArray(v)) parts.push(`${k}: ${v[0]}`);
else if (typeof v === 'string') parts.push(`${k}: ${v}`);
}
return parts.join('، ');
} catch(e){
return '';
}
}
$('#btnToggleManufacturer').on('click', function() {
const $select = $('#id_water_meter_manufacturer');
const $input = $('#id_new_manufacturer');
const $btn = $(this);
if ($select.is(':visible')) {
$select.hide();
$input.show().focus();
$btn.html('<i class="bx bx-check"></i>');
} else {
$input.hide();
$select.show();
$btn.html('<i class="bx bx-plus"></i>');
}
});
$('#requestModal').on('hidden.bs.modal', function(){
$('#requestForm')[0].reset();
$('#wellFormBlock').hide();
$('#repNewFields').hide();
$('#id_reference_letter_date').removeAttr('data-gregorian');
// Reset file UI
$('#current-file-display').hide();
$('#id_representative_letter_file').show().val('');
$('#remove-file').val('false');
setStatus('#wellStatus', '', '');
setStatus('#repStatus', '', '');
currentWellId = null;
currentRepId = null;
wellChecked = false;
repChecked = false;
checkSaveButton();
clearInlineErrors(); // Clear inline errors on modal close
});
// Handle selecting a new file: hide existing file display and cancel removal flag
$('#id_representative_letter_file').on('change', function() {
if (this.files && this.files.length > 0) {
$('#current-file-display').hide();
$('#remove-file').val('false');
}
});
// Expose remove function
window.removeCurrentFile = function() {
$('#current-file-display').hide();
$('#remove-file').val('true');
$('#id_representative_letter_file').show().val('');
};
// Delete request function
window.deleteRequest = function(instanceId, instanceCode) {
// Set modal content
document.getElementById('deleteConfirmText').textContent = `آیا از حذف درخواست ${instanceCode} اطمینان دارید؟`;
// Show modal
const modal = new bootstrap.Modal(document.getElementById('deleteConfirmModal'));
modal.show();
// Handle confirm button click
document.getElementById('confirmDeleteBtn').onclick = function() {
$.ajax({
url: '{% url "processes:delete_request" 0 %}'.replace('0', instanceId),
type: 'POST',
data: {
'csrfmiddlewaretoken': $('[name=csrfmiddlewaretoken]').val()
},
success: function(response) {
if (response.success) {
showToast(response.message, 'success');
modal.hide();
setTimeout(() => {
window.location.reload();
}, 1500);
} else {
showToast(response.message, 'danger');
}
},
error: function() {
showToast('خطا در ارتباط با سرور', 'danger');
}
});
};
};
});
</script>
{% endblock %}

View file

@ -0,0 +1,97 @@
{% extends '_base.html' %}
{% load static %}
{% load processes_tags %}
{% block sidebar %}
{% include 'sidebars/admin.html' %}
{% endblock sidebar %}
{% block navbar %}
{% include 'navbars/admin.html' %}
{% endblock navbar %}
{% block title %}{{ step.name }} - درخواست {{ instance.code }}{% endblock %}
{% block style %}
<link rel="stylesheet" href="{% static 'assets/vendor/libs/bs-stepper/bs-stepper.css' %}">
{% endblock %}
{% block content %}
{% include '_toasts.html' %}
<div class="container-xxl flex-grow-1 container-p-y">
<div class="row">
<div class="col-12 mb-4">
<div class="d-flex align-items-center justify-content-between mb-3">
<div>
<h4 class="mb-1">{{ step.name }}: {{ instance.process.name }}</h4>
<small class="text-muted d-block">
اشتراک آب: {{ instance.well.water_subscription_number|default:"-" }}
| نماینده: {{ instance.representative.profile.national_code|default:"-" }}
</small>
</div>
<a href="{% url 'processes:request_list' %}" class="btn btn-outline-secondary">بازگشت</a>
</div>
<div class="bs-stepper wizard-vertical vertical mt-2">
{% stepper_header instance step %}
<div class="bs-stepper-content">
<div class="content active dstepper-block">
<div class="content-header mb-3">
<h6 class="mb-0">{{ step.name }}</h6>
<small>{{ step.description|default:' ' }}</small>
</div>
<div class="row g-3">
<div class="col-12">
<div class="alert alert-info">
<h6>وضعیت مرحله:
{% if step_instance %}
{{ step_instance.get_status_display_with_color|safe }}
{% else %}
<span class="badge bg-secondary">در انتظار</span>
{% endif %}
</h6>
<p class="mb-0">فرم این مرحله بعداً پیاده‌سازی می‌شود.</p>
{% if step_instance and step_instance.notes %}
<hr>
<strong>یادداشت‌ها:</strong>
<p class="mb-0">{{ step_instance.notes }}</p>
{% endif %}
</div>
</div>
<div class="col-12 d-flex justify-content-between">
{% if previous_step %}
<a href="{% url 'processes:step_detail' instance.id previous_step.id %}"
class="btn btn-label-secondary">
<i class="bx bx-chevron-left bx-sm ms-sm-n2"></i>
<span class="align-middle d-sm-inline-block d-none">قبلی</span>
</a>
{% else %}
<span></span>
{% endif %}
{% if next_step %}
<a href="{% url 'processes:step_detail' instance.id next_step.id %}"
class="btn btn-primary">
<span class="align-middle d-sm-inline-block d-none me-sm-1">بعدی</span>
<i class="bx bx-chevron-right bx-sm me-sm-n2"></i>
</a>
{% else %}
<button class="btn btn-success" type="button">اتمام</button>
{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{% block script %}
<script src="{% static 'assets/vendor/libs/bs-stepper/bs-stepper.js' %}"></script>
{% endblock %}